/* CSS Document */

*{
	--main-blue: #1473ee;
}

*.demon-gradient{
	background: rgb(72, 136, 255);
	background: linear-gradient(45deg, rgb(72, 146, 255) 0%, rgb(58, 74, 255) 100%);
}

@media screen and (max-width: 865px){
	.topbar .monitor-cluster{
      display:none !important;
  }

  .submission-file{
    max-width:100%;
    width:100%;
  }

}

@media screen and (max-width: 1300px){
   .modal.flag-select.queue-select {
        width: 92%;
   }
}

@media screen and (max-width: 1100px){
   .modal.create-transaction {
        width: 92%;
   }

   .submission-file{
     max-width:100%;
     width:100%;
     margin-right: unset !important;!i;!;
   }
}

@media screen and (max-width:1400px){

  .submission-file{
    margin-right: unset !important;!i;!;
    max-width:100% !important;
    width:100% !important;
  }

	.customer-card div#completed {
		 width: 100%;
 }

 .customer-card [point='communication']>.flex-h>* {
		 width: 100% !important;
		 border-right: unset !important;
 }

 .customer-card [point='communication'] .flex-h {
		 flex-direction: row;
		 flex-wrap: wrap;
		 border: unset;
 }

 .flex-v.midway-tile {
		 border: unset;
 }

 .customer-card [point='communication']>.flex-h>*:nth-child(2) {
		 border-top: 1px solid #e1e1e1;
 }
}

.flag-select .customer-card div#completed {
	 width: 100%;
}

.flag-select .customer-card [point='communication']>.flex-h>* {
	 width: 100% !important;
	 border-right: unset !important;
}

.flag-select .customer-card [point='communication'] .flex-h {
	 flex-direction: row;
	 flex-wrap: wrap;
	 border: unset;
}

.flag-select .flex-v.midway-tile {
	 border: unset;
}

.flag-select .customer-card [point='communication']>.flex-h>*:nth-child(2) {
	 border-top: 1px solid #e1e1e1;
}

.finish-item:last-of-type {
    border-bottom: unset;
}

.search-sidebar.right {
    transform: unset !important;
}

i.mobile-search.fa.fa-search {
    display:none;
}


body {
	background-color:white !important;
	color:#3b3b3b;
	font-family: 'Montserrat', Helvetica, sans-serif;
}

input:not([type='radio']) {
    border-radius: 3px;
    border: none;
    box-shadow: 0 0 2px #00000073;
    width: 160px;
    padding-top: 5px;
    padding-bottom: 5px;
    padding-left: 20px;
    -webkit-appearance: none;
}

.button {
    white-space: nowrap;
    cursor: pointer;
    width: auto;
    width: -moz-fit-content;
    height: fit-content;
    background-color: var(--main-blue);
    color: white;
    border-radius: 5px;
    text-align: center;
    transition: all 100ms;
    padding: 0.5em 2em;
    display: flex;
    align-items: center;
    text-align: center;
}

.header {
    text-align: center;
    padding-top: 18px;
    font-weight: bold;
    color: #494949;
    display: flex;
    justify-content: center;
}

.load-throbber {
    left: 50%;
    top: 44%;
    transform: translateX(-50%) translateY(-50%);
    position: fixed;
    z-index: 30000;
    font-size: 26px;
    height: 60px;
    width: 60px;
}

.throbber {
    height: calc(100% - .4em);
    width: calc(100% - .4em);
    background-color: transparent;
    border-radius: 50%;
    border: .2em solid #ffffff00;
    border-top: .2em solid #303030;
    transition:100ms ease-in-out;
    animation: spin .7s ease-in-out infinite;
    position: relative;
    margin-top: 0em;
}

@-webkit-keyframes spin {
  0% { -webkit-transform: rotate(0deg); border-size:8px; }
  100% { -webkit-transform: rotate(360deg); }
}

@keyframes spin {
  0% { transform: rotate(0deg); }
  100% { transform: rotate(360deg); }
}


.login {
    width: 400px;
    height: 300px;
    left: 50%;
    top: 40%;
    position: absolute;
    transform: translate(-50%,-50%);
    box-shadow: 0px 1px 7px #00000085;
    border-radius: 3px;
    overflow: hidden;
}


.login__header-bar {
    width: 100%;
    height: 40px;
    background-color: var(--main-blue);
    position:relative;
    z-index: 2;
}

.login__header-bar__header {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    padding-left: 30px;
    color: white;
    font-weight: bold;
}

.login__header-bar .reset {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    right: 30px;
    color: white;
    font-size: 10px;
    cursor: pointer;
    user-select: none; -webkit-user-select: none; -webkit-user-select: none; -webkit-user-select: none;
}

form.login__login-form {
    width: auto;
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    top: 30%;
}

form input {
    display: block;
    margin-top: 10px;
    width: 200px;
    top:31%;
}

.login__submit-button {
    bottom: 40px;
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    border-radius: 5px;
    text-align: center;
    cursor: pointer;
}

.topbar {
    width: 100%;
    transition: all 300ms;
    height: 50px;
    background-color: var(--main-blue);
    top: 0px;
    left: 0px;
    position: relative;
    z-index: 4;
    box-shadow: 0 0 5px #0000007a;
    display: flex;
    align-items: center;
    color: white;
}

.item.logout {
    float: right;
    margin-right: 30px;
}

.item.system {
    float: right;
    margin-right: 50px;
}

.topbar.main-topbar .item.search, .topbar.main-topbar>*:nth-child(3) {
}

.topbar .item, .detail-down .item, .topbar .display-item {
    color: white;
    font-size: 17px;
    font-weight: 100;
    position: relative;
    cursor: pointer;
    transition: all 200ms;
    transform: translateY(-6%);
    padding: 5px 15px 5px 15px;
    margin-top: 2px;
}

.user-detail {
    position: relative;
    color: white;
    font-weight: 100;
    font-size: 17px;
    cursor: pointer;
    width: fit-content;
    text-align: center;
    z-index: 2;
    user-select: none; -webkit-user-select: none; -webkit-user-select: none; -webkit-user-select: none;
    margin-right: 30px;
}

.threebar{
	display:none;
}

.detail-down {
    position: absolute;
    right: 10px;
    top: 50px;
    height: auto;
    width: 190px;
    background-color: rgb(66, 81, 255);
    box-shadow: 0px 1px 5px #0000007a;
    border-radius: 2px;
    z-index: 3;
    display: flex;
    flex-direction: column;
}

.detail-down .item {
    text-align: center;
    width: auto;
    margin: unset !important;
    top: unset;
    margin-top: 5px !important;
    font-size: 16px;
    padding-bottom: 15px;
    transform: unset;
}

.detail-down .item:first-of-type {margin-top: 15px !important;}

.detail-down .item:last-of-type {
}

.topbar .monitor-cluster {
    display: flex;
    overflow: visible;
    margin-left: auto;
}

.topbar.main-topbar .monitor-cluster {margin-left: auto;margin-right: 30px;padding-left: 30px;}

.topbar .monitor-item {
    width: auto;
    background-color: white;
    height: 30px;
    border-radius: 3px;
    cursor: pointer;
    display: inline-block;
    margin-right: 8px;
    position: relative;
    box-shadow: 0 0 3px #00000029;
    overflow: hidden;
    white-space: nowrap;
    flex-shrink: 0;
}

.topbar .monitor-item .fa {
    top: 50%;
    transform: translateY(-50%);
    position: absolute;
    margin-left: 6px;
    font-size: 13px;
}

.monitor-item .count {
    text-align: right;
    top: 50%;
    transform: translateY(-50%);
    position: relative;
    padding-left: 29px;
    padding-right: 8px;
    color: #3b3b3b;
}

.sidebar {
    position: absolute;
    left: 0px;
    width: 250px;
    transition: all 300ms;
    height: calc(100%);
    box-shadow: 2px -1px 6px #00000030;
    z-index: 3;
    background-color: white;
    overflow-y: scroll;
}

.sidebar .item {
    text-align: left;
    padding-top: 10px;
    padding-left: 20px;
    cursor: pointer;
    padding-bottom: 10px;
    position: relative;
    transition: all 100ms;
}

.sidebar .item:nth-child(2) {
    margin-top: 27px;
}

.sidebar .item:hover {
    background-color: #e9e9e9;
}

.sidebar .item.open {
    background-color: #56a6fd;
    color: white;
}

.sidebar .item i.fa.fa-angle-right {
    opacity: 0;
    transition: opacity 100ms;
    right: 8px;
    position: absolute;
    top: 50%;
    color: white;
    transform: translateY(-50%);
}

.sidebar .item.open i.fa-angle-right {
    opacity: 1;
}

body>.management, body .account-info-data{
    width: 100%;
    position: absolute;
    top: 50px;
    height: calc(100% - 50px);
    overflow-y: scroll;
    overflow-x: hidden;
}


.sidebar-page .header {
    font-size: 17px;
}

.user-list {
    transform: translateX(-50%);
    position: absolute;
    left: 50%;
    width: fit-content;
    margin-top: 30px;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
}

.user-list .user {
    background-color: #ffffff;
    width: 200px;
    height: 100px;
    color: #3b3b3b;
    position: relative;
    margin: 10px;
    box-shadow: 0 0 5px #0000006b;
    border-radius: 6px;
}

.user-list .user i.fa.fa-user {
    display: inline-block;
    margin-right: 2px;
    margin-left: 2px;
}

.user-list .user .username {
    display: inline-block;
    font-size: 13px;
    margin-right: 0px;
    margin-left: 0px;
}

.user-list .user .mid {
    text-align: center;
    top: 37%;
    transform: translateY(-50%);
    position: absolute;
    width: 100%;
}

.user-list .user .actions {
    position: absolute;
    bottom: 20px;
    left: 50%;
    transform: translateX(-50%);
}

.user-list .user .actions>* {
    margin-left: 10px;
    margin-right: 10px;
    cursor: pointer;
}

.user-list .admin,.user-list .pending {
    right: 11px;
    position: absolute;
    top: 5px;
    font-size: 10px;
}

.add:not(button) {
    display: block;
    position: relative;
    left: 12%;
    cursor: pointer;
    position: relative;
    width: fit-content;
    width: -moz-fit-content;
}

.add:not(button) * {
    margin-left: 5px;
    margin-right: 5px;
}

.darken {
    width: 125%;
    height: 100%;
    position: fixed;
    top: 0px;
    left: 0px;
    z-index: 4;
    background-color: #0000005e;
}

.new-user, .new-mailmerge, .new-backing {
    position: fixed;
    left: 50%;
    top: 50%;
    transform: translate(-50%,-50%);
    width: 500px;
    height: 310px;
    background-color: white;
    overflow: hidden;
    border-radius: 3px;
}

.content {
    width: 100%;
    height: 100%;
    transition: all 400ms;
    position: absolute;
    overflow-y: scroll;
    overflow-x: hidden;
    top: 0px;
    left: 0px;
    transform: translate(0,0);
}

.content.left {
    transform: translate(-100%);
}

.content.right {
    transform: translateX(100%);
}

.management .create.button {
    bottom: 39px;
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
}

.new-user input.username {
    width: 200px;
    left: 50%;
    position: absolute;
    transform: translateX(-50%);
    margin-top: 55px;
}

.new-user input.creation {
    width: 200px;
    position: relative;
    display: inline-block;
    position: relative;
    left: unset;
    margin-top: unset;
}

input[type="checkbox"] {
    border: none;
    box-shadow: none;
    width: auto;
    -webkit-appearance: checkbox;
}

.admin-select {
    left: 50%;
    transform: translateX(-50%);
    top: 135px;
    width: 150px;
}

.user-list .pending {
    left: 11px;
}

.new-user div.creation {
    margin-top: 96px;
    position: absolute;
    left: 50%;
    white-space: nowrap;
    transform: translateX(-50%);
}

.new-user .creation * {
}

.new-user .creation .fa-clipboard {
    cursor: pointer;
    position: absolute;
    margin-left: 12px;
    margin-top: 2px;
}

.monitor-cluster .monitor-extension {
    position: absolute;
    width: 200px;
    height: 106px;
    background-color: #446aff;
    left: 50%;
    transform: translateX(-50%);
    top: 49px;
    box-shadow: 0 0 10px #00000052;
    border-radius: 4px;
    cursor: default;
}

.monitor-cluster .monitor-extension::after {content: "";width: 18px;height: 18px;position: absolute;top: -5px;left: 50%;transform: translateX(-50%) rotate(45deg);background-color: #446aff;z-index: -1;}

.monitor-extension .active-series-item {
    color: white;
    text-align: center;
    margin-top: 10px;
    position: absolute;
    width: calc(100% - 67px);
    right: 0px;
    height: 100%;
}

.left-image,.right-info {
    display: inline-block;
    position: absolute;
}

.right-info {
    position: absolute;
    left: 0px;
    margin-top: 0px;
    text-align: center;
    width: 100%;
    font-size: 5px;
    height: 35px;
    align-items: center;
    display: flex;
    justify-content: center;
}

img.left-series-item-img {
    height: 86px;
    margin-top: 9px;
    border-radius: 3px;
    margin-left: 13px;
    object-fit: fill;
    border-radius: 4px;
    overflow: hidden;
}

.monitor-extension .right-info .series-item {
    color: white;
    margin-top: 1px;
    font-size: 12px;
    font-weight: 100;
    text-align: center;
    margin-left: 5px;
    margin-right: 5px;
}

.monitor-extension .button.manage-series-item {
    font-size: 13px;
    height: 17px;
    width: 96px;
    background-color: white;
    color: black;
    bottom: 22px;
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
}

.sidebar-page .list-container, .new-mailing .list-container, .letter-selector .list-container, .content.printing .list-container {
    width: 80%;
    left: 10%;
    display: flex;
    position: absolute;
    margin-top: 60px;
    justify-content: center;
    flex-wrap: wrap;
}

*:not(.letter-viewer)>.letter {
    position: relative;
    width: 150px;
    height: 200px;
    background-color: white;
    border-radius: 4px;
    color: #3b3b3b;
    margin-right: 20px;
    margin-left: 20px;
    margin-bottom: 40px;
    box-shadow: 0 0 7px #0000004a;
}

.letter>i.fa {
    font-size: 40px;
    left: 50%;
    position: absolute;
    transform: translateX(-50%);
    top: 30%;
}

.letter .header {
    font-size: 10px;
    font-weight: lighter;
    margin: 0px 5px;
}

.letter .actions {
    white-space: nowrap;
    position: absolute;
    bottom: 30px;
    left: 50%;
    transform: translateX(-50%);
}

.letter .actions * {
    margin-left: 10px;
    margin-right: 10px;
    cursor: pointer;
}

.letter .letter-id {
    position: absolute;
    width: 100%;
    text-align: center;
    top: 54%;
    font-size: 10px;
}

.sidebar.left, .search-sidebar.left, .history-sidebar.left {
    transform: translateX(-100%);
}

.search-sidebar,.history-sidebar {
    transition:all 200ms;
    width: 250px;
    height: calc(100%);
    position: absolute;
    left: 0px;
    background-color: white;
    box-shadow: 2px -1px 6px #00000030;
    overflow: scroll;
    z-index: 2;
    display: flex;
    flex-direction: column;
}

.primary-info input {
    position: relative;
    margin: auto;
}

.primary-info .info-box {
    margin-top: 9px;
    position: relative;
    height: 22px;
    display: flex;
}

.primary-info .info-box:first-of-type {
}

.search-sidebar .primary-info {
    margin-top: 3px;
    margin-bottom: 30px;
}

.search-sidebar .info-box.separator {
    margin-top: 30px;
}

body>.customer-list,body>.customer-card {
    left: 250px;
    position: absolute;
    top: 50px;
    width: calc(100% - 250px);
    height: calc(100% - 50px);
    z-index: -2;
    transform: rotate(0deg);
    overflow-x: hidden;
}

.customer-list .list {
    width: 90%;
    margin-top: 36px;
    left: 50%;
    transform: translateX(-50%);
    position: absolute;
    min-width: 500px;
    max-width: 900px;
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
}

.customer, .large-object {
    background-color: #ffffff;
    overflow: hidden;
    cursor: pointer;
    position: relative;
    margin-bottom: 9px;
    display: flex;
    flex-direction: column;
    box-shadow: 0 0 7px #00000047;
    border-radius: 5px;
    font-weight: 100;
    font-size: 12px;
    width: 340px;
    margin: 10px;
}

.customer .customer-header i.fa, .large-object i.fa {
    padding-left: 20px;
    color: #5266ff;
    top: 20px;
    left: 20px;
}

.customer .item {
    padding-left: 20px;
    display: inline-block;
    vertical-align: middle;
}

.customer .name {
}

.customer .item.address {
    font-size: 12px;
    position: absolute;
    padding-right: 23px;
    right: 0px;
    max-width: 50%;
    text-align: right;
}

.customer .mid {
    top: 50%;
    position: absolute;
    transform: translateY(-50%);
    width: 100%;
}

.customer-card .card-names {
    position: relative;
    color: black;
    width: fit-content;
    display: flex;
    z-index: 1;
    flex-direction: column;
}

.identity .card-names .card-name, .identity .credential-identity {
    transition: all 300ms;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #3b3b3b;
    padding-top: 10px;
    border: 1px solid #3b3b3b;
    padding-bottom: 10px;
    padding-left: 20px;
    padding-right: 20px;
    border-radius: 6px;
    height: fit-content;
    font-size: 16px;
    margin-bottom: 10px;
    background-color: white;
    height: 18px;
}

.customer-card .record-type i.fa {
    color: #2e34cf;
    margin-left: 10px;
}

.customer-card .main>.actions, .customer-card .main>.status {
    position: absolute;
    right: 16px;
    top: 16px;
    padding: 11px;
    z-index: 1;
    color: white;
    display: flex;
    flex-direction: column;
    text-align: center;
}

.customer-card .main>.actions * {
    margin-bottom: 17px;
    color: #3d3d3d;
    font-size: 21px;
    cursor: pointer;
}

.customer-card .actions *:last-of-type, .customer-card .status *:last-of-type {
    margin-bottom: unset;
}

.card-names .account-detail {
    color: black;
}

.customer-card .account-status {display: inline-block;margin-left: 30px;}

.customer-info {
    position: relative;
    width: 400px;
    padding-bottom: 29px;
    margin-left: 20px;
    margin-right: 20px;
    z-index: 1;
    height: fit-content;
    margin-top: 20px;
    height: -moz-fit-content;
}

.customer-info .item {
    left: 50%;
    position: relative;
    transform: translateX(-50%);
    margin-top: 3px;
    margin-left: 10px;
    height: 24px;
}

.customer-info .item * {
    top: 50%;
    position: absolute;
    transform: translateY(-50%);
}

.customer-info .item .title {position: absolute;left: 25px;width: 100px;font-size: 14px;}

.customer-info .item input {
    right: 30px;
    height: 11px;
    width: 186px;
}

.customer-info .item:nth-child(3) {
    margin-top: 20px;
}

.customer-card .tags:not(.object-container) {
    position: relative;
    display: inline-block;
    width: auto;
    height: 20px;
    margin-left: 34px;
}

.customer-card .tags .tag {
    display: inline-block;
    margin-right: 8px;
    padding-left: 10px;
    padding-right: 10px;
    padding-top: 5px;
    padding-bottom: 5px;
    background-color: #297be5;
    color: white;
    border-radius: 2px;
}

.customer-info.notes {
    width: 380px;
    margin-top: 20px;
    min-height: 100px;
    margin-bottom: 20px;
}

i.fa.fa-arrow-left.back {
	cursor:pointer;
	position: fixed;
	left: 22px;
	top: 21px;
	font-size: 20px;
	z-index: 1;
}

.customer-card .pii-container {margin-top: 20px;display: flex;justify-content: space-evenly;padding-left: 50px;padding-right: 50px;flex-wrap: wrap;}

.customer-card .transactions, .open-documents .documents, .customer-card .campaigns {
    position: relative;
    background-color: #ffffffc4;
    margin-bottom: 50px;
    padding-bottom: 30px;
    padding-top: 30px;
    margin-bottom: 20px;
}

body {
    overflow: hidden;
    transition: all 300ms;
    transform: scale3d(1,1,1);
    top: 0px;
    left: 0px;
    height: 100%;
    width: 100%;
    position: fixed;
    margin: unset;
}

.transaction, .customer-card .document {
    height: 50px;
    margin-top: 15px;
    width: 100%;
    position: relative;
    background-color: #ffffff;
    color: #3b3b3b;
    cursor: pointer;
    white-space: nowrap;
    display: flex;
    align-items: center;
    box-shadow: 0 0 5px #00000040;
    border-radius: 6px;
    font-size: 13px;
    font-weight: lighter;
}

.transaction .item,.document .item,.log .item {
    position: relative;
    margin-left: 10px;
    display: flex;
    align-items: center;
    color: #3b3b3b;
    max-width: 215px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    padding-right: 10px;
}

.transaction>i.fa, .open-documents .document>i.fa, .open-documents .document>i.fas {
    position: relative;
    margin-left: 20px;
}

.transactions .fa-clock-o {
    margin-right: 6px;
}

.customer-card .new {
    position: absolute;
    margin-top: 20px;
    margin-left: 20px;
    color: #313131;
    cursor: pointer;
    user-select: none; -webkit-user-select: none; -webkit-user-select: none; -webkit-user-select: none;
}

.customer-card .transactions .header {
    margin-bottom: 33px;
}

.new-transaction, .new-document, .add-manual-history-items {
    width: 550px;
    height: 400px;
    top: 47%;
    transform: translate(-50%,-50%);
    left: 50%;
    position: absolute;
    background-color: white;
    z-index: 4;
    border-radius: 3px;
    overflow: hidden;
}

.new-transaction .header {
    position: relative;
    width: 100%;
}

.transaction-types {
    left: 50%;
    transform: translateX(-50%);
    margin-top: 60px;
    position: relative;
    width: 250px;
    justify-content: center;
    display: flex;
    flex-wrap: wrap;
}

.transaction-type {
    width: 100%;
    text-align: center;
    padding-top: 5px;
    padding-bottom: 5px;
    padding-left: 20px;
    padding-right: 20px;
    background-color: white;
    color: #3b3b3b;
    cursor: pointer;
    margin-top: 10px;
    border-radius: 5px;
    box-shadow: 0 0 6px #00000040;
}

.payment-info {
    position: relative;
    left: 60px;
    width: fit-content;
    height: 22px;
    display: flex;
    align-items: center;
}

.payment-info select.payment-type {margin-right: 20px;}

.payment-info input {
    margin-right: 10px;
    width: 90px;
}

.payment-info input:last-of-type {
    margin-right: unset;
    width: 100px;
}

.section {
    padding-left: 36px;
    font-size: 15px;
    font-weight: bold;
    color: #656565;
    margin-top: 11px;
    margin-bottom: 10px;
}

.section:first-of-type {
    margin-top: 52px;
}

.campaign-data {
    left: 60px;
    position: relative;
}

.shipping-note {
    height: 48px;
    width: 320px;
    background-color: white;
    box-shadow: 0 0 6px #00000036;
    padding: 10px;
    padding-top: 10px;
    overflow-y: scroll;
    text-align: left;
    border-radius: 7px;
}

.gift-giver {
    font-size: 13px;
    color: #545454;
    left: 60px;
    position: relative;
}

.next {
    position: absolute;
    width: 40px;
    height: 40px;
    background-color: #2c88f0;
    border-radius: 100%;
    color: white !important;
    bottom: 20px;
    left: 50%;
    transform: translateX(-50%);
    cursor: pointer;
    user-select: none; -webkit-user-select: none; -webkit-user-select: none; -webkit-user-select: none;
    transition: background-color 200ms;
}

.next i {
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%,-50%);
}

input.error,.error {background-color: #e83c3c2b !important;}

.new-transaction i.back {
    top: 19px !important;
    left: 23px !important;
}

.finish-list {
    left: 50%;
    transform: translateX(-50%);
    position: relative;
    transition: height 200ms;
    overflow-y: hidden;
    height: fit-content;
    height: -moz-fit-content;
    padding: 1px;
}

.finish-item {
    padding-left: 30px;
    padding-right: 30px;
    position: relative;
    padding-top: .8em;
    padding-bottom: .8em;
    border-bottom: 1px solid #ececec8f;
    display: flex;
    align-items: center;
    justify-content: space-between;
    font-weight: lighter;
}

.switch {
    transition: background-color 200ms;
    width: 40px;
    height: 22px;
    border-radius: 27px;
    background-color: lightgrey;
    display: inline-block;
    position: relative;
    user-select: none; -webkit-user-select: none; -webkit-user-select: none; -webkit-user-select: none;
}

.switch:not(.true)::after {transform: translateY(-48%);left: 3px;}

.switch::after {
    content: "";
    height: 17px;
    width: 17px;
    background-color: white;
    position: absolute;
    border-radius: 100%;
    transition: all 200ms;
    top: 50%;
}

.switch.true::after {transform: translateY(-48%);left: calc(100% - 20px);}

.switch.true {
    background-color: #63c363;
}

.finish-item>* {
    display: inline-block;
}

.finish-item>.switch, .finish-item>input, .finish-item>.assignment, .finish-item>.value, .finish-item>select, .finish-item>.button {
    cursor: pointer;
    text-align: right;
    display: flex;
    align-items: center;
}

li>.switch, li>input, li>.assignment, li>.value,li>select, li>.button {
    display: flex;
    align-items: center;
    margin-left: auto;
}

.new-transaction .button.create {
    bottom: 30px;
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
}
.pii-container .customer-info i.fa.fa-pencil-alt {
    position: absolute;
    top: 12px;
    right: 14px;
    cursor: pointer;
}

.pii-container.customer-container {
    left: 50%;
    transform: translate(-50%,-50%);
    position: absolute;
    top: 54%;
    z-index: 1;
}

.customer-container .card-names {
    color: white;
    width: 50%;
    left: 50%;
    transform: translateX(-50%);
    position: relative;
    margin-bottom: 20px;
    z-index: 1;
}

.customer-container .customer-info.pii .fa-pencil-alt {
    display: none;
}

.customer-container .button.create {
    left: 50%;
    position: relative;
    transform: translateX(-50%);
    margin-top: 37px;
}

i.fa.fa-arrow-left.back.body {
    top: 80px;
}

.card-names i {
    color: #585858;
    cursor: pointer;
    padding-right: 5px;
    padding-left: 5px;
    margin-left: auto;
}

*:not(.pii-container)>.card-names>.card-name[contenteditable] {
    background-color: #416bffb8;
}

.customer-card .content.settings .finish-list {
    width: 56%;
    min-width: 450px;
}

.confirm {
    background-color: white;
    width: 483px;
    height: 221px;
    position: absolute;
    top: 46%;
    transform: translateY(-50%) translateX(-50%);
    left: 50%;
    border-radius: 3px;
    z-index: 15 !important;
    padding: 10px 20px;
}

.confirm .description {
    text-align: center;
    margin-top: 30px;
}

.confirm .button.confirm-button {
    bottom: 30px;
    position: absolute;
}

.confirm .button.confirm-button.cancel {
    left: 50px;
}

.button.confirm-button.continue {
    right: 50px;
}

.not-found {
    position: absolute;
    width: 300px;
    height: auto;
    top: 40%;
    left: 50%;
    transform: translateX(-50%) translateY(-50%);
    background-color: white;
}

.not-found i {
    font-size: 70px;
    text-align:  center;
    width: 100%;
    color: #b83b3b;
}

.recent-series-item-large,.new-series-item-large {
    position: relative;
    width: 500px;
    height: 200px;
    margin-top: 25px;
    box-shadow: 0 0 9px #0000002b;
    border-radius: 3px;
    left: 50%;
    transform: translateX(-50%);
}

.recent-series-item-large.first {
    margin-top: 50px;
}

.series-item-image img,.series-item-image {
    height: 175px;
    max-width: 125px;
    object-fit: contain;
}

.series-item-image {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    margin-left: 14px;
    border-radius: 3px;
    overflow: hidden;
    height: 175px;
    max-width: 165px;
}

.right-container {
    width: calc(100% - 125px);
    left: 125px;
    position: absolute;
    height: 100%;
}

.recent-series-item-large .actions {
    position: absolute;
    bottom: 10px;
    right: 10px;
}

.customer-list .actions>* {
    cursor: pointer;
    margin-top: 20px;
}

.recent-series-item-large .container-item,.new-series-item-large .container-item {
    margin-top: 20px;
    left: 50%;
    transform: translateX(-50%);
    white-space: nowrap;
    position: relative;
    width: fit-content;
    display: block;
    width: -moz-fit-content;
}

.right-container .container-item>* {
    display: inline-block;
    margin-right: 13px;
}

.right-container input {
    display: inline-block;
}

.container-item.link {
    color: #005ccf;
    cursor: pointer;
}

.recent-series-item-large.first .actions {
    bottom: unset;
    right: unset;
    width: 100%;
}

.recent-series-item-large .finish-item {
    margin-top: 15px;
}

.button.makeactive {
    left: 50%;
    transform: translateX(-50%);
    position: relative;
    margin-top: 20px;
}

.recent-series-item-large.first .container-item {
    margin-top: 10px;
}

.recent-series-item-large:last-of-type {
    margin-bottom: 50px;
}


.sidebar.orders .item {
    font-size: 12px;
}

.order-fill {
    position: absolute;
    left: 250px;
    top: 50px;
    width: calc(100% - 250px);
    height: calc(100% - 50px);
    overflow: hidden;
}


.settings-group {
    left: 50%;
    transform: translateX(-50%);
    position: relative;
    width: fit-content;
    margin-top: 45px;
    box-shadow: 0 0 4px #0000004a;
    width: -moz-fit-content;
}

.settings-item {
    width: 492px;
    height: 40px;
    padding-left: 75px;
    line-height: 40px;
    background-color: #ffffff;
    border-bottom: 1px solid #dedede;
    cursor: pointer;
}

.settings-group .title {
    font-weight: bold;
    color: #464646;
    padding-left: 20px;
    margin-bottom: 10px;
    position: absolute;
    top: -25px;
}

.settings-item:last-of-type {
    border-bottom:unset;
}

.settings-item::after {content: "\f105";position: absolute;font-family: "Font Awesome 5 Free", "Font Awesome 5 Pro";font-weight: 900;right: 25px;color: #3a3a3a;}

.setting-page .finish-list {
    width: 60%;
}

.new-mailmerge .letter {
    cursor:pointer;
}

.new-mailmerge .letter.upload {
    position: absolute;
    left: 50px;
    bottom: 30px;
    height: 150px;
}

.new-mailmerge .letter.create {
    right: 50px;
    position: absolute;
    bottom: 30px;
    height: 150px;
}

.new-mailmerge .letter .desc {
    position: absolute;
    width: 100%;
    text-align: center;
    color: #3b3b3b;
    top: 65%;
    font-size: 10px;
}

.html-upload input[type="file"] {width: 200px;display: inline-block;}

.content.html-upload .button.upload {
    position: absolute;
    bottom: 30px;
    left: 50%;
    transform: translateX(-50%);
}

.new-mailmerge .letter-name {
}

.letter-viewer {
    position: relative;
    background-color: #f0f0f0;
    width: fit-content;
    max-width: 9in;
    height: calc(100% - 40px);
    overflow: scroll;
    border-radius: 3px;
    display: flex;
    padding-top: 20px;
    padding-bottom: 20px;
    box-shadow: 0 0 5px #00000042;
}

.letter-viewer .letter {
    width: fit-content;
    position: relative;
    margin-top: 30px;
}

.letter-viewer .cmd-bar {
    width: 100%;
    height: 38px;
    box-shadow: 0px 0px 4px black;
    position: absolute;
    top: -12px;
}

.letter-viewer-modal .cmd-bar {
    position: relative;
    padding-top: 6px;
    padding-bottom: 16px;
    right: 0px;
    height: fit-content;
	height: -moz-fit-content;
    background-color: white;
    color: #3b3b3b;
    width: 50px;
    border-radius: 4px;
    display: flex;
    vertical-align: top;
    margin-left: 15px;
    white-space: normal;
    box-shadow: 0 0 6px #00000057;
    flex-direction: column;
    align-items: center;
}

.cmd-bar {}

.letter-viewer-modal .cmd-bar .fa {
    margin-top: 16px;
    margin-bottom: 6px;
}

.user-id-desc {
    text-align: center;
    font-size: 9px;
    width: fit-content;
    padding-top: 0px;
    padding-bottom: 5px;
    padding-left: 3px;
    padding-right: 3px;
}

.cmd-bar .switch {font-size: 11px;margin-top: -4px;margin-bottom: 10px;}

.letter-viewer-modal {
    top: 0px;
    width: fit-content;
    position: absolute;
    height: 86%;
    top: 53%;
    left: 50%;
    transform: translate(-50%,-50%);
    white-space: nowrap;
    z-index: 4;
    display: flex;
    justify-content: space-between;
    transition: all 300ms cubic-bezier(0.55, 0.09, 0.68, 0.53);
}

.letter-small {
    transform: scale(0.42) translateX(-50%) translateY(-50%);
    width: 7.5in;
    height: 10in;
    position: relative;
    margin: unset;
    top: 0px;
    overflow: hidden;
    overflow-y: scroll;
    transform-origin: 0 0;
    left: 50%;
    top: 48%;
    padding-left: 1in;
    padding-right: 1in;
    padding-top: .5in;
    box-shadow: 0 0 11px #0000003b;
}

.new-document {
}

.new-document .title, .campaign-email-send .send .title, .section-title {
    padding-left: 30px;
    font-weight: bold;
    color: #3b3b3b;
    font-size: 15px;
    margin-top: 30px;
}

.new-document .main-item,.section-item {
    padding-left: 60px;
    margin-top: 10px;
    font-size: 12px;
    display: inline-block;
}

.new-document .change {
    display: inline-block;
    font-size: 10px;
    padding-left: 11px;
    color: #2930d4;
    font-weight: bold;
    cursor: pointer;
}

.new-document .finish-list {
    max-width: 85%;
    margin-top: 10px;
}

.finish-item input {
    padding-right: 10px;
    cursor: text;
}

.new-document .button.create {
    position: absolute;
    bottom: 30px;
    left: 50%;
    transform: translateX(-50%);
}

.document .fa-clock-o {
    padding-right: 5px;
}

.documents .header {
    margin-bottom: 33px;
}

.revision, .sidebar-object {
    height: 40px;
    background-color: #f5f5f5;
    width: 100%;
    position: relative;
    color: #3b3b3b;
    cursor: pointer;
    padding: 2px 0px;
    transition: all 200ms;
    border-bottom: 4px solid white;
}

.history-sidebar .primary-info {
    margin-top: 15px;
}

.revision-date {
    transform: translateY(-50%);
    font-size: 12px;
    position: absolute;
    top: 50%;
    padding-left: 19px;
}

.revision-number {
    position: absolute;
    font-size: 12px;
}

.click {
    font-size: 14px;
    position: absolute;
    right: 18px;
    top: 50%;
    transform: translateY(-50%);
    cursor: context-menu;
}

.history-sidebar i.fa.fa-arrow-left {
    position: absolute;
    top: 20px;
    left: 14px;
}

.revision.open, .sidebar-object.open {
    background-color: #487ef8;
    color: white;
}

.revision:not(.open):hover, .sidebar-object:not(.open):hover {background-color: #487ef8b5;color: white;}

.log-list-bottombar {
    position: fixed;
    width: 100%;
    bottom: 0px;
    height: 55px;
    background-color: #5836ff;
    left: 0px;
}

.log-list-bottombar>.fa {
    color: white;
    font-size: 28px;
    top: 50%;
    transform: translateY(-50%);
    padding-right: 44px;
    padding-left: 44px;
    position: absolute;
    cursor: pointer;
}

.log-list-bottombar i.fa.fa-angle-right {
    right: 0;
}

.display-block {
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    width: 300px;
    height: 100%;
}

.log-list-bottombar .display-block * {
    color: white;
}

.log-list-bottombar .desc {
    width: 100%;
    text-align: center;
    font-size: 10px;
    margin-top: 5px;
}

.desc .goback {
    display: inline-block;
    color: #b7bdff;
}

.display-block-items>* {
    position: relative;
    display: inline-block;
    width: 50px;
    height: 50px;
}

.display-block .display-block-items {
    display: flex;
    justify-content: center;
    margin-top: 5px;
}

.display-block-items .fa {
    left: 50%;
    transform: translateX(-50%);
    position: relative;
}

.display-block-items .text {
    text-align: center;
    font-size: 10px;
}

.mid-modal {
    width: 300px;
    top: 40%;
    position: absolute;
    left: 50%;
    transform: translate(-50%,-50%);
    box-shadow: 0 0 12px #00000021;
}

.mid-modal .header {
    font-size: 15px;
}

.mid-modal div#flag-viewer {
    margin-top: 40px;
    margin-bottom: 25px;
    left: 50%;
    position: relative;
    transform: translateX(-50%);
}

.log {
    width: 80%;
    height: 45px;
    max-width: 900px;
    background-color: white;
    color: #3b3b3b;
    box-shadow: 0 0 7px #0000004a;
    position: relative;
    left: 50%;
    transform: translateX(-50%);
    margin-bottom: 14px;
    display: flex;
    border-radius: 6px;
    align-items: center;
}

.log:nth-child(2) {
    margin-top: 30px;
}

.log>i.fa.fa {
    padding-left: 17px;
    font-size: 12px;
}

.customer-card .item .fa, .item .fas {
    margin-right: 5px;
    margin-left: 5px;
    font-size: 8px;
}

.log .item:first-of-type {
    cursor: pointer;
    min-width: 279px;
}

.itemlist {
    position: relative;
    height: 200px;
    width: calc(100% - 20px);
    display: block;
    padding-left: 20px;
    padding-right: 20px;
    padding-top: 20px;
    padding-bottom: 14px;
    overflow: hidden;
    border-radius: 6px;
    border: 1px solid #00000014;
    box-shadow: inset 0 0 12px #0000001f;
    background-color: #fbfbfb;
}

.itemlist .item, .product-container .item {
    height: 160px;
    user-select: none; -webkit-user-select: none; -webkit-user-select: none;
    min-width: 115px;
    width: 120px;
    border-radius: 3px;
    overflow: hidden;
    padding: 5px;
    padding-right: 10px;
    position: relative;
    transition: all 200ms;
}

.itemlist .item img, .itemlist .item .outline, .product-container .item img, .product-container .item .outline {
    border-radius: 5px;
    transition: 200ms filter;
    height: 100%;
    max-width: 85%;
    object-fit: contain;
    transition: all 200ms;
}

.itemlist .item>.fa, .product-container .item>.fa {
    position: absolute;
    color: white;
    z-index: 1;
    top: 40%;
    left: 50%;
    margin: unset;
    cursor: pointer;
    transform: translate(-50%,-50%);
    display: none;
}

.itemlist .item .modify, .product-container .item .modify  {
    position: absolute;
    top: 84%;
    left: 50%;
    transform: translateX(-50%);
    white-space: nowrap;
}

.itemlist .item .modify>*, .product-container .item .modify>* {
    display: inline-block;
}

.itemlist .item .modify>.fa, .product-container .item .modify>.fa {
    cursor: pointer;
}

.itemlist .item:hover>.fa, .product-container .item:hover>.fa {
    display: block;
}

.itemlist .order-item input {
    width: calc(70px - 25px);
}

.itemlist .order-item {
    width: 100%;
}

.itemlist .order-item .title, .product-container .order-item .title {
    width: 100%;
    text-align: center;
    font-size: 15px;
    font-weight: bold;
    margin-bottom: 5px;
    color: #4e4e4e;
}

.itemlist .order-item, .product-container .itemlist .order-item{
    top: 50%;
    transform: translateY(-50%) translateX(-50%);
    position: relative;
    height: 50px;
    left: 50%;
    width: fit-content;
}

.itemlist .order-item .fa-plus, .product-container .order-item .fa-plus  {
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    margin: unset;
    top: 54%;
    color: #2d2d2d;
    font-size: 20px;
    cursor: pointer;
}

.itemlist .new {
    position: fixed;
    z-index: 1;
    background-color: white;
    margin-left: -10px;
    padding-left: 7px;
    padding-right: 7px;
    width: fit-content;
}

.itemlist .new select.item-select {
    left: 50%;
    transform: translateX(-50%);
    position: relative;
}

.item[pos="1"] {
    margin-left: 156px;
}

.itemlist .item.new .desc {
    width: 100%;
    text-align: center;
    font-size: 10px;
}

.itemlist .item.new .desc.sel {
    margin-top: 5px;
}

.itemlist .item.new .desc.sel.success {
    color: green;
}

.order-pack {
    width: 60%;
    max-width: 1000px;
    height: 68%;
    background-color: white;
    z-index: 3;
    position: absolute;
    top: 53%;
    left: 50%;
    transform: translate(-50%,-50%);
    overflow: hidden;
}

.order-pack .itemlist {
    width: calc(80% - 20px);
    left: 10%;
    position: absolute;
    top: 43%;
    transform: translateY(-50%);
    padding-top: 22px;
    padding-bottom: 0px;
}

.order-pack .content.letters .letters, .order-pack .content.emails .letters {
    margin-bottom: 20px;
    left: 50%;
    transform: translateX(-50%);
    position: relative;
    width: calc(8.5in * .4);
    margin-top: 50px;
    margin-bottom: 100px;
}

.order-pack .letters .letter-small {
    top: 0px !important;
    transform: translateY(0px) scale(0.42) translateX(-50%);
    position: absolute;
}

.order-pack .title {
    position: absolute;
    top: 23%;
    transform: translateY(-50%);
    padding-left: 65px;
    font-weight: bold;
    color: #353535;
    font-size: 12px;
}

.itemlist .item .name {
    position: absolute;
    z-index: 1;
    color: white;
    font-size: 10px;
    width: auto;
    text-align: center;
    top: 19%;
    display: none;
    left: 50%;
    width: auto;
    transform: translateX(-50%);
}

.itemlist .item:hover .name {
    display: block;
}

.item.added {
}

.itemlist .item>.fa-check {
    color: green;
    display: block;
}

.itemlist .item.added img {
    filter: brightness(.25);
}


.itemlist .item:not(.added)>.fa-check {
    display: none;
}

.order-pack .letters embed {
    width: calc(8.5in * .4);
    height: calc(11in * .4);
    transform-origin: 0 0;
    margin-bottom: 30px;
    box-shadow: 0 0 13px #00000036;
}



.order-pack .content.letters .button {
    left: 50%;
    transform: translateX(-50%);
    position: relative;
}

.order-pack .content.main .finish {
    position: absolute;
    bottom: 30px;
    left: 50%;
    transform: translateX(-50%);
}

.new-transaction .itemlist, .add-manual-history-items .itemlist {
    margin-left:20px;
    width: calc(100% - 80px);
}

.donor-list {
    position: fixed;
    width: 500px;
    height: 600px;
    left: 50%;
    transform: translateX(-50%) translateY(-50%);
    top: 54%;
    background-color: white;
    z-index: 4;
    padding-left: 40px;
    padding-right: 40px;
    padding-top: 30px;
    overflow: scroll;
    padding-bottom: 20px;
}

.create-series-item {
    position: fixed;
    left: 50%;
    transform: translate(-50%,-50%);
    top: 50%;
    width: 600px;
    height: 432px;
    background-color: white;
    z-index: 4;
}

.create-series-item .button.finish {
    bottom: 30px;
    left: 50%;
    transform: translateX(-50%);
    position: absolute;
}

.create-series-item .title {
    padding-left: 60px;
    font-weight: bold;
    color: #444444;
    margin-top: 20px;
    font-size: 15px;
}

.create-series-item>input {
    margin-left: 49px;
    margin-top: 10px;
    width: 300px;
}

.create-series-item .container-item {
    margin-top: 0px;
    right: 0px;
}

.create-series-item .header[contenteditable] {
    color: #ca2311;
}

.campaign-card {width: 100%;left: 0;height: 100%;overflow: scroll;}

.campaign-setup {
    height: 479px;
    width: 620px;
    position: fixed;
    z-index: 4;
    left: 50%;
    top: calc(25px + 50%);
    transform: translateX(-50%) translateY(-50%);
    background-color: white;
    box-shadow: 0 0 9px #00000038;
    overflow: hidden;
    border-radius: 5px;
}

.campaign-setup .finish-list {
    margin-top: 10px;
    width: 100%;
}

.campaign .campaign-setup .main>.title {
    font-weight: bold;
    padding-left: 30px;
    margin-top: 20px;
    color: #2e2e2e;
}

select.populationsort, input.autoinclude,input.campaign-code {
    margin-left: 30px;
}

.campaign-setup .autoinclude .title {
    display: inline-block;
    margin-right: 20px;
}

.campaign-setup .main>.switch {
    margin-top: 10px;
}

.campaign-setup .population {
    display: flex;
    margin-top: 10px;
    margin-left: 40px;
}

.campaign-setup .modifications {
    position: relative;
    width: 90%;
    left: 5%;
    margin-top: 25px;
    max-height: 400px;
    height: 265px;
}

.campaign-setup .mod {
    width: 100%;
    height: 44px;
    background-color: #3ba7ff;
    color: white;
    margin-bottom: 10px;
    position: relative;
}

.campaign-setup .mod>* {
    position: relative;
    top: 50%;
    transform: translateY(-50%);
    margin-left: 20px;
    display: inline-block;
}

.campaign-setup .mod .fa-trash {
    position: absolute;
    right: 20px;
    cursor: pointer;
}

.campaign-setup .automod .fa-plus {
    position: absolute;
    top: 20px;
    right: 30px;
    cursor: pointer;
}

.new-automod {
    position: fixed;
    width: 500px;
    height: 231px;
    background-color: white;
    z-index: 4;
    top: 47%;
    left: 50%;
    transform: translate(-50%,-50%);
    border-radius: 5px;
}

.new-automod .title {
    padding-left: 30px;
    font-weight: bold;
    color: #454545;
    margin-top: 12px;
}

.new-automod select.order-type {
    margin-left: 31px;
    margin-top: 10px;
}

.new-automod select.clarification {
    margin-left: 20px;
}

input.price-change {
    margin-top: 10px;
    margin-left: 32px !important;
}

.new-automod input {
    width: 109px;
    margin-left: 10px;
}

.new-automod .button.finish {
    bottom: 22px;
    left: 50%;
    transform: translateX(-50%);
    position: absolute;
}

.campaign-setup .mod-item {
    height: 100%;
}

.campaign-setup .mod-item .mod-desc {position: absolute;text-align: center;font-size: 10px;margin-top: 2px;white-space: nowrap;left: 50%;transform: translateX(-50%);}

.campaign-setup .automod .mod input {
    top: 50%;
    position: relative;
    transform: translateY(-25%);
    width: 53px;
}

.campaign-setup .button.finish {
    position: absolute;
    bottom: 30px;
    left: 50%;
    transform: translateX(-50%);
}

.sidebar .fa-plus {
    position: absolute;
    right: 30px;
    top: 22px;
    cursor: pointer;
}

.sidebar .header {
    margin-bottom: 20px;
}

.campaign-setup .title-item {
    position: absolute;
    left: 257px;
    top: 85px;
}

input.autoinclude, input.campaign-code {
    margin-top: 17px;
}

.campaign-basic-info,.campaign-actions {
    display: inline-block;
    height: 100px;
    background-color: white;
    color: #3b3b3b;
    width: 300px;
    box-shadow: 0 0 10px #00000026;
    position: relative;
    margin-bottom: 14px;
    border-radius: 4px;
}

.code {
    text-align: center;
    font-weight: bold;
    color: #2a2a2a;
    top: 38%;
    position: absolute;
    width: 100%;
}

.campaign-desc {
    font-size: 10px;
    text-align: center;
    padding-top: 10px;
}

.campaign-card .campaign-basic-info .desc-container {
    bottom: 10px;
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
}

.campaign-basic-info .desc-container .desc-item * {
    display: inline-block;
}

.campaign-basic-info .desc-container .desc-item *:first-of-type {
    margin-right: 2px;
}

.campaign-basic-info .desc-container .desc-item {
    display: inline-block;
    margin-left: 5px;
    margin-right: 5px;
}

.campaign-basic-info i.fa.fa-cog {
    position: absolute;
    margin-left: 10px;
    margin-top: 10px;
    cursor: pointer;
}

.report-tiles {
    margin-left: 20px;
    margin-right: 20px;
    width: -webkit-fill-available;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
}

.report-tiles>.tile {margin-bottom: 20px;margin-right: 20px;}

.report-tiles>.tile.large {
    width: 100%;
    height: 100px;
    margin-bottom: 20px;
}

.report-tiles>.tile.small {
    width: auto;
    height: auto;
}

.campaign-card .actions {
    position: fixed;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    right: 50px;
    top: 20px;
    color: #3b3b3b;
    font-size: 17px;
    z-index: 2;
}

.email-send-dialog {
    width: 500px;
    left: 50%;
    position: absolute;
    top: 50%;
    transform: translate(-50%,-50%);
    height: 300px;
    background-color: white;
    z-index: 3;
    box-shadow: 0 0 9px #0000002e;
}

.load-throbber .fa {
    color: green;
    font-size: 18px;
    position: absolute;
    left: 50%;
    transform: translate(-50%,-12%);
    top: 50%;
}

.throbber.stop {
    animation: unset;
    opacity: 0;
}

.email-send-dialog .check-list .load-throbber {
    transform-origin: 0 0;
    transform: scale(.5,.5) translateY(-50%);
    left: unset;
    position: relative;
}

.check-list {
    width: 80%;
    height: auto;
    position: relative;
    left: 50%;
    transform: translateX(-50%);
    margin-top: 20px;
}

.check-list .check {
    height: 50px;
    position: relative;
    display: flex;
    justify-content: left;
    border-bottom: 1px solid #dfdfdf;
}

.action-text {
    line-height: 50px;
    font-size: 16px;
    text-align: right;
    width: -webkit-fill-available;
    white-space: nowrap;
    padding-right: 10px;
}

.load-throbber .fa-clock-o {
    color: #282828;
}

.email-send-dialog .check-list {
    top: 37%;
    transform: translate(-50%, -50%);
    position: absolute;
}

.email-send-dialog .button.close {
    position: absolute;
    bottom: 30px;
    left: 50%;
    transform: translateX(-50%);
}

.load-throbber .fa-times {
    color: red;
}

.email-send-dialog .button.error-manage,.email-send-dialog .button.error-close {
    position: absolute;
    bottom: 30px;
}

.email-send-dialog .button.error-close {
    left: 50px;
}

.email-send-dialog .error-manage {
    right: 50px;
}

.email-send-dialog .error-container .title {
    text-align: center;
    top: 46px;
    position: absolute;
    color: #800f0f;
    width: calc(100% - 20px);
    font-size: 10px;
    padding-left: 10px;
}

.tag-extra {
    position: absolute;
    color: white;
    border-radius: 3px;
    margin-left: 30px;
    top: 71px;
    font-size: 10px;
    display:flex;
    flex-wrap: wrap;
    max-width: 40%;
    justify-content: left;
}

.tag-extra .tag {
    background-color: #28952c;
    box-shadow: 0 0 3px #00000085;
    padding-top: 6px;
    padding-bottom: 6px;
    padding-left: 10px;
    padding-right: 10px;
    border-radius:3px;
    margin-bottom: 5px;
    margin-right: 10px;
    margin-right: 6px;
}


.content.open-settings .finish-list {
    width: 69%;
}

.campaign-card .actions>* {
    cursor: pointer;
    margin-left: 0px;
    margin-right: 20px;
}

.campaign-bar {
    width: 100%;
    height: 38px;
    left: 50%;
    transform: translateX(-50%);
    position: relative;
    background-color: #ffffff;
    color: #3b3b3b;
    box-shadow: 0px -2px 5px #00000033;
    display: flex;
    justify-content: center;
    margin-bottom: 50px;
    border-bottom: 1px solid #00000024;
}

.campaign-card .actions>*:last-of-type {
    margin-right: unset;
}

.campaign-bar .bar-item {
    position: relative;
    top: 50%;
    transform: translateY(-50%);
    display: inline-block;
    padding: 5px 20px;
    cursor: pointer;
    line-height: 29px;
    min-width: 100px;
    text-align: center;
    border-right: 1px solid #d6d6d6;
}


.campaign-tab {
    width: -webkit-fill-available;
    position: relative;
}

.campaign-tab.population .campaign-pop {
    width: 80%;
    left: 10%;
    position: relative;
    padding-top: 20px;
}

.campaign-pop .customer .name {
    cursor: pointer;
}

.campaign-pop .customer {
    cursor: default;
}

.campaign-actions .button {
    left: 50%;
    position: relative;
    transform: translateX(-50%);
    margin-top: 13px;
}

.campaign-email-send {
    position: fixed;
    width: 762px;
    height: 500px;
    left: 50%;
    top: 50%;
    transform: translate(-50%,-50%);
    background-color: white;
    z-index: 4;
    border-radius: 3px;
    overflow: hidden;
}

.campaign-email-send input.subject-line {
    margin-top: 20px;
    width: 300px;
    margin-left: 30px;
}

.campaign-email-send>.header {
    position: absolute;
    width: 100%;
}

.campaign-email-send .subhead {
    width: 100%;
    text-align: center;
    margin-top: 42px;
}

.campaign-email-send .invalid-emails {
    margin-top: 30px;
    width: 80%;
    left: 10%;
    height: 283px;
    position: relative;
    overflow: scroll;
    overflow-x: hidden;
    padding-right: 20px;
}

.campaign-email-send .finish-list {
    width: 80%;
    margin-top: 11px;
}

.campaign-email-send .list-container {
    overflow: hidden;
    overflow-y: scroll;
    max-height: 251px;
    margin-top: 10px;
}

.campaign-email-send .content:not(.send) .title {
    margin-top: 20px;
    text-align: center;
    font-weight: lighter;
}

.content.attachments .list-container {
    max-height: 303px;
}

.campaign-email-send .email-preview-address {
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    width: 250px;
    top: 27%;
}

.campaign-email-send .preview-address {
    margin-top: 10px;
    width: calc(100% - 20px);
}

.campaign-email-send .email-preview-address .button {
    left: 50%;
    position: relative;
    transform: translateX(-50%);
    margin-top: 22px;
    padding-left: 20px;
    padding-right: 20px;
}

.campaign-email-send .finish {
    left: 50%;
    position: absolute;
    transform: translateX(-50%);
    bottom: 30px;
}

input.schedule-send {
    margin-left: 20px;
}

.campaign-email-send .campaign-email-schedule {
    display: flex;
    position: relative;
    margin-top: 20px;
    margin-left: 40px;
}

.campaign-email-schedule .switch {margin-top: 2px;}

.campaign-email-send .letter.selected {
    background-color: #43a143;
}

.campaign-email-send .letter {
    cursor: pointer;
}

.order-pack .letters {
}

.letter-small.print {
    background-color: gray;
}

.letter-item {
    position: relative;
    width: calc(8.5in * .42);
    height: calc(11in * .42);
    margin-bottom: 20px;
}

.order-pack .button.finish {
    left: 50%;
    transform: translateX(-50%);
    position: relative;
    bottom: 20px;
}

.order-pack .letters .next {
    position: relative;
}

.new-document .preview .letter-item,.new-document .preview-email .letter-item {
    left: 50%;
    transform: translateX(-50%);
    margin-top: 30px;
}

.letter {
    white-space: normal;
}

.settings .print-backings, .choose-backing .print-backings {
    width: 80%;
    left: 10%;
    position: absolute;
    margin-top: 30px;
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
}

.print-backings .backing {
    width: 170px;
    height: 220px;
    box-shadow: 0 0 6px #00000047;
    margin-right: 20px;
    margin-left: 20px;
    margin-bottom: 40px;
    position: relative;
    transition: all 200ms;
    border-radius: 14px;
    overflow: hidden;
}

.print-backings .backing img {
    width: 100%;
    height: 100%;
    overflow: hidden;
    object-fit: cover;
}

.print-backings .backing .title {
    font-size: 11px;
    text-align: center;
    margin-top: 18px;
    position: absolute;
    width: 100%;
    color: white;
    z-index: 2;
}

.print-backings .actions {
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    display: flex;
    z-index: 2;
    color: white;
    top: 45%;
}

.print-backings .actions>* {
    margin-right: 20px;
    margin-left: 20px;
    font-size: 20px;
    cursor: pointer;
}

.print-backings .backing:hover {
}

.print-backings .backing:hover img {
    filter: brightness(0.3);
}

.print-backings .backing:not(:hover) .title {
    display: none;
}

.print-backings .backing:not(:hover) .actions {
    display: none;
}

.setting-page .content>i.fa.fa-plus {
    position: absolute;
    left: 40%;
}

.setting-page .add {
    top: 33px;
}

.new-backing .button {
    position: absolute;
    bottom: 30px;
    left: 50%;
    transform: translateX(-50%);
}

.new-backing input[type='file'] {
    top: 44%;
    width: 200px;
    left: 50%;
    position: absolute;
    transform: translateX(-50%);
}

.new-backing input.backing-name {
    position: relative;
    left: 50%;
    transform: translateX(-50%);
    margin-top: 50px;
    width: 200px;
}

.gift-search>* {
    display: inline-block;
    color: #2c6bdf;
    cursor: pointer;
}

.gift-search {
    padding-left: 5px;
    padding-right: 5px;
    position: relative;
    padding-top: 5px;
    padding-bottom: 5px;
    margin-top: 1px;
    font-size: 15px;
    margin-left: 55px;
    display: inline-block;
}

.gift-search .fa {
    margin-right: 5px;
    font-size: 12px;
    transform: translateY(-6%);
}

.assocview {
}

.assocview>* {
}

.search-sidebar .subtext {
    font-size: 11px;
    text-align: center;
    position: absolute;
    width: 100%;
}

.customer-card .associate {
    right: -30px;
    z-index: 2;
    position: absolute;
    transform: translateX(100%) translateY(-50%);
    top: 50%;
    white-space: nowrap;
}

.gift-giver .fa-trash {
    margin-left: 10px;
    cursor:pointer;
}

.merge-editor-body {
    position: fixed;
    top: 50px;
    width: 100%;
    left: 0px;
    height: calc(100% - 50px);
    background-color: #dadada;
    overflow-y: scroll;
    z-index: 1;
    overflow-x: hidden;
}

.letter-error {
    left: 50%;
    transform: translateX(-50%);
    position: absolute;
    top: 30%;
}

.letter-error i.fa.fa-exclamation-triangle {
    font-size: 50px;
    color: #ba1616;
    left: 50%;
    transform: translateX(-50%);
    position: relative;
}

.letter-error .text {
    margin-top: 20px;
}

.merge-letter-content {
    left: 50%;
    width: fit-content;
    position: relative;
    transform: translateX(-50%);
    margin-top: 60px;
    margin-bottom: 50px;
    outline: unset;
    transform-origin: 0 0;
}

.merge-letter-content.print{
    overflow: unset;
}

.merge-letter-content {}

.merge-letter-content .content {
    background-color: white;
    outline: unset;
    box-shadow: 0 0 9px #00000036;
}

.merge-letter-content .content {
    position: relative;
    overflow-y: scroll;
    overflow-x: hidden;
    margin-bottom: 70px;
}

.merge-editor-body .gbar {
    width: 100%;
    height: 50px;
    background-color: white;
    z-index: 2;
    transition: all 400ms;
    display: flex;
    position: relative;
}

.gbar {}

.merge-editor-body .gbar.shadow {
}

.gbar .action {
    position: relative;
    top: 50%;
    transform: translateY(-50%);
    display: inline-block;
    height: 20px;
    margin-right: 13px;
    padding: 3px;
    border-radius: 3px;
    cursor: pointer;
    color: #383838;
}

.gbar .action:first-of-type {
    margin-left: 20px;
}

.action>* {
    vertical-align: middle;
}

.gbar .action:hover {
    background-color: #e9e9e9;
}

.separator {
    border-radius: 3px;
    width: 1px;
    margin-left: 5px;
    margin-right: 13px;
    height: 24px;
    top: 50%;
    transform: translateY(-50%);
    position: relative;
    background-color: #d0d0d0;
}

.gbar .action.active {
    color: #3f8bff;
}

.ruler-top {
    z-index: auto;
    width: 100%;
    height: 15px;
    top: 100px;
    border-top: 1px solid #bdbdbd;
    border-bottom: 1px solid #bdbdbd;
}

.ruler-side {
    height: 100%;
    position: absolute;
    width: 15px;
    top: calc(50px + 17px);
    border-right: 1px solid #bdbdbd;
    border-left: 1px solid #bdbdbd;
    z-index: 0 !important;
}

.ruler {
    z-index: 2;
    background-color: white;
}

.merge-topbar {
    position: fixed;
    width: 100%;
    box-shadow: 0 0 7px #00000069;
    z-index: 3;
}

.insert-variable, .insert-text,.insert-link {
    width: 400px;
    height: 200px;
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
    background-color: white;
    box-shadow: 0 0 12px #00000047;
    z-index: 4;
    border-radius: 3px;
}

select {}

.insert-variable .button, .insert-text .button,.insert-link .button {
    left: 50%;
    transform: translateX(-50%);
    position: absolute;
    bottom: 30px;
}

.insert-variable input {
    left: 50%;
    transform: translateX(-50%);
    position: relative;
    margin-top: 29px;
}

.insert-text .code, .insert-text .text, .insert-link .code,.insert-link .text {
    width: 200px;
    left: 50%;
    top: 27%;
    transform: translateX(-50%);
    position: absolute;
    text-align: left;
    font-weight: normal;
}

.insert-text .text,.insert-link .text {
    top: 45%;
    width: 84%;
}

.gbar .action#settings {position: absolute;right: 10px;}

.page {
    width: -webkit-fill-available;
    height: -webkit-fill-available;
    outline: unset;
    position: absolute;
    -webkit-margin-collapse: discard;
}

.merge-editor-body .settings {
    height: calc(100% - 117px);
    width: 250px;
    position: fixed;
    top: 117px;
    right: 0px;
    background-color: #507fff;
    box-shadow: 0 0 7px #00000075;
    transition: all 300ms ease-in-out;
}

.merge-editor-body .settings.right {
    transform: translateX(100%);
}

.merge-editor-body .settings .header {
    color: white;
    margin-bottom: 10px;
}

.merge-editor-body .setting-item>* {
    display: inline-block;
    color: white;
    margin-top: 8px;
    vertical-align: middle;
    line-height: 20px;
}

.merge-editor-body .setting-item {
    padding-left: 15px;
    padding-right: 15px;
    display: flex;
    justify-content: space-between;
    margin-top: 8px;
    align-items: center;
}

.merge-editor-body .setting-item select {
    color: black;
}

.merge-editor-body .setting-item .button {
    font-size: 10px;
    width: 45px;
    height: 11px;
    line-height: 11px;
    color: black;
    background-color: white;
    min-width: unset;
}

.merge-editor-body div.setting-item#backing {
}

.merge-editor-body .settings .button.close {
    color: black;
    background-color: white;
    bottom: 30px;
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    font-size: 14px;
}

.merge-letter-content.landscape .content {
    width: 11in;
    height: calc(8.5in - 2in);
}

.choose-backing {
    width: 600px;
    height: 400px;
    left: 50%;
    transform: translate(-50%,-50%);
    position: fixed;
    top: 48%;
    z-index: 4;
    background-color: white;
    border-radius: 3px;
    overflow: scroll;
}

.choose-backing .print-backings {
    margin-top: 30px;
}


.choose-backing .backing {
    cursor: pointer;
}

.merge-letter-content.print .content {height: 11in;}

.merge-editor-body .settings input.letter-name {
    left: 50%;
    transform: translateX(-50%);
    position: relative;
    margin-top: 10px;
    margin-bottom: 20px;
}

.letter-viewer-modal .cmd-bar .fa-download, .letter-viewer-modal .cmd-bar .fa-print {
    color: #5151ff;
    cursor:pointer;
}

input[type="number"] {}

div#font-size input {
    width: 30px;
    text-align: left;
    padding-left: 10px;
    z-index: 3;
}

div#font-size:hover {
    background-color: unset;
}

#font-color .fa-font,#background-color .fa-highlighter {
    transform: translateY(-1px) scale(.88);
    transform-origin: 0 0;
}

#font-color .color-sample,#background-color .color-sample {
    width: 90%;
    height: 2px;
    background-color: #3ecde3;
    transform: translateY(-1.6px) translateX(-57%);
    left: 50%;
    position: relative;
}

.content.preview .fa-download {
    position: absolute;
    top: 20px;
    right: 44px;
    cursor: pointer;
    color: #3a3aff;
}

.user-access-settings {
    position: fixed;
    width: 800px;
    height: 600px;
    left: 50%;
    transform: translate(-50%,-50%);
    background-color: white;
    top: calc(25px + 50%);
    z-index: 4;
    border-radius: 6px;
    padding-bottom: 23px;
    box-shadow: 0 0 6px #0000003d;
    overflow-y: scroll;
}

.user-access-settings .finish-list {
    margin-top: 18px;
    width: 80%;
}

.campaign-tab.population i.fa.fa-download {
    position: absolute;
    right: 12%;
    top: 20px;
    color: #3578f4;
    cursor: pointer;
}

.log .item:nth-of-type(2) {
}

.welcome-dialog {
    width: 100%;
    height: 100%;
    position: fixed;
    top: 0;
    left: 50%;
    transform: translate(-50%,0px);
    background-color: #4892ff;
    box-shadow: 0 0 9px #00000061;
    border-radius: 3px;
    z-index: 3;
}

.welcome-dialog .header {
    color: white;
    font-size: 30px;
    top: 20%;
    position: relative;
}

.welcome-dialog .subhead {
    width: 100%;
    text-align: center;
    color: white;
    margin-top: 10px;
    position: absolute;
    top: calc(20% + 60px);
}

.welcome-dialog .content.main {
}

.welcome-dialog .next {
    background-color: white;
    bottom: 100px;
}

.field-export .main .header {
    padding-bottom: 20px;
    box-shadow: 1px 5px 5px #0000000f;
}

.welcome-dialog .content:not(.main) .header {
    top: 10%;
}

.welcome-dialog .content:not(.main) .subhead {
    top: calc(10% + 50px);
    width: 86%;
    left: 50%;
    transform: translateX(-50%);
}

.welcome-dialog .welcome-content {
    top: 25%;
    height: 75%;
    position: absolute;
    width: 100%;
}

.skip-onboard {
    color: white;
    text-decoration: underline;
    cursor: pointer;
    position: absolute;
    bottom: 50px;
    right: 100px;
    z-index: 1;
}

.welcome-dialog .back {
    color: white;
}

.qr {
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    width: 300px;
    height: 300px;
    background-color: white;
    border-radius: 3px;
    margin-top: 27px;
}

.welcome-dialog .button {
    color: black;
    background-color: white;
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    top: 14%;
}

.contact .welcome-content input {
    display: block;
    margin-bottom: 10px;
    width: 200px;
    padding: 10px;
    left: 50%;
    transform: translateX(-50%);
    position: relative;
}

.contact .welcome-content input:first-of-type {
    margin-top: 100px;
}

.welcome-dialog .button.finish {
    bottom: 100px;
    position: absolute;
    top: unset;
}

.attempt-twofactor-enable {
    background-color: white;
    width: 500px;
    height: 500px;
    z-index: 4;
    position: fixed;
    left: 50%;
    transform: translate(-50%,-50%);
    top: 50%;
    border-radius: 6px;
}

.attempt-twofactor-enable .subhead {
    font-size: 10px;
    text-align: center;
    margin-top: 2px;
    color: #4e4e4e;
    left: 50%;
    width: -webkit-fill-available;
    padding-left: 50px;
    padding-right: 50px;
}

.attempt-twofactor-enable canvas {
    width: 250px;
    height: 250px;
    left: 50%;
    transform: translateX(-50%);
    position: relative;
    margin-top: 41px;
    margin-bottom: 34px;
}

.attempt-twofactor-enable input[type="text"] {
    position: relative;
    left: 20%;
}

.attempt-twofactor-enable input {
    width: 231px;
    margin-top: 30px;
    margin-left: 30px;
}

.attempt-twofactor-enable .button {
    display: inline-block;
    margin-left: 20px;
}

.twofactor-enabled {
    width: 300px;
    left: 50%;
    position: absolute;
    transform: translateX(-50%);
    height: 50px;
    margin-top: 77px;
}

.subhead.twofa-sub {
    white-space: normal;
    max-width: 550px;
    left: 50%;
    transform: translateX(-50%);
}

.key-list .key-item {
    width: 200px;
    height: 64px;
    position: relative;
    color: #3b3b3b;
    padding-left: 20px;
    padding-right: 20px;
    padding-top: 10px;
    padding-bottom: 10px;
    display: flex;
    flex-direction: row;
    margin-bottom: 10px;
    padding: 16px 16px;
    margin: 10px;
    border-radius: 5px;
    box-shadow: 0 0 7px #0000004a;
    align-items: center;
    justify-content: center;
}

.key-list .key-item * {
    font-size: 12px;
}

.api-access .key-list {
    margin-top: 30px;
    flex-direction: row;
    display: flex;
    width: 100%;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
}

.key-list .key-item .private-key {
    min-width: 360px;
    filter: blur(3px);
    cursor: pointer;
    transition: all 200ms;
}

.key-list .key-item .fa-trash {
    cursor: pointer;
}

.key-list .key-item .public-key {
    min-width: 110px;
}

.pager {
    width: 175px;
    left: 0px;
    top: 117px;
    position: fixed;
    height: calc(100% - 117px);
    background-color: white;
    box-shadow: 0 0 4px #00000061;
    overflow: scroll;
    overflow-x: hidden;
    scroll-behavior: unset;
    -ms-overflow-style: none;
    z-index: 2;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: center;
}

.pager__page-item {
    width: 130px;
    margin-top: 11.46px;
    margin-bottom: 11.46px;
    height: 173px;
    background-color: white;
    position: relative;
    box-shadow: 0 0 4px #00000059;
    border-radius: 0px;
    flex-shrink: 0;
    flex-grow: 0;
}

.pager__page-item .title {
    text-align: center;
    padding-top: 10px;
    font-size: 12px;
}

.pager__page-item:last-of-type {
    margin-bottom: 500px;
}

.pager__page-item::-webkit-scrollbar {
    display: none;
}

.pager::-webkit-scrollbar {
    display: none;
}

.pager__page-item.new-page i.fa.fa-plus {
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%,-50%);
    font-size: 22px;
}

.pager__page-item.new-page {
    cursor: pointer;
}

.letter-viewer .pagebreak {
    width: 200%;
    height: 40px;
    left: 50%;
    transform: translateX(-50%);
    position: relative;
    background-color: gray;
}

.letter-viewer .merge-letter-content {
    left: 50%;
    margin-top: unset;
}

.letter-small .merge-letter-content {
    left: 50%;
    margin-top: unset;
}

.pager__page-item .fa-trash {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
    font-size: 20px;
    cursor: pointer !important;
}

.pager__page-item:not(.new-page) {cursor: grab;}

.letter-viewer .letter:not(.print) {
    width: 8in;
    background-color: white;
    padding-left: 1in;
    padding-right: 1in;
    padding-top: 1in;
    padding-bottom: 1in;
    margin-bottom: .5in;
    display: inline-block;
    height: fit-content;
	height: -moz-fit-content;
}

.letter-viewer .letter:not(.print) .pagebreak {
    background-color: unset;
    height: unset;
}

.insert-link .text {
    top: 35%;
}

.color-grid>*:not(.color-indicator) {
    background: linear-gradient(to right, #fff 0%,transparent 100%);
}

.color-grid>*:not(.color-indicator) {
	height: 100%;
	width: 100%;
	position: absolute;
	border-radius: 2px;
}

.to-white {
    background: linear-gradient(to bottom, transparent 0%, #000 100%) !important;
}

.insert-color {
	user-select:none;
	top: 50%;
	width: 200px;
	height: 310px;
	background-color: white;
	position: absolute;
	z-index: 4;
	left: 50%;
	transform: translate(-50%,-50%);
	border-radius: 5px;
}

.insert-color .output-color {
    width: 16px;
    height: 16px;
    background-color: green;
    border-radius: 100%;
}

.insert-color .label {
    padding-left: 12px;
    font-size: 12px;
    font-weight: lighter;
    color: #272727;
    margin-top: 12px;
}

.insert-color .color-output {
    height: 20px;
    margin-bottom: 28px;
    margin-top: 28px;
    display: flex;
    padding-left: 11px;
    position: relative;
}

.insert-color .color-output .label {
    margin-top: unset;
    line-height: 18px;
    padding-right: 10px;
    margin-left: unset;
    margin-right: unset;
    width: unset !important;
    margin-left: 20px;
}

.insert-color input {
    width: 50px;
}

.insert-color .color-grid {
    width: 90%;
    left: 5%;
    position: relative;
    height: 120px;
    border-radius: 4px;
    overflow: hidden;
    background-color: #ff0000;
}

.color-grid .color-indicator {
    position: absolute;
    z-index: 2;
}

.color-indicator {
	transform: translateY(-50%) translateX(-50%);
    height: 16px;
    position: relative;
    width: 16px;
    background-color: white;
    box-shadow: 0 0 7px #00000047;
    border-radius: 100%;
}

.color-grid .color-indicator{
	top:100%;
	left:0px;
}

.color-indicator .indicator {
    width: 12px;
    height: 12px;
	top:50%;
    background-color: #e91e1e;
    border-radius: 100%;
    left: 50%;
    transform: translate(-50%,-50%);
    position: absolute;
}

.insert-color .color-main {
    position: absolute;
    width: 89%;
    height: 12px;
    background-color: blue;
    border-radius: 11px;
    margin-top: 9px;
    left: 50%;
    transform: translateX(-50%);
    background: linear-gradient(to right, red 0%, #ff0 17%, lime 33%, cyan 50%, blue 66%, #f0f 83%, red 100%);
}

.insert-color .button {
    width: 50px;
    bottom: 17px;
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
}

.color-main .color-indicator {
    top: 50%;
}

.account-info:not(.item) {
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    width: 60%;
    margin-top: 18px;
    background-color: #ffffff47;
    box-shadow: 0 0 0px #0000000d;
    margin-bottom: 50px;
}

.account-info .info-item {
    padding-left: 65px;
    margin-top: 14px;
    box-shadow: 0px -1px 7px #00000040;
    border-radius: 4px;
    padding-top: 20px;
    padding-bottom: 30px;
}

.account-info .title {
    font-weight: bold;
    color: #464646;
    margin-bottom: 20px;
}

.account-info .item-block {}

.account-info .text-item {
    margin-top: 10px;
    margin-left: 10px;
}

.account-info .item-block .button {
    margin-top: 10px;
    margin-right: 40px;
}

.item-block.twofa {
}

.item-block.twofa .button.change {
    display: inline-block;
}

.account-info .header {
    font-size: 21px;
    margin-bottom: 51px;
}

.info-item.password .item-block {
    display: flex;
    justify-content: space-between;
}

.disabled-alert {
    color: #700000;
    font-size: 12px;
    margin-top: -10px;
}

.item-block.twofa {}

.item-line-item {
    display: flex;
    justify-content: space-between;
    width: 100%;
    margin-right: 48px;
    margin-bottom: 20px;
}

.info-item.contact .item-block {
    margin-right: 40px;
}

.search-sidebar.widen {
    width: 400px;
}

.advanced-more {
    position: absolute;
    bottom: 0px;
    height: 50px;
    width: 100%;
    background-color: white;
    box-shadow: 1px -4px 4px #00000012;
    overflow: hidden;
}

.advanced-info .advanced-item {
    display: flex;
    justify-content: space-between;
    padding-left: 25px;
    padding-right: 25px;
    margin-top: 11px;
}

.advanced-info .advanced-item .text {
    line-height: 21px;
}

.advanced-info {
    margin-top: 25px;
}

.notifications {
    position: fixed;
    bottom: 30px;
    right: 30px;
    width: 240px;
    height: auto;
    transition: all 200ms;
    z-index: 1301;
}

.notification {
    float: right;
    width: fit-content;
    padding-right: 30px;
    min-width: 100%;
    height: 50px;
    right: 0px;
    position: relative;
    background-color: #703af7;
    background: linear-gradient(45deg, #703af7, #187cd9);
    border-radius: 10px;
    display: flex;
    color: white;
    margin-top: 10px;
    transition: all 200ms;
    justify-content: left;
    align-items: center;
    box-shadow: 0 0 6px #0000003d;
}



.notifications .notification i.fa {
    margin-left: 20px;
    margin-right: 20px;
    font-size: 15px;
}

.notification>* {
    line-height: 49px !important;
    font-size: 12px;
    white-space: nowrap;
}

p {
    margin: unset;
}

.button.change-inv {
    width: 90px;
}

.change-dialog {
    height: 300px;
    width: 500px;
    position: fixed;
    left: 50%;
    transform: translate(-50%,-50%);
    top: 50%;
    background-color: white;
    box-shadow: 0 0 9px #00000033;
    border-radius: 3px;
    z-index: 4;
}

.change-dialog .button {
    position: absolute;
    bottom: 25px;
    left: 50%;
    transform: translateX(-50%);
}

.inventory-change .finish-list {
    margin-top: unset;
    bottom: 65px;
    position: absolute;
    width: 90%;
}

.padding-left {
    margin-top: 10px;
    margin-left: 40px;
}

.padding-left .text {
    margin-bottom: 6px;
}

.button {}

.button.finance-change {
    position: absolute;
    top: 17px;
    right: 30px;
}

.finance .report-tiles {
    margin-top: 30px;
}

.finance-change .padding-left {
    margin-top: 29px;
}

.commerce-items {
    width: 86%;
    left: 7%;
    height: auto;
    position: relative;
    display: flex;
    justify-content: space-evenly;
    margin-top: 30px;
    margin-top: 40px;
    flex-wrap: wrap;
}

.commerce-item {
    width: 125px;
    height: 200px;
    box-shadow: 0 0 6px #0000003b;
    border-radius: 5px;
    overflow: hidden;
    margin-bottom: 20px;
}

.commerce-item img {
    width: 100%;
    height: 100%;
    border: unset;
}

[point-set='installation-topbar'] .options {
    display: flex;
    justify-content: space-around;
    margin-top: 40px;
    flex-wrap: wrap;
    left: 50%;
    transform: translateX(-50%);
    position: relative;
    min-width: 450px;
    width: 500px;
}

[point-set='installation-topbar'] .options .option {
    position: relative;
    width: 200px;
    height: 80px;
    box-shadow: 0 0 7px #0000002e;
    border-radius: 6px;
    text-align: center;
    background-color: white;
    color: #3b3b3b;
    margin-bottom: 30px;
    cursor: pointer;
}

[point-set='installation-topbar'] .options .option i.fa {
    left: 50%;
    transform: translateX(-50%);
    position: absolute;
    margin-top: 16px;
}

[point-set='installation-topbar'] .option .name {
    position: absolute;
    bottom: 20px;
    width: 100%;
}

.payment-list {
    position: relative;
    left: 50%;
    transform: translateX(-50%);
    width: fit-content;
    margin-top: 30px;
}

.payment-item {
    width: 400px;
    height: 50px;
    padding-left: 20px;
    padding-right: 20px;
    background-color: white;
    color: #3b3b3b;
    margin-bottom: 10px;
    border-radius: 6px;
    box-shadow: 0 0 7px #0000004a;
}

.payment-item .exp {float: right;margin-right: 20px;}

.payment-item>* {
    display: inline-block;
    top: 50%;
    transform: translateY(-50%);
    position: relative;
}

.payment-item i.fa.fa-trash {
    float: right;
    cursor: pointer;
}

.payment-item .last-4 {
    margin-left: 20px;
}

.payment-item .new {
    float: right;
}

.payment-item.new {
    cursor: pointer;
}


/* */

form#payment-form {
    position: relative;
    top: 30%;
    width: 80%;
    transform: translate(-50%,-50%);
    left: 50%;
    padding: 20px;
    box-shadow: 0 0 4px #0000003b;
    border-radius: 6px;
}

#payment-form .button {
    position: relative;
    margin-top: 30px;
    left: 50%;
    transform: translateX(-50%);
    width: 200px;
}

div#card-errors {
    color: gray;
    margin-top: 10px;
    position: relative;
}

.StripeElement {
  box-sizing: border-box;

  height: 40px;

  padding: 10px 12px;

  border: 1px solid transparent;
  border-radius: 4px;
  background-color: white;

  box-shadow: 0 1px 3px 0 #e6ebf1;
  -webkit-transition: box-shadow 150ms ease;
  transition: box-shadow 150ms ease;
}

.StripeElement--focus {
  box-shadow: 0 1px 3px 0 #cfd7df;
}

.StripeElement--invalid {
  border-color: #fa755a;
}

.StripeElement--webkit-autofill {
  background-color: #fefde5 !important;
}


/* */

.key-list .key-item .private-key:hover {
    filter: unset;
}

.sub-status-modal {
    position: absolute;
    width: 500px;
    top: 43%;
    transform: translate(-50%,-50%);
    left: 50%;
    height: 300px;
    box-shadow: 0 0 7px #0000004a;
    overflow: hidden;
    border-radius: 6px;
}

.sub-status-modal .subhead {
    text-align: center;
    margin-top: 10px;
    color: #680000;
}

.sub-status-modal .desc-text {
    width: 90%;
    left: 5%;
    position: relative;
    margin-top: 20px;
    color: #3b3b3b;
    text-align: center;
}

.org-settings input {
    width: 170px;
    position: relative;
    left: 50%;
    transform: translateX(-50%);
    display: block;
    margin-bottom: 6px;
}

.org-settings input:first-of-type {
    margin-top: 20px;
}

.org-settings .desc-text {
    color: #232323;
    margin-top: 9px;
}

.legal {
    width: 90%;
    left: 5%;
    position: relative;
    margin-top: 10px;
    font-size: 11px;
}

.agree {
    display: flex;
    line-height: 22px;
    width: 120px;
    justify-content: space-evenly;
    left: 50%;
    transform: translateX(-50%);
    position: relative;
    margin-top: 20px;
}

.button.finish {
    position: absolute;
    bottom: 30px;
    left: 50%;
    transform: translateX(-50%);
}

.start-sub table {
    width: 90%;
    left: 5%;
    position: relative;
    margin-top: 20px;
}

.start-sub table th {padding-bottom: 8px;border-bottom: 1px solid #c3c3c3;color: #5c5c5c;}

.start-sub td {
    padding-top: 5px;
}

.start-sub td:nth-child(2) {
    text-align: right;
}

.button.advanced {
    position: absolute;
    bottom: 30px;
    left: 50%;
    transform: translateX(-50%);
}

.advanced-search {
    width: 1000px;
    height: 700px;
    position: fixed;
    left: 50%;
    top: calc(50% + 25px);
    transform: translate(-50%,-50%);
    background-color: white;
    box-shadow: 0 0 11px #0000004d;
    border-radius: 9px;
    z-index: 4;
    overflow: hidden;
}

.advanced-search .primary-info {
    width: 200px;
    top: calc(50% - 17px);
    transform: translateY(-50%);
    position: absolute;
}

.primary-info {}

.button.apply {
    position: absolute;
    bottom: 30px;
    left: 50%;
    transform: translateX(-50%);
}

.tags:not(.object-container) {
    width: 43%;
    margin-top: 65px;
    margin-left: 20px;
}

.extra-tags {
    width: 43%;
    margin-left: 20px;
    margin-top: 17px;
}

.sort {
    position: absolute;
    top: 65px;
    right: 20px;
    width: 43%;
}

.recent-series-item-large.nonactive {
    background-color: #21c2ff14;
}

.sort select {
    position: relative;
    left: 50%;
    transform: translateX(-50%);
    width: 50%;
}

.sort .header {
    margin-top: unset;
    padding-top: unset;
    margin-bottom: 10px;
}

.billing-settings {
    width: fit-content;
    width: -moz-fit-content;
    left: 50%;
    transform: translateX(-50%);
    position: relative;
    margin-top: 40px;
    padding: 20px;
    box-shadow: 0 0 4px #00000024;
    border-radius: 4px;
}

.billing-settings .info-item {
    margin-top: 10px;
    left: 50%;
    transform: translateX(-50%);
    position: relative;
    width: fit-content;
    width: -moz-fit-content;
}

.billing-settings .button.save {
    margin-top: 20px;
}

.next-bill {
    text-align: center;
    margin-top: 18%;
    width: 70%;
    left: 50%;
    transform: translateX(-50%);
    position: relative;
}

.payment-partner img {
    width: 83px;
}

.payment-partner {
    position: absolute;
    top: 20px;
    left: 26px;
    font-size: 20px;
}

.notification.error {
    /* background-color: red; */
    background: linear-gradient(45deg, rgb(129, 38, 38), #a64c4c);
}

.notification.warn {
    /* background-color: red; */
    background: linear-gradient(45deg, rgb(201 116 16), #e46409);
}

.notification::after {content: " ";width: 100%;height: 2px;position: absolute;bottom: 0px;}

.transaction .fa-flag {
    color: #ffffff;
}

.transaction-view {
    position: fixed;
    width: 600px;
    height: 400px;
    background-color: white;
    left: 50%;
    transform: translate(-50%,-50%);
    z-index: 2;
    top: 50%;
    box-shadow: 0 0 9px #00000061;
    border-radius: 3px;
}

.transaction-view .timestamp {
    position: absolute;
    right: 20px;
    top: 10px;
    color: #2e2e2e;
}

.transaction-view .transaction-type {
    position: absolute;
    top: 10px;
    left: 20px;
    color: #2e2e2e;
}

.transaction:hover .fa-flag {
    display: none;
}

.transaction:not(:hover) .fa-flag{
    display: block;
    color: #e7a11f;
}

.transaction:not(:hover) .fa-check {
    display: none;
}

.transaction:hover .fa-check{
    display:inline-block;
}



.transaction .fa-check {color: #1dd71a;}

.logo {
    cursor: pointer;
    margin-right: 25px;
    margin-left: 25px;
    padding: 5px;
}

.topbar .logo img {
    height: 20px;
}
.sidebar-page.series-items>.main>.header {
    margin-bottom: 50px;
}

.recent-series-item-large i.fa.fa-clock {
    position: absolute;
    left: 50%;
    transform: translate(-50%,-50%);
    top: 50%;
    color: #ffffff94;
    mix-blend-mode: hard-light;
}

i.fa.fa-4x.fa-clock {}

.account-logo {
    width: 125px;
    cursor: pointer;
    height: 125px;
    left: 50%;
    transform: translateX(-50%);
    position: relative;
    margin-top: 25px;
    border-radius: 100%;
    margin-bottom: 10px;
}

.account-logo i.fa.fa-user {
    position: absolute;
    left: 50%;
    transform: translate(-50%,-50%);
    top: 50%;
    color: #2a2a2a;
}

.account-logo i.fa.fa-2x.fa-edit {
    position: absolute;
    color: white;
    left: 50%;
    transform: translate(-50%,-50%);
    top: 50%;
    width: 28px;
}

.account-logo i.fa.fa-2x.fa-edit {
    display: none;
}

.account-logo:hover .account-logo-circle {
    filter: blur(2px) brightness(0.5);
}

.account-logo-circle {
    width: 100%;
    height: 100%;
    background-color: white;
    border-radius: 100%;
    box-shadow: 0 0 7px #00000073;
}

.account-logo:hover i.fa.fa-2x.fa-edit {
    display: block;
}

div.warning {
    width: 80%;
    margin-top: 20px;
    height: 100px;
    margin: auto;
    margin-top: 30px;
    box-shadow: 0 0 6px #00000075;
    border-radius: 10px;
    background-color: #cf4545;
    position: relative;
    display: flex;
    justify-content: left;
    align-items: center;
}

.warning>i.fa {
    margin-left: 20px;
    color: white;
    margin-right: 20px;
}

.warning-body {
    margin-left: 26px;
    width: 64%;
    height: fit-content;
	height: -moz-fit-content;
    position: relative;
    color: white;
    font-size: 13px;
    text-align: initial;
}

.next.white {
    background-color: white;
    color: #2c88f0 !important;
}

.warning .next {
    position: absolute;
    right: 30px;
    left: unset;
    bottom: 50%;
    transform: translateY(50%);
}

.warning .next i {
    color: #cf4545;
}

.user-detail i.fa.fa-exclamation {
    position: relative;
    padding-right: 7px;
    padding-left: 10px;
    color: #cf4545;
}

.content-block {
    width: 500px;
    position: relative;
    margin: auto;
    margin-top: 50px;
    box-shadow: 0 0 6px #00000057;
    border-radius: 4px;
    padding-bottom: 25px;
    margin-bottom: 50px;
}

.content-block .header {
    text-align: left;
    margin-left: 30px;
}

.content-block p {
    margin-left: 31px;
    font-size: 12px;
    margin-top: 10px;
}

.content-block .button {
    margin-top: 17px;
    margin-left: 30px;
    display: inline-block;
}

.content-block.twofa {
}

.content-block .button.disable {
    background-color: #b32b2b;
}

.content-block.twofa .desc {
    display: inline-block;
    margin-left: 20px;
}

.sidebar.accounts {
    z-index: 1;
}

.access-item {
    height: 20px;
    position: relative;
    display: flex;
    margin-top: 5px;
    font-size: 14px;
    align-items: center;
    justify-content: left;
}

.content-block.access p {margin-bottom: 20px;}

.content-block.access .access, .dot {
    height: 10px;
    width: 10px;
    margin-left: 30px;
    background-color: #9e0000;
    border-radius: 100%;
}

.access-item>* {margin-left: 20px;}

.access.none {
    background-color: #b91111 !important;
}



.content-block.editable p {
    margin-bottom: 28px;
    text-align: center;
}

.label {
    display: inline-block;
    margin-left: 30px;
    width: 122px;
}

.content-block.editable i.fa.fa-pencil-alt, .content-block.editable i.fa.fa-check {
    position: absolute;
    right: 20px;
    top: 20px;
    cursor: pointer;
}

.content-block.editable i.fa.fa-check {
    color: green;
}

.content-block.notification-settings .finish-list {
    margin-top: 30px;
}

.content[page='assignments'] .finish-item .button {
    width: 110px;
    height: 17px;
    font-size: 13px;
    position: absolute;
    right: 16px;
    transform: translateY(-50%);
    top: 50%;
}

.letter-selector {
    position: absolute;
    width: 730px;
    height: 519px;
    left: 50%;
    top: 50%;
    transform: translate(-50%,-50%);
    background-color: white;
    box-shadow: 0 0 6px #00000075;
    z-index: 9;
    overflow: scroll;
    border-radius: 5px;
}

.letter-selector .header {margin-bottom: 20px;}

.letter-selector .letter {
    cursor: pointer;
}

.push-enable {
    width: 400px;
    height: 400px;
    background-color: white;
    z-index: 5;
    position: fixed;
    left: 50%;
    top: 50%;
    transform: translate(-50%,-50%);
    box-shadow: 0 0 8px #0000005e;
    border-radius: 6px;
}

.push-enable i.fa.fa-bell {
    position: relative;
    left: 50%;
    transform: translate(-50%,-50%);
    margin-top: 31%;
    font-size: 100px;
    color: #4892ff;
    text-shadow: 0px 2px 4px #00000057;
}

.push-enable .header {
    font-size: 19px;
    margin-top: -20px;
}

.button {
}

.push-enable .button.cancel {
    background-color: #b63e3e;
}

.push-enable .next {
    bottom: 40px;
}

.push-enable i.fa.fa-times {
    position: absolute;
    right: 30px;
    top: 19px;
    font-size: 21px;
    cursor: pointer;
}

.subscriptions, .settings .documents, .product-management .products, .donor-management .acknowledgement-tiers, .customer-settings .setting-types {
    margin-top: 30px;
    display: flex;
    flex-direction: column;
    justify-content: start;
    align-items: center;
    width: 90%;
    position: relative;
    flex-wrap: wrap;
    justify-content: center;
}

.subscription, .settings .document-type {
    width: 410px;
    height: 210px;
    background-color: white;
    box-shadow: 0 0 7px #0000004a;
    border-radius: 6px;
    position: relative;
    padding: 3px 21px;
    margin: 20px;
}

.subscriptions .subscription>.header,.document-type.header {
    font-size: 14px;
    margin-bottom: 2px;
    margin-top: 10px;
}

.subscription i.fa.fa-edit, .document-type i.fa.fa-edit {
}

div#subscription-series-items {}

div.subscription-list-item {
    font-size: 13px;
    font-weight: lighter;
}

.subhead {
    width: 100%;
    text-align: center;
    margin-top: 0;
    font-size: 13px;
}

.subscription .subhead,.document-type .subhead {
    margin-bottom: 10px;
}


.subscription .descriptor, .document-type .descriptor {
    font-size: 10px;
    margin-top: 7px;
    margin-left: 0px;
    position: absolute;
}

.subscription .finish-list, .document-type .finish-list {
    margin-top: 20px;
    font-size: 13px;
}

.edit-subscription .basic-info {
    padding-bottom: 30px;
    position: relative;
    width: 337px;
    height: fit-content;
	height: -moz-fit-content;
    display: inline-block;
}

.info-item {
    width: fit-content;
    left: 50%;
    position: relative;
    transform: translateX(-50%);
    margin-top: 10px;
}

.edit-subscription .header {
    margin-bottom: 20px;
}

input.sub-name, input.document-name {
}

.edit-subscription .series-info {
    height: fit-content;
	height: -moz-fit-content;
    width: 341px;
}

.topline {
    display: flex;
    align-items: baseline;
    margin-top: 40px;
    width: 90%;
    left: 50%;
    transform: translateX(-50%);
    position: relative;
    justify-content: space-around;
    border-bottom: 2px solid #ececec;
    flex-wrap: wrap;
}

.series-info .finish-list {
    margin-bottom: 15px;
}

.letter-list {
    width: 70%;
    height: fit-content;
	height: -moz-fit-content;
    padding-bottom: 40px;
    font-size: 14px;
    font-weight: lighter;
}

.assignment .assignment-data {margin-right: 6px;}

.assignment .button {
    width: 69px;
    padding: 5px;
    font-size: 10px;
    height: 14px;
    margin-left:20px;
}

.finish-item .assignment {
    display: flex;
    align-items: center;
    cursor: inherit;
}

.assignment .fa-search {
    cursor: pointer;
    color: #2d2d2d;
}

.edit-subscription .next {
}

.edit-subscription .button.save, .edit-document .button.save {
    position: fixed;
    right: 40px;
    top: 75px;
    z-index: 1;
}

.assignment i.fa.fa-times {
    margin-left: 15px;
    cursor: pointer;
}

.finish-item>.value .fa {margin-left: 20px;}

.edit-document .button.new {
    left: 50%;
    transform: translateX(-50%);
    position: relative;
    margin-top: 21px;
}

.field-editor {
    width: 500px;
    height: 300px;
    z-index: 4;
    background-color: white;
    position: absolute;
    left: 50%;
    transform: translate(-50%,-50%);
    top: 47%;
    border-radius: 6px;
}

.field-editor .finish-list {
    width: 90%;
    margin-top: 15px;
}

.field-editor .button {
    bottom: 30px;
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
}

.new-transaction .mini-subscription, .new-document .mini-document {
    width: 230px;
    padding-bottom: 20px;
    box-shadow: 0 0 7px #0000004a;
    border-radius: 6px;
    position: relative;
    margin: 10px;
    cursor: pointer;
    transition: all 200ms;
}

.new-transaction .mini-subscription .grouping {
    position: absolute;
    right: 10px;
    font-size: 9px;
    top: 5px;
}

.new-transaction .subscription-selection .container, .new-document .document-selection .container {
    display: flex;
    justify-content: center;
    margin-top: 16px;
    flex-wrap: wrap;
    width: 100%;
    left: 50%;
    transform: translateX(-50%);
    position: relative;
    padding-bottom: 30px;

}



.new-transaction .mini-subscription .header {
    margin-top: 3px;
}

.new-transaction .subscription-selection .title {
    text-align: center;
    margin-top: 13px;
    font-size: 13px;
    font-weight: lighter;
}

.new-transaction .mini-subscription:hover, .new-document .mini-document:hover {background-color: #3d84ff;color: white !important;}

.new-transaction .mini-subscription:hover *, .new-document .mini-document:hover * {
    color: white;
}

.new-transaction .subscription-selection .container:not(:last-of-type) {
    border-bottom: 1px solid #00000021;
}

.new-document .document-selection .container {
    width: 80%;
    max-height: 300px;
    top: 45%;
    transform: translate(-50%,-50%);
    position: absolute;
}

.new-document .main .finish-list.last {
    margin-bottom: 80px;
}

.new-document .next {
    position: fixed;
}

.new-document .mini-document:last-of-type {
    margin-bottom: 40px;
}

.product, .flow {
    margin: 21px;
    width: 330px;
    border-radius: 7px;
    position: relative;
    overflow: hidden;
    display: flex;
    align-items: center;
    flex-direction: column;
    justify-content: space-between;
    box-shadow: 0 0 4px #0000003d;
    padding: 20px 20px;
    height: 330px;
}

.products .product .header, .flows .flow .header {
    font-size: 10px;
    margin-left: 9px;
    margin-right: 10px;
    width: unset;
    height: 15px;
}

.product .product-image {
    width: fit-content;
    height: 180px;
    z-index: 0;
    display: flex;
    justify-content: center;
    border-radius: 4px;
    flex-shrink: 0;
    width: 230px;
    margin-right: unset;
    margin-top: 20px;
}



.product-image img, .system-image img {
    border-radius: 5px;
    overflow: hidden;
    object-fit: cover;
    height: 100%;
    /* box-shadow: 0 0 7px #0000003b; */
}

.product .price {
    font-size: 12px;
    bottom: 15px;
    position: absolute;
    margin-left: 15px;
}

.products .product .actions {
    bottom: 15px;
    position: absolute;
    right: 15px;
    display: flex;
    align-items: center;
}

.product .actions .fa {
    color: #323232;
}

.product .prod-id {
    position: absolute;
    left: 10px;
    top: 6px;
    font-size: 9px;
    font-weight: lighter;
}

.bottom-bar {
    height: 41px;
    position: absolute;
    width: 100%;
    left: 0px;
    bottom: 0px;
    background-color: white;
    display: flex;
    align-items: center;
}

.create-product, .edit-donor-tier, .edit-customer-setting, .create-series-item {
    width: 600px;
    height: 400px;
    background-color: white;
    z-index: 3;
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%,-50%);
    border-radius: 7px;
    overflow: hidden;
}

.create-product .product-image{
    width: 140px;
    margin-left: 40px;
}

.create-product .upload-bottom {
    margin-left: 30px;
    width: 150px;
}

.create-product .upload-bottom input {
    width: calc(100% - 20px);
    margin-top: 18px;
}

.create-product i.fa.fa-times {
    position: absolute;
    right: 25px;
    font-size: 19px;
    top: 15px;
    cursor: pointer;
}

.create-product .product-image::-webkit-scrollbar, .edit-series-item .product-image::-webkit-scrollbar {
  display: none;
}


.create-product .combine {
    top: 50%;
    transform: translateY(-50%);
    position: absolute;
}

.settings-group:last-of-type {
    margin-bottom: 100px;
}

.series-list {margin-top: 30px;display: flex;align-items: center;justify-content: center;flex-wrap: wrap;}





.descriptor {
    position: absolute;
    font-size: 10px;
    margin-top: 5px;
    margin-left: 11px;
}

.series .actions {
    width: fit-content;
    display: flex;
    position: absolute;
    top: 10px;
    right: 9px;
    flex-direction: column;
    font-size: 13px;
}

.series i.fa.fa-edit {
    cursor: pointer;
}

.subscription:last-of-type, .settings .document-type:last-of-type {
    margin-bottom: 100px;
}

.series-settings .finish-list {
    width: 80%;
    margin-top: 30px;
}

.edit-donor-tier .finish-list {
    margin-top: 30px;
}

.donor-management .acknowledge-tier, .customer-settings .setting-type {
    flex-direction: row;
    width: 400px;
    height: 40px;
    background-color: white;
    box-shadow: 0 0 7px #0000004a;
    border-radius: 4px;
    align-items: center;
    margin-bottom: 12px;
    display: flex;
    position: relative;
}

.acknowledge-tier>* {
    position: relative;
    margin-left: 30px;
}

.acknowledge-tier .acknowledge-amount {
    float: right;
    right: 87px;
    position: absolute;
}

.action-list {
    position: absolute;
    right: 0px;
    margin-right: 14px;
}

.action-list>* {
    margin-right: 5px;
    cursor: pointer;
}

.ack-generator {
    width: 500px;
    height: 300px;
    left: 50%;
    top: 50%;
    transform: translate(-50%,-50%);
    position: fixed;
    box-shadow: 0 0 5px #00000045;
    border-radius: 5px;
    z-index: 4;
    background-color: white;
}

.ack-generator .header {
    font-size: 14px;
    font-weight: normal;
}

.ack-generator .finish-list {
    margin-top: 20px;
}

.donor-management .container-item.link {
    margin: auto;
    text-align: center;
    margin-top: 30px;
    width: 200px;
}

.open-settings .finish-list {
    margin-top: 29px;
}

.open-settings .title {
    text-align: center;
    margin-top: 43px;
    font-weight: bold;
    color: #2e2e2e;
}

.content.open-settings .finish-list.sorting {
    margin-top: 24px;
}

.customer-settings .setting-type {
    width: 500px;
    display: flex;
    align-items: center;
    position: relative;
}

.setting-type>* {
    margin-left: 30px;
}

.setting-type .switch, .setting-type input {
    position: absolute;
    right: 90px;
}

.setting-type {}

.setting-type:first-of-type {
    margin-top: 40px;
}

.ack-generator input {
    width: 140px;
}

.edit-customer-setting .finish-list {
    margin-top: 30px;
}

.advanced-search .filters.finish-list {
    margin-top: 10px;
    width: 100%;
}

.advanced-search .title, .category-header .title {
    text-align: center;
    font-weight: lighter;
    display: flex;
    justify-content: space-around;
    width: 100%;
    margin: auto;
    border-bottom: 1px dotted #3f3f3f;
    padding-bottom: 5px;
}

.advanced-search .filter-block:first-of-type {
    margin-top: 64px;
}

.title {}

.advanced-search .title .fa-plus, .category-header .title .fa-plus {
    cursor: pointer;
}

.advanced-search .title>div, .category-header .title>div {
    min-width: 200px;
    text-align: left;
}

.advanced-search .content.main {
}

.advanced-search .filter-block, .category-header {
    box-shadow: 0 0 5px #00000030;
    padding: 5px 4px;
    width: 70%;
    margin: auto;
    margin-top: 2px;
    margin-bottom: 0px;
    border-radius: 6px;
}

.advanced-search .main .header {
    margin-bottom: 40px;
}

.white-back {
    width: 100%;
    height: 16%;
    bottom: 0px;
    position: fixed;
    background-color: white;
    left: 0px;
    z-index: 2;
    box-shadow: 0 0 8px #0000001a;
}

.advanced-search .main .container {
    height: 84%;
    overflow-y: scroll;
    position: relative;
    width: 100%;
    z-index: 4;
}

.advanced-search .subhead {
    font-weight: lighter;
}

.advanced-search .content:not(.main) .finish-list, .new-mailing .segment-filter-list .finish-list {
    margin-top: 22px;
    width: 82%;
    user-select: none; -webkit-user-select: none;
}

.advanced-search .content:not(.main) .finish-item:hover, .new-mailing .segment-filter-list .finish-item:hover {
    cursor: pointer;
    border-radius: 5px;
}

.advanced-search i.fa.fa-check, .new-mailing .segment-filter-list i.fa.fa-check {
    color: #009c0d;
}

.advanced-search .content:not(.main) .finish-item:hover .fa, .new-mailing .segment-filter-list .finish-item:hover .fa {
}

.advanced-search .search, .new-mailing .search {
    position: absolute;
    display: flex;
    align-items: center;
    width: 200px;
    justify-content: space-evenly;
    right: 20px;
    top: 72px;
}

.advanced-filter-info {
    position: absolute;
    bottom: 73px;
    text-align: center;
    width: 100%;
    font-size: 12px;
    font-weight: lighter;
}

.customer-list i.fa.fa-file-export {
    position: relative;
}

.customer-list .action-list {
    right: 40px;
    top: 19px;
}

.customer-list .action-list .fa {
    font-size: 20px;
    cursor: pointer;
    color: #2260eb;
}

.search-sidebar .action-block {
    position: absolute;
    font-size: 14px;
    right: 10px;
    top: 10px;
    cursor: pointer;
    display: flex;
    width: 46px;
    justify-content: space-around;
}

.search-sidebar .header {
    margin-top: 10px;
}

.customer-list .subhead {
    position: absolute;
    font-size: 10px;
    margin-top: 3px;
}

.transaction-preview {
    width: 80%;
    height: 250px;
    position: fixed;
    left: 50%;
    transform: translateX(-50%);
    border-radius: 4px;
    background-color: white;
}

.transaction-preview .transaction-desc {
    font-size: 12px;
    margin-top: 6px;
    margin-left: 8px;
    position: absolute;
}

.transaction-preview .absolute-typing {
    position: absolute;
    right: 10px;
    font-size: 12px;
}

.transaction-preview .transaction-type-desc {
    width: fit-content;
    text-align: center;
    margin-top: 25px;
    position: relative;
    left: 50%;
    transform: translateX(-50%);
}

.transaction-preview .subhead {
    font-size: 10px;
    font-weight: lighter;
    margin-top: 2px;
}

.transaction-amount {
    position: absolute;
    font-size: 12px;
    font-weight: lighter;
    left: 8px;
    top: 22px;
    display: flex;
    color: #232323;
    align-items: center;
}

.transaction-tag-data {
    position: absolute;
    right: 9px;
    display: flex;
    top: 7px;
    font-size: 12px;
}

.transaction-tag-data>* {
    color: #0054bc;
    cursor: pointer;
    margin-left: 9px;
}

.transaction-amount .fa {
    font-size: 10px;
    margin-left: 5px;
}

.transaction-preview .finish-list {
    font-size: 12px;
    font-weight: lighter;
    width: 78%;
}

.transaction-preview .finish-item .fa {
    color: #0054bc;
}

.transaction-preview .finish-item {
    padding: 3px 6px 3px 6px;
}

.transaction-preview .custom-data {
    position: absolute;
    display: flex;
    flex-direction: column;
    width: 100%;
    left: 50%;
    transform: translateX(-50%);
    height: 78px;
    border-top: 1px solid #e5e5e5;
    padding-top: 7px;
    padding-bottom: 7px;
    bottom: 0px;
    overflow-x: scroll;
}

.transaction-preview .custom-data .data {
    font-weight: lighter;
    margin-top: 20px;
}

.finish-content .transaction-preview {
    margin-top: 40px;
}

.donation-data .finish-list {
    width: 90%;
    margin-top: 30px;
}


.series-info .period-series-items {
    width: 50px;
}

.transaction .item.amount {
    margin-left: 10px;
    font-weight: lighter;
    min-width: 80px;
}

.item.transaction-time {
    right: 10px;
    position: absolute;
    padding-right: 10px;
}

.item.receipt {
    margin-left: calc(10% - 75px);
    height: 100%;
    white-space: pre-wrap;
    max-width: 34%;
    font-size: 11px;
}

.item.type {
    min-width: 180px;
}

.transaction .transaction-tag-data {
    transform: scale(.7);
    transform-origin: right;
    right: 20px;
    top: 4px;
}

.customer.last {
    margin-bottom: 50px;
}

.advanced-search li .value input {
    width: 140px;
    text-align: left;
    padding-right: 19px;
}

.edit-document .basic-info {
    width: 300px;
}

.log .item.time {
    position: absolute;
    right: 0px;
    padding-right: 25px;
}

.log .item.action {
    min-width: 105px;
}

.campaign-bar .bar-item:hover {
    background-color: #dfdfdf;
}

.campaign-bar .bar-item:first-of-type {
    border-left: 1px solid #d6d6d6;
}

.campaign-bar .bar-item.open {
    background-color: #2c88f0;
    color: white;
}

.campaign-topbar i.fa.fa-cog {
    position: absolute;
    right: 25px;
    cursor: pointer;
}

.topbar .display-item {
    cursor: inherit;
}

.campaign-card .topbar, .white.topbar {
    position: relative;
    background-color: white;
    z-index: 3;
}

.campaign-card .topbar>*, .topbar.white>* {
    color: #383838;
}

.campaign-topbar .campaign-name {
    margin-left: 57px;
    font-weight: 500;
    text-overflow: ellipsis;
    overflow: hidden;
}

.campaign-settings {}

.campaign-topbar i.fa.fa-cog {
    position: absolute;
    right: 25px;
    cursor: pointer;
}

.topbar .display-item {
    cursor: inherit;
    padding-right: 30px;
    margin-right: 33px;
    margin-left: 15px;
    border-right: 1px solid #00000021;
}

.campaign-page {
    position: absolute;
    width: 100%;
    height: calc(100% - 50px);
    background-color: #f6f6f6;
    overflow: scroll;
    overflow-x: hidden;
}

.campaign-page.settings .finish-list {
    width: 450px;
    margin-top: 20px;
}

.finish-item>.button {
    text-align: center;
    display: block;
}

.campaign-page.settings .button.save {
    position: relative;
    margin: auto;
    margin-top: 40px;
}

.campaign-page .items, .items.campaign-wide-items.items, .demon-wide-items.items {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    margin-top: 33px;
}

.campaign-page .items>.item, .campaign-wide-items.items>.item, .demon-wide-items>.item {
    width: 300px;
    height: 200px;
    background-color: white;
    box-shadow: 0 0 7px #0000002e;
    border-radius: 5px;
}

.campaign-page .line-item, .campaign-wide-items.items .line-item, .demon-wide-items.items .line-item {
    height: 70px !important;
    display: flex;
    align-items: center;
    padding: 0px 22px;
    color: #3b3b3b;
    position: relative;
    margin-bottom: 20px;
    cursor: pointer;
}

.items .item.line-item>.fa {
    font-size: 22px;
}

.items .line-item>* {
    margin-right: 10px;
}

.line-item>.continue, .campaign-wide-items.items .line-item>.continue,.demon-wide-items.items .line-item>.continue  {
    position: absolute;
    right: 20px;
    display: flex;
    align-items: center;
}

.items .line-item>.continue>.fa {
    cursor: pointer;
}

.items .line-item>.continue>* {
    margin-left: 12px;
}

.campaign-page .item .button {
    width: 90px;
    margin-right: unset;
    right: 22px;
    position: absolute;
    padding: 5px;
}

.log i.fa {
    margin-right: 10px;
}

.log .fa-link {
    margin-left: 10px;
}

.product-selection .itemlist, .add-manual-history-items .itemlist {
    position: absolute;
    top: 75px;
}

.itemlist .item>.item-display, .product-container .item>.item-display {
    box-shadow: 0 0 5px #00000047;
    width: 100%;
    height: 100%;
    border-radius: 4px;
    background-color: white;
    position: relative;
    display: flex;
    flex-direction: row;
    justify-content: center;
    transition: all 200ms;
    overflow: hidden;
}

.itemlist .item:last-of-type,.product-container .item:last-of-type {padding-right: 40px;}

.itemlist .logo {
    position: fixed;
    top: 12px;
    left: 12px;
    color: #3b3b3b;
    font-size: 12px;
    margin: unset;
}

.itemlist .contents {
    display: flex;
    height: 100%;
    align-items: center;
    justify-content: left;
    overflow-y: hidden;
    overflow-x: scroll;
    position: absolute;
    top: 0;
    left: 0;
    width: -webkit-fill-available;
    padding-left: 40px;
    padding-top: 0px;
    padding-right: 40px;
    width: -moz-available;
}

.itemlist i.icon.fa.fa-shopping-cart {
    color: #3b3b3b63;
    position: absolute;
    top: 11px;
    left: 13px;
    font-size: 10px;
}

.itemlist .contents .item-image-container:hover .item-name, .product-container .item-image-container:hover .item-name {
    position: absolute;
    z-index: 2;
    color: white;
    text-align: center;
    margin-top: 5px;
    left: 50%;
    transform: translateX(-50%);
    font-size: 11px;
    width: 95%;
}

.itemlist .item:hover .item-display {
}

.itemlist .contents .item-image-container:not(:hover) .item-name,.product-container .item .item-image-container:not(:hover) .item-name {
    display: none;
}

.mod-transaction .main>.actions {
    position: absolute;
    font-size: 11px;
    top: 25px;
    right: 30px;
}

.itemlist .item .actions, .product-container .item .actions {
    position: absolute;
    width: 100%;
    height: calc(100% - (63% + 20px));
    justify-content: space-evenly;
    align-items: center;
    display: flex;
    bottom: 0;
    color: #3b3b3b;
    z-index: 2;
    background-color: white;
}

.itemlist .item .actions>*, .product-container .item .actions>* {
    margin: unset;
}

.itemlist .actions .fa-plus,.itemlist .actions .fa-minus {
    cursor: pointer;
    color: inherit;
}

.itemlist .item:hover .actions {
}

.itemlist .item .item-display .item-image-container, .product-container .item .item-display .item-image-container {
    height: 63%;
    width: 100%;
    transition: 200ms;
    position: relative;
    display: flex;
    justify-content: center;
    padding-top: 10px;
    padding-bottom: 10px;
    overflow: hidden;
}

.itemlist .item-image-container:hover, .product-container .item-image-container:hover {
    background-color: #545454;
    z-index: 2;
    box-shadow: inset 0 0 20px #00000054;
}

.itemlist .item-image-container:hover img, .product-container .item-image-container:hover img {
    filter: brightness(0.4);
    transform: scale(1.25) translate(0,0%);
}

.itemlist .actions .count, .product-container .actions .count {
    cursor: default;
    user-select: text;
}

.itemlist .item-image-container:hover i.fa.fa-trash {
    position: absolute;
    bottom: 10px;
    color: white;
    z-index: 2;
    font-size: 14px;
    cursor: pointer;
    display: block;
}

.itemlist>.actions {
    display: flex;
    position: absolute;
    right: 13px;
    top: 11px;
    flex-direction: row-reverse;
    color: #3b3b3b;
    font-size: 12px;
    z-index: 2;
}

.itemlist>.actions>* {margin-left: 13px;}

.itemlist .item-image-container i.fa.fa-trash {
    display: none;
}

.category-header {
    box-shadow: unset;
    cursor: pointer;
    width: 90%;
}

.new-transaction .category-header:first-of-type {
    margin-top: 30px;
}

.new-transaction .product-listings .subhead, .add-manual-history-items .product-listings .subhead {
    margin-bottom: 15px;
}

.category-header .category {
    margin-top: 15px;
    display: flex;
    justify-content: top;
    flex-wrap: nowrap;
    flex-direction: column;
    align-items: center;
}

.product-item {
    width: auto;
    max-width: 130px;
    height: 150px;
    box-shadow: 0 0 5px #0000004f;
    border-radius: 6px;
    overflow: hidden;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-right: 15px;
    margin-bottom: 15px;
    margin-left: 15px;
}

.product-item img {
    height: 100%;
    position: relative;
    transition: all 200ms;
    border-radius: 6px;
}

.product-item .product-name {
    position: absolute;
    z-index: 2;
    color: white;
    text-align: center;
    transform: translateY(-50%);
    display: none;
    transition: all 200ms;
}

.product-item:hover .product-name {
    display: block;
}

.product-item:hover img {
    filter: brightness(0.5);
}

.category-header:last-of-type {
    margin-bottom: 50px;
}

.product-item i.fa.fa-check {
    position: absolute;
    color: #50ff50;
    z-index: 2;
    font-size: 34px;
}

.product-item:hover  i.fa.fa-check {
    margin-top: 26px;
}

.item.receipt .product-item {
    height: 80%;
    margin: unset;
    border-radius: 3px;
    margin-right: 9px;
}

.item.receipt .product-item img {
    border-radius: 3px;
}

.advanced-search .filter-block {
    margin-top: 20px;
    margin-bottom: 20px;
}

.transaction-preview .product-item {
    height: 100%;
    width: fit-content;
    flex-shrink: 0;
    margin: unset;
    padding-left: 10px;
    padding-right: 10px;
    box-shadow: unset;
}

.series .actions>* {
    margin-bottom: 10px;
}

.transaction-tag-data .fas {
    transform: translateY(10%);
}

.recent-series-item-large .actions>* {
    margin-left: 5px;
    color: #3b3b3b;
}

.recent-series-item-large .actions>* {
    color: #3b3b3b;
    margin-left: 15px;
}

.recent-series-item-large .ordered-number {
    position: absolute;
    right: 10px;
    top: 6px;
    color: #3b3b3b;
}

left {
}

.series-settings .naming-scheme {
    padding: 10px;
    width: 300px;
    height: 35px;
    box-shadow: 0 0 7px #00000045;
    border-radius: 4px;
    text-align: left;
    font-size: 10px;
    overflow-y: scroll;
}

.series-settings .finish-item.large {
    height: 57px;
}

.button.save {
    position: relative;
    margin: auto;
    margin-top: 20px;
}

.series-exports .finish-list {
    width: 70%;
    margin-top: 30px;
}

.order-fill .itemlist {
    width: 500px;
    margin: unset;
    z-index: 0;
    position: relative;
    margin: auto;
}

.pager-position {
    position: absolute;
    display: flex;
    top: 20px;
    left: 50%;
    transform: translateX(-50%);
}

.pager-position>div {
    width: 10px;
    height: 10px;
    border-radius: 10px;
    background-color: white;
    margin-right: 5px;
    margin-left: 5px;
    cursor: pointer;
    box-shadow: 0 0 3px 1px #0000005e;
    transition: all 200ms;
}

.active {}

.pager-position>div.active {
    background-color: #008c00;
}

.order-fill .transaction-preview {
    left: unset;
    width: 450px;
    transform: scale(.35);
    right: 0px;
    transform-origin: top right;
    margin-top: 15px;
    margin-right: 15px;
    transition: all 200ms;
    border-radius: 10px;
    z-index: 2;
}

.order-fill .transaction-preview:hover {
    transform: scale(.8);
    border-radius: 5px;
}

.order-fill .content .subhead {
    margin-bottom: 60px;
}

.order-fill .itemlist-title {
    width: 500px;
    margin: auto;
    margin-bottom: 7px;
    font-weight: lighter;
    font-size: 11px;
}

.order-fill .letters .letter-list {
    margin: auto;
    border-top: 1px solid #00000026;
}

.letter-fill-item {
    width: -webkit-fill-available;
    height: 50px;
    padding: 0px 13px;
    display: flex;
    align-items: center;
    box-shadow: 0 0 5px #0000004d;
    border-radius: 5px;
}

.order-fill .letter-fill-item>* {
    margin-left: 6px;
}

.order-fill .letter-fill-item>i {margin-left: 16px;}

.order-fill .letter-list table {
    width: 100%;
    padding-top: 10px;
}

.order-fill table tr i {
    margin-right: 7px;
}

.order-fill .letters table tr:not(:first-of-type) {height: 30px;background-color: #0000000a;}

.order-fill .letters table tr:first-of-type {
    height: 26px;
    text-align: left;
}

.order-fill .letter-list .header {
    text-align: center;
}

.order-fill .letters table tr:not(:first-of-type) td {
    padding: 0px 10px;
    position: relative;
}

.order-fill .letters .letter-list .throbber {
}

.order-fill .letter-list .load-throbber {
    transform: scale(.4) translate(-50%,-50%);
    transform-origin: 0 0;
    position: absolute;
    top: 50%;
    left: 50%;
}

.order-fill .note {
    width: 500px;
    margin: auto;
    margin-top: 40px;
}

.order-fill .note .subhead {
    margin-bottom: 20px;
}

.order-fill .customer-tag {
    display: flex;
    position: absolute;
    top: 20px;
    left: 20px;
    cursor: pointer;
    align-items: center;
}

.order-fill .customer-tag>* {
    margin-right: 9px;
}

.section-title i.fa.fa-plus {
    position: absolute;
    right: 40px;
    cursor: pointer;
}

.section-title.line-title {
    position: relative;
    border-bottom: 1px solid #0000002e;
    padding-bottom: 4px;
}

.letter-list .finish-item .text .fa-trash {
    margin-right: 5px;
    color: #3b3b3b;
    font-size: 10px;
    cursor: pointer;
}

.edit-subscription .letter-list .finish-item .text {
    min-width: 200px;
}

.edit-subscription .letter-list {
    width: 90%;
}

.mailing-labels .letter-list {
    margin: auto;
    margin-top: 46px;
}

div#print-letter-list-header {}

.product-listings .series {
    margin-bottom: 25px;
}

.merge-letter-content>.content {
    width: 8.5in;
    height: 11in;
    margin: auto;
    margin-bottom: 70px;
    margin-right: 20px;
    margin-left: 20px;
    overflow-wrap: break-word;
}

.setting-item .size-container {
    display: flex;
}

.setting-item .size-container input {
    width: 33px;
    padding-right: 10px;
    margin-right: 8px;
}

.merge-content-main {
    position: absolute;
    top: 66px;
    left: 175px;
    width: calc(100% - 175px);
    overflow-x: scroll;
}

.letter-viewer .letter:after {
    content: '';
    position: absolute;
}

.product-container {width: -webkit-fill-available;}

.product-container, .add-manual-history-items .product-container {
    margin-left: 20px;
    margin-right: 20px;
    display: flex;
    flex-direction: row;
    justify-content: center;
    flex-wrap: wrap;
    margin-top: 30px;
    margin-bottom: 30px;
}

.new-transaction .product-container .item, .add-manual-history-items .product-container .item {
    padding: 10px;
}

.product-container i.fa.fa-times {
    color: #902323;
    font-size: 20px;
}

.product-container i.fa.fa-plus {
    color: #3b3b3b;
    font-size: 20px;
}

.open-product-history .product-container {
    display: flex;
    justify-content: center;
    transform-origin: 0 0;
    width: 500px;
    margin: auto;
    margin-top: 50px;
    flex-wrap: wrap;
}

.open-product-history .product-container .item {
    padding: 15px;
}

.completion-frame iframe {
    width: 100%;
    height: 100%;
    border: unset;
}

.add-manual-history-items {
    /* display: none; */
}

.add-manual-history-items .button.complete {
    position: absolute;
    bottom: 25px;
    left: 50%;
    transform: translateX(-50%);
}

.series .header {
    margin: 0px 34px;
    padding-top: 25px;
    left: 50%;
    font-size: 12px;
    transform: translateX(-50%);
    margin-left: 0px;
    position: relative;
}

.new-mailing {
    position: fixed;
    width: 520px;
    height: 420px;
    background-color: white;
    border-radius: 3px;
    box-shadow: 0 0 7px #00000042;
    z-index: 3;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
    overflow: hidden;
    transition: all 400ms;
}

.new-mailing .finish-list {
    margin-top: 25px;
}

.new-mailing .email-setup .campaign-wide-items.items {
    margin-top: 35px;
    flex-direction: column;
}

.new-mailing .campaign-wide-items.items {
    margin: auto;
    margin-top: 10px;
    flex-direction: column;
    align-items:center;
    justify-content:center;
    width:fit-content;
}


.next.disabled {
    background-color: #bdbdbd;
}

.button.disabled {
    background-color: #bdbdbd;
}

.new-mailing .population-descriptor {
    font-size: 10px;
    margin-right: 16px;
}

.new-mailing .complete.true {
    margin-right: 20px;
    color: #00b400;
}

.new-mailing .complete {
    margin-right: 20px;
    color: #8e0e0e;
    transition: all 100ms;
}

.new-mailing .complete.true .fa-check {display: block;}

.new-mailing .complete:not(.true) .fa-check {
    display: none;
}

.new-mailing .complete.true .fa-exclamation {
    display: none;
}

.new-mailing .complete:not(.true) .fa-exclamation {
    display: block;
}

.variables {
    position: relative;
    width: 420px;
    height: 400px;
    margin-right: 30px;
    margin-left: 90px;
    background-color: white;
    z-index: 4;
    box-shadow: 0 0 10px 0px #0000004d;
    border-radius: 6px;
    overflow: scroll;
}

.letter-viewer-modal .variables .finish-list {
    font-size: 11px;
}

.letter-viewer-modal .cover {
    width: 100%;
    height: 100%;
    position: absolute;
    background-color: #00000052;
    z-index: 3;
    box-shadow: 0 0 15px transparent;
    border-radius: 3px;
}

.letter-viewer-modal .cmd-bar .fa-bug {
    color: #3b3b3b;
    cursor: pointer;
}

.letter-viewer-modal.debug {
    position: absolute;
    height: 400px;
}

.new-mailing .email-setup .campaign-wide-items.items {
    margin-top: 35px;
}

.email-setup .letter-descriptor {
    margin-right: 20px;
}

.new-mailing .section-title {
    width: 100%;
    padding: unset;
    text-align: center;
    margin-left: 30px;
}

.new-mailing .segment i.fa.fa-plus {
    position: absolute;
    top: 26px;
    right: 35px;
    cursor: pointer;
}

.new-mailing .segment-filters .campaign-wide-items {
    margin-top: 40px;
}

.segment-filters .item .continue .selected {
    margin-right: 12px;
    font-size: 10px;
    transform: translateY(-1px);
}

.new-mailing .finish-list[aggregate], .new-mailing .finish-list[email],.new-mailing .finish-list[export] {
    margin-top: 0px;
    border-top: 1px solid #ececec8f;
    padding-top: unset;
}

.new-mailing .search {
    top: 56px;
}

.new-mailing .mailing-desc {
    font-size: 10px;
}

.new-mailing .segment .finish-list {
    width: 93%;
    margin-bottom: 30px;
}

.new-mailing .segment-filter-list .finish-list {
    width: 90%;
}

.new-mailing .letter:hover {
    color: #3b3b3b;
    background-color: #f9f9f9;
    cursor: pointer;
}

.new-mailing .letter.selected {
    background-color: #2e78ff;
    color: white;
}

.new-mailing .letter.selected:hover {
    background-color: #2e78ff;
    color: white;
}

span.brace {
    color: #3876ff;
    padding-left: 0px;
    padding-right: 0px;
    font-size: inherit;
    background-color: #e6e6e6;
    border-radius: 2px;
}

[scheduled-time] input {
    width: 88px;
    margin-left: 10px;
}

.content.mailings .mailing-stats {
    position: absolute;
    font-size: 8px;
    top: 11px;
    left: 23px;
    display: flex;
    color: #3b3b3b;
}

.content.mailings .mailing-stats>* {
    margin-right: 6px;
}

.mailings .mailing-stats .fa {
    margin-right: 4px;
}

.customer-list>.actions {
    display: flex;
    flex-direction: column;
    position: fixed;
    right: 35px;
    margin-top: 5px;
    z-index: 5;
    font-size: 20px;
}

.field-export {
    position: fixed;
    width: 600px;
    height: 500px;
    background-color: white;
    z-index: 3;
    top: 50%;
    transform: translate(-50%,-50%);
    left: 50%;
    border-radius: 6px;
    box-shadow: 0 0 6px #00000057;
    overflow: hidden;
}

.field-export .field-list {
    width: 90%;
    padding: 0px 30px;
    margin-top: 20px;
    height: calc(100% - 155px);
    overflow: scroll;
}

.field-export .fa-list, .field-export .fa-plus {
    margin-right: 15px;
}

.field-export .model-desc {
    position: absolute;
    top: 10px;
    right: 18px;
    font-size: 10px;
}

.field-export .finish-item:not([new]) .text {
    cursor: grab;
}

.field-export [new] {
    cursor: pointer;
    justify-content: center;
}

.field-export .finish-item:last-of-type {
    margin-bottom: 30px;
}

.field-export .finish-item {
    user-select: none; -webkit-user-select: none;
}

.field-export .continue-export {
    width: 100%;
    height: 79px;
    box-shadow: 0 0 5px #00000054;
}

.field-export .finish .button {
    position: absolute;
    bottom: 35px;
    left: 50%;
    transform: translateX(-50%);
}

.field-export .finish .finish-list {
    margin-top: 20px;
}

.edit-product .left-content {}

.dual-content {
    display: flex;
    justify-content: space-around;
}

.field-editor {
    position: absolute;
    z-index: 3;
    width: 400px;
    height: 300px;
    left: 50%;
}

.custom-field-editor {
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%,-50%);
    width: 500px;
    height: 343px;
    background-color: white;
    box-shadow: 0 0 6px #0000004d;
    z-index: 3;
    border-radius: 5px;
    overflow: hidden;
}

.custom-field-editor .finish-list {
    margin-top: 25px;
}

.custom-field-editor .custom-field-preview {
    width: 100%;
}

.finish-list.select-options .finish-item {
    justify-content: space-between;
    width: 65%;
    left: 50%;
    transform: translateX(-50%);
}

.custom-field-editor .select-options {
    margin-top: 10px;
}

.dropdown {
}

.finish-list.select-options {
    height: 135px;
    overflow: scroll;
}

.section-title {
    display: flex;
}

.preview .finish-list .finish-item {
    background-color: #ffffff;
    border-radius: 5px;
    border: 1px solid #0000003b;
    width: 61%;
    top: 40%;
    left: 50%;
    transform: translateX(-50%);
}

.preview .finish-list {
    margin-top: 85px;
}


.product-management .products {
    flex-direction: row;
    margin: auto;
    margin-bottom: 30px;
    margin-top: 30px;
    flex-wrap: wrap;
}

.product .content.secondary {
}


.product .finish-list, .flow .finish-list, .document .finish-list {
    margin-top: 25px;
    font-size: 11px;
}

.finish-item input {}

.finish-item select {
    font-size: inherit;
}

.product .fa.fa-arrow-left.back {
    font-size: 15px;
    top: 14px;
    left: 16px;
}


.product-detail .finish-list {
    width: 80%;
    margin-top: 171px;
    font-size: 12px;
}

.product-detail .product-image {}

.products-small-list {
    transform: scale(.6) translateX(-50%);
    transform-origin: 0 0;
    position: absolute;
    left: 50%;
    margin-top: 17px;
}

.edit-api-key .scopes .finish-list {
    margin-bottom: 30px;
}

.button.add {}

.itemlist .contents .item-image-container:hover .item-name {
    width: 95%;
}

.create-series {
    width: 500px;
    height: 330px;
    background-color: white;
    position: fixed;
    top: calc(50%);
    left: 50%;
    transform: translate(-50%,-50%);
    box-shadow: 0 0 9px #00000040;
    border-radius: 6px;
    z-index: 3;
    overflow: hidden;
}

.create-series .main .finish-list {
    margin-top: 20px;
}

.item.receipt .product-item:first-of-type {
    margin-left: 5px;
}

/* */

.subscription-editor {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
    width: 600px;
    height: 460px;
    background-color: white;
    z-index: 3;
    box-shadow: 0 0 9px #00000030;
    border-radius: 5px;
    overflow: hidden;
}

.subscription-editor .finish-list.basic {
    margin-top: 15px;
}

.subscription-editor .export-definition {
    margin-top: 15px;
}

.export-definition.series-definition {}

.subscription-editor .export-definition .finish-list {
    margin-top: 0px;
}

.subscription-editor .finish-list.series-select {
}

.subscription-editor .finish-list.series-options {
    width: 80%;
}

.subscription-editor .title {
    text-align: center;
}

.subscription-editor .series-options .finish-item {
    padding-top: 8px;
    padding-bottom: 8px;
}

.subscription-editor .letter-list {
    width: 95%;
    margin-top: 30px;
    left: 50%;
    transform: translateX(-50%);
    position: relative;
}

.subscription-editor .letter-list .finish-item .text {
    min-width: 145px;
}

.subscription-editor .series-list {
    border-bottom: unset;
    margin-top: 40px;
}

.edit-subscription .letter-list {
    padding: 0px 2.5%;
    height: 67%;
    overflow: scroll;
    box-shadow: inset 0 0 4px #00000045;
}

.activate-series-item .ordered-number {
    position: absolute;
    z-index: 2;
    color: #3b3b3b;
    right: 14px;
    top: 10px;
    display: flex;
}

.ordered-number .ord {
    margin-right: 5px;
}

.demondms-pref .demon-wide-items.items {
    margin-top: 10px;
}

.demon-large-item {
    width: auto;
    max-width: 770px;
    min-height: 200px;
    margin: 0px 65px;
    margin-left: auto;
    margin-right: auto;
    background-color: white;
    box-shadow: 0 0 6px #00000029;
    border-radius: 5px;
    position: relative;
    margin-bottom: 30px;
    overflow: hidden;
}

h2 {
    font-size: 20px;
    font-weight: lighter;
    color: #3b3b3b;
    margin-left: 30px;
    margin-top: 20;
    margin-top: 20px;
}

h1,h2,h3,h4,h5,h6 {
    font-weight: lighter;
    color: #3b3b3b;
    margin-left: 30px;
}

.demon-large-item h1 {
    top: 80px;
    margin-right: 50px;
}

p {
    font-weight: lighter;
}

p.explanation {
    margin-left: 30px;
    color: #7b7b7b;
    max-width: 90%;
}

.demon-large-item:first-of-type {
    margin-top: 0px;
}

.demon-large-item.credits {
    margin-top: 0px;
}

.charge-table {
    left: 50%;
    transform: translateX(-50%);
    position: relative;
    color: #3b3b3b;
    margin-top: 20px;
    margin-bottom: 10px;
}

.charge-table .finish-item.category .value {
    font-weight: bold;
}

.text {}

.charge-table .finish-item:not(.category), .charge-final .finish-item:not(.category) {
    margin-left: 8px;
    color: #4c4c4c;
}

.charge-final {
    width: 51%;
    position: relative;
    float: right;
    min-height: 30px;
    margin-bottom: 25px;
    margin-right: 2.5%;
    min-width: 360px;
}

.demon-large-item h2 {
}

.star-content {
    float: right;
}

.charge-final .finish-item:not(.category) {
    margin: unset;
}

.demon-large-item.credits i.fa.fa-plus {
    float: right;
    margin-right: 30px;
    cursor: pointer;
}

.add-credit {
    position: fixed;
    height: 350px;
    width: 560px;
    left: 50%;
    top: 50%;
    transform: translate(-50%,-50%);
    background-color: white;
    box-shadow: 0 0 7px #00000047;
    z-index: 3;
    border-radius: 3px;
    overflow: hidden;
}

.add-credit {}

.add-credit .select {
    display: flex;
    float: right;
    width: 237px;
    justify-content: flex-end;
    cursor: pointer;
}

.add-credit .select * {
    margin-left: 20px;
}

.add-credit center {
    margin-top: 30px;
}

.left-header {
    margin-left: 60px;
    margin-top: 19px;
}

.add-credit .content.cards .payment-item {
    position: relative;
    left: 50%;
    transform: translateX(-50%);
    margin-top: 5px;
    transition: 100ms ease-in;
}

.add-credit .payment-methods {
    height: 255px;
    overflow: scroll;
    box-shadow: inset 0px 3px 3px #00000017;
}

.add-credit .payment-item:first-of-type {
    margin-top: 20px !important;
}

.add-credit .payment-item:last-of-type {
    margin-bottom: 20px !important;
}

.add-credit .content.cards .payment-item:hover {
    background-color: #2a89ff;
    color: white;
    cursor: pointer;
}

iframe.three_d_secure {
    position: fixed;
    z-index: 4;
    border: unset;
    width: 530px;
    height: 610px;
    top: calc(50% + 25px);
    left: 50%;
    transform: translate(-50%,-50%);
    box-shadow: 0 0 4px #0000002e;
}

.edit-api-key {
    position: fixed;
    width: 500px;
    height: 300px;
    background-color: white;
    left: 50%;
    top: 50%;
    transform: translate(-50%,-50%);
    z-index: 3;
    border-radius: 4px;
    box-shadow: 0 0 9px #0000004d;
    overflow: hidden;
}

.edit-api-key .whitelist i.fa.fa-plus {
    top: 50%;
    float: right;
    float: right;
    margin-right: 30px;
	cursor:pointer;
}

.key-item .key-data {
    position: relative;
    width: 91%;
    padding-bottom: 7px;
    padding-top: 8px;
}

.key-item .key-data {
    display: flex;
    justify-content: space-between;
}

.key-list .key-item i.fa.fa-edit {
    cursor: pointer;
}

.key-item .actions {
    position: absolute;
    right: 13px;
    top: 10px;
}

.key-item .actions>* {
    margin-left: 10px;
}

.donor-list p {
    margin-left: 60px;
}

.edit-document {
    position: fixed;
    width: 900px;
    height: 600px;
    left: 50%;
    top: 50%;
    transform: translate(-50%,-50%);
    z-index: 3;
    background-color: white;
    box-shadow: 0 0 5px #0000003b;
    border-radius: 5px;
    overflow: hidden;
}

.content.assignment .finish-list.document-letters {
    width: 90%;
    margin-top: 20px;
}

.edit-document .content.fields i.fa.fa-plus {
    font-size: 16px;
    top: 50%;
    transform: translateY(-50%);
    position: absolute;
    right: 40px;
}

.edit-document .fields h2 {
    position: relative;
}

.edit-document .fields .finish-list {
    width: 90%;
}

.customer-settings .finish-list.settings {
    width: 500px;
    margin-top: 50px;
}

center>h6,center>h5, center>h4, center>h3, center>h2, center>h1 {
    margin-left: unset;
}

.transaction-preview .custom-data .fa {
    font-size: 10px;
    line-height: 16px;
    margin-left: 10px;
    margin-right: 10px;
    color: #3b3b3b;
}

.itemlist>h4 {
    text-align: center;
    position: absolute;
    width: 100%;
    margin: unset;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-100%);
    color: #b7b7b7;
}

.search-sidebar .primary-info input:not(:placeholder-shown) {
    background-color: #def0ff;
}

.card-names i.fa.fa-pencil-alt.editing {
    color: red;
}

.pii-container i.fa.fa-backspace {
    position: absolute;
    top: 50%;
    color: #3b3b3b;
    right: -40px;
    transform: translateY(-50%);
    cursor: pointer;
}

.customer-info.pii i.fa.fa-backspace {
    position: absolute;
    right: 15px;
    top: 18px;
    font-size: 12px;
    cursor: pointer;
}

.customer[noclick].selection-addition {
    cursor: copy;
}

.customer.highlight-selected .customer-header {
    background-color: #802ef0;
}

.customer.population-selected .customer-header {
    background-color: #2c71f0;
}

.population-list-export {
    position: fixed;
    width: calc(100% - 250px);
    left: 250px;
    height: 70px;
    padding-bottom: 3px;
    bottom: 0px;
    background-color: white;
    z-index: 1;
    box-shadow: 0 0 7px #989898;
    display: flex;
    justify-content: left;
    align-items: center;
}

.campaign-population-view .next {}

.population-list-export .next {
    position: relative;
    margin-right: 20px;
    left: unset;
    bottom: unset;
}

.population-list-export .next.cancel {
    background-color: #c93b3b;
    margin-left: auto;
    margin-right: 20px;
}

.subscription-editor .finish-list.letter-data {
    height: 270px;
    overflow: scroll;
    border-bottom: 1px solid #d5d5d5;
    margin-top:0px;
    padding-top:10px;
}

.order-fill .recipient-block h3 {
    border-bottom: 1px solid #e5e5e5;
    display: flex;
    align-items: flex-end;
}

.order-fill .recipient-block {
    margin-right: 30px;
}

.order-fill .recipient-block small {
    font-size: 12px;
    margin-left: 10px;
    margin-right: 20px;
}

.order-fill .letter-item {
    width: auto;
    height: 40px;
    display: flex;
    background-color: #ffffff;
    margin-left: 30px;
    box-shadow: 0 0 7px #00000042;
    border-radius: 5px;
    align-items: center;
    padding-left: 20px;
    padding-right: 20px;
    margin-bottom: 10px;
}

.order-fill .letter-item p {
    margin-left: 15px;
}

.order-fill .letter-item .actions {
    position: absolute;
    right: 20px;
}

.mod-transaction {
    width: 630px;
    height: 450px;
    background-color: white;
    position: fixed;
    left: 50%;
    top: 50%;
    transform: translate(-50%,-50%);
    box-shadow: 0 0 8px #00000059;
    border-radius: 6px;
    z-index: 3;
    overflow: hidden;
    transition: all 200ms ease-in;
}

.mod-transaction small {
    font-size: 10px;
    margin-right: 20px;
    margin-left: 20px;
    transform: translateY(-10%);
}

.mod-transaction .mod-column {
    display: inline-flex;
    flex-direction: column;
    position: relative;
    margin-left: 31px;
    text-align: right;
}

.view-transaction .main h2 {
    margin-bottom: 6px;
    display: flex;
    align-items: center;
}

.mod-transaction .warning p {color: white;}

.mod-transaction .sidebar {
    top: 0px;
    height: 100%;
    width: 225px;
    border-radius: 0;
}

.mod-transaction .sidebar h3 {
    margin-right: 30px;
    text-align: center;
}

.mod-transaction .content.main.shortened {
    left: 225px;
    width: calc(100% - 225px);
}

.mod-transaction h5 {
    margin-bottom: 14px;
}

.mod-transaction .itemlist {
    width: 70%;
    left: 50%;
    transform: translateX(-50%) scale(.9);
    margin-top: -20px;
    margin-bottom: 27px;
}

.mod-transaction h6 {
    margin-top: unset;
    margin-left: 33px;
}

.mod-transaction .finish-list {
    width: 80%;
    font-size: 14px;
    padding-bottom: 30px;
}

.transaction-preview .custom-data p {width: 85%;padding-left: 6px;left: 50%;transform: translateX(-50%);position: relative;color: black;text-align: left;}

.item.receipt.product-list {
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: flex-start;
    overflow: scroll;
    height: fit-content;
    height: -moz-fit-content;
    max-height: 100%;
    width: 300px;
    font-size: 10px;
    flex-shrink: 0;
}

.item.receipt.product-list p {
    padding-top: 1px;
    padding-bottom: 1px;
}

.mod-transaction .fa-pencil-alt, .mod-transaction .fa-plus {
    margin-left: 10px;
}

.mod-transaction .warning {
    width: 70%;
    height: 45px;
    font-size: 12px !important;
    margin-top: 15px;
    color: white !important;
    align-items: center;
    margin-bottom: 20px;
}

.mod-transaction .warning .fa {
    font-size: 12px;
}

.mod-transaction .fa-arrow-right {
    font-size: 8px;
    margin: 0px 10px;
}

.mod-transaction center p {
    display: flex;
    justify-content: center;
    align-items: center;
}

.new-transaction .manual {
    position: absolute;
    font-size: 10px;
    color: #3b3b3b;
    top: 20px;
    right: 30px;
    cursor: pointer;
}

.new-transaction .manual-subscription .finish-list {
    width: 90%;
    margin-top: 30px;
}

input[type="date"] {
    min-width: 150px;
}

.new-transaction .manual-subscription input {
    width: 200px;
}

.mod-transaction p.transaction-note {
    width: 70%;
    left: 15%;
    position: relative;
    margin-bottom: 40px;
    border-top: 1px solid #e4e4e4;
    padding-top: 8px;
    padding: 8px 10px;
}

.transaction-note {
    width: 70%;
    left: 50%;
    transform: translateX(-50%);
    position: relative;
    padding: 10px 30px;
    padding-left: 20px;
    box-shadow: 0 0 1px black;
    display: flex;
    margin-bottom: 10px;
    margin-top: 20px;
}

.mod-transaction .main .fa-sticky-note {
    margin-right: 20px;
    color: #3b3b3b;
    align-self: center;
}

.mod-transaction .transaction-note i.fa.fa-edit {
    position: absolute;
    right: 10px;
    font-size: 10px;
    cursor: pointer;
    top: 5px;
}

.mod-transaction .edit-option-list {
    display: flex;
    width: 86%;
    margin: auto;
    margin-top: 40px;
    flex-wrap: wrap;
    justify-content: center;
}

.mod-transaction .edit-option, .block-option {
    width: 150px;
    height: 70px;
    padding-bottom: 7px;
    color: #3b3b3b;
    box-shadow: 0 0 6px #0000002e;
    border-radius: 5px;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    margin: 15px;
    cursor: pointer;
}

.mod-transaction .edit-option p, .block-option p {
    text-align: center;
    font-size: 11px;
    margin-top: 15px;
}

.mod-transaction .edit-transaction-note .note-editing {
    width: 80%;
    left: 50%;
    min-height: 200px;
    transform: translateX(-50%);
    margin-top: 30px;
    position: relative;
    box-shadow: 0 0 3px #00000059;
    padding: 10px 10px;
}

.mod-transaction .edit-acknowledgement .finish-list,.mod-transaction .edit-campaigns .finish-list {
    margin-top: 40px;
}

.mod-transaction .edit-desc {
    width: 84%;
    margin: auto;
    margin-top: 50px;
}

.account-info-block i.fa.fa-exclamation-triangle {
    margin-left: 40px;
    font-size: 35px;
}

.sidebar-page {
    width: 100%;
    height: 100%;
    position: absolute;
    overflow-y: scroll;
}

.mod-transaction.right {
    left: calc(50% + (250px / 2));
}

.transaction-sidebar.history-sidebar {
    z-index: 4;
    height: 100%;
    top: 0px;
}

.customer .name-container {
    margin-left: 30px;
    display: flex;
    flex-direction: column;
    width: 45%;
}

.customer .item.company {
    font-size: 10px;
}

.paragraph-input {
    padding: 10px;
    border-radius: 3px;
    border: none;
    box-shadow: 0 0 2px #00000073;
    border-radius: 4px;
    text-align: left;
    font-size: 10px;
    overflow-y: scroll;
    background-color: white;
    min-width: 200px;
    height: fit-content;
	height: -moz-fit-content;
    max-width: 210px;
    color: #3b3b3b !important;
    min-height: 12px;
}

.campaign .content>p {
    margin-left: 30px;
}

.open-campaigns .finish-list {
    width: 90%;
}


.subscriptions .actions {
    position: absolute;
    margin-top: 6px;
    right: 16px;
}

.sidebar.orders .item:last-of-type {
    margin-bottom: 40px;
}

.log .name, .log .company {
    display: block;
}

.item {}

.log .item.company {
    font-size: 10px;
}

.log .name-container * {
}

.log .item.name {
    height: 18px;
}

body.scaled {
    transform: translateX(250px);
    box-shadow: 0 0 8px black;
    box-shadow: 0 0 8px #0000006e;
}

.dms-overlay-left {
    position: fixed;
    left: 0px;
    width: 250px;
    transform: translateX(-100%);
    background-color: #ffffff;
    height: 100%;
    z-index: 8;
    top: 0px;
    box-shadow: inset 0 0 10px #00000059;
}

.dms-overlay-top {
    position: fixed;
    width: 100%;
    background-color: white;
    height: 25%;
    top: -25%;
    z-index: 9;
    box-shadow: 4px 2px 5px #00000047;
}

.darken.scaled {
    z-index: 8;
}

.scaled .darken {
    z-index: 8;
}

.dms-overlay-left .item {
    width: 60%;
    padding-left: 30px;
    padding-right: 30px;
    position: relative;
    display: flex;
    justify-content: center;
    flex-direction: column;
    align-items: center;
    box-shadow: 0 0 6px #00000033;
    border-radius: 9px;
    margin: auto;
    margin-bottom: 15px;
    cursor: pointer;
    color: #3b3b3b;
}

.dms-overlay-left .item>* {
    padding-bottom: 13px;
    text-align: center;
}

.dms-overlay-left .item>*:first-child {
    padding-top: 13px;
}

.dms-overlay-left center {
    margin-bottom: 40px;
}

a {
    text-decoration: none;
}

.topic-sidebar {
    font-size: 15px;
}

.topbar .open {
    outline: 1px solid #ffffff75;
}

.help-main {
    position: absolute;
    overflow: scroll;
    left: 250px;
    width: calc(100% - 250px);
    height: calc(100% - 50px);
    top: 50px;
}

.content .article {
    width: 360px;
    height: 100px;
    background-color: white;
    box-shadow: 0 0 4px #00000075;
    margin: 10px;
    position: relative;
    cursor: pointer;
    border-radius: 6px;
    display: flex;
    flex-wrap: nowrap;
    justify-content: flex-start;
    align-items: center;
}

.help-main .content {
    justify-content: space-between;
    c(100% - 0px);
}

.help-main .help-articles {
    padding: 0px;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    flex-direction: row;
    align-items: center;
}

.help-articles .article p {margin-right: 20px;text-align: left;}

.help-articles .article p>i {
    margin-right: 12px;
    font-size: 17px;
    vertical-align: middle;
    transform: translateY(-2px);
}

.article>i {margin-left: 40px;margin-right: 40px;}

.help-articles .construction {
    position: absolute;
    font-size: 10px;
    top: 8px;
    right: 10px;
    color: #5d0606;
}

.help-main .content[articleid] p {
    padding: 0px 60px;
    margin-top: 39px;
}

.submission {
    width: 500px;
    height: 400px;
}

.modal {
    background-color: white;
    z-index: 8;
    box-shadow: 0 0 9px #0000002e;
    position: fixed;
    border-radius: 4px;
    left: 50%;
    top: 50%;
    transform: translate(-50%,-50%);
    overflow: hidden;
    overflow-y: scroll;
}

.submission input[type="text"] {
    width: 400px;
    margin-top: 20px;
}

.submission .paragraph-input {
    margin-top: 14px;
    width: 400px;
    max-width: unset;
    min-height: 100px;
    max-height: 140px;
}

.modal>p {
    margin-left: 40px;
    margin-top: 15px;
}

.plain .search-sidebar {
    height: 100%;
    top: 0px;
}

.plain .customer-list {
    height: 100%;
    top: 0px;
}

iframe.population {
    width: 100%;
    height: 100%;
    top: 0px;
    position: absolute;
    border: unset;
}

.plain .actions {
    display:none;
}

.customer.population-selected i.fa {color: white !important;}
.customer.highlight-selected i.fa {color: white;}

.customer[noclick].last {
    margin-bottom: 100px;
}

.inventory {
    width: 700px;
    height: 450px;
}

.inventory .main .finish-list {
    width: 90%;
}

h6 {
    margin-top: 7px;
    margin-bottom: 7px;
}

.inventory .main h2 {
    margin-bottom: 5px;
}

.inventory .product-description, .statistics .product-description {
    position: absolute;
    right: 15px;
    font-size: 10px;
    top: 10px;
    max-height: 16px;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: 240px;
    overflow:hidden;
    text-align: right;
}

.inventory .options {
    justify-content: center;
}

.inventory .content.all .sidebar {
    top: 0;
    height: 100%;
    width: 200px;
    z-index: 1;
}

h4 {
    margin-top: 15px;
    margin-bottom: 15px;
}

.inventory .all .sidebar .item {
    font-size: 12px;
}

.inventory .all .sidebar h4 {
    margin-top: 22px;
    margin-left: 27px;
}

.inventory .sku .finish-list {
    width: 75%;
}

.inventory .manage-sku .finish-list {
    margin-top: 40px;
    width: 70%;
}

.inventory .manage-sku .finish-item i {
    width: 29px;
    text-align: center;
    margin-right: 5px;
    margin-left: 5px;
}

.inventory .manage-sku .finish-item {
    cursor: pointer;
}

.inventory .manage-sku h2 {
    max-width: 82%;
    margin-top: 30px;
}

.manage-sku-inventory .finish-item {
    cursor: pointer;
    width: 80%;
    margin: auto;
}

.advanced-search .content li[index] {
    font-size: 14px;
}

.advanced-search .content .finish-item[index] p {
    max-width: 79%;
}

.sidebar .item p {
    margin-left: 0px;
    max-width: 88%;
}

.flip-card-body, .flip-card-face{
    height: 100%;
    top: 0px;
    position: absolute;
    width: 100%;
}

.flip-card-face.front {
}

.flip-card-body {
    transition: transform 0.8s;
    transform-style: preserve-3d;
}

.flipped .flip-card-body {
    transform: rotateX(180deg);
}

.flip-card-face{
    position: absolute;
    width: 100%;
    height: 100%;
    -webkit-backface-visibility: visible;
    -webkit-backface-visibility: hidden; /* Safari */
    backface-visibility: hidden;
    background-color: white;
    -webkit-transform-style: preserve-3d;
    box-shadow: 0 0 9px #0000002e;
    border-radius: 5px;
}

.flip-card-face.back{
    transform: rotateX(180deg);
}

.flip-card {
    perspective: 1000px;
}

.hover-flip-card:hover .flip-card-body{
    transform:rotateX(180deg)
}

.new-user .finish-list {
    width: 80%;
}

.user-list {}

.user-access-settings.modal center h2 {
    margin-bottom: 5px;
}

.user-access-settings.modal center p {
    font-size: 13px;
}

.add p {
    display: inline-block;
}

.new-document .finish-list .finish-item {
    cursor: pointer;
}

.notification .load-throbber {
    position: absolute;
    width: 20px;
    height: 20px;
    top: unset;
    transform: unset;
    right: 20px;
    left: unset;
}

.notification.task {
    background: unset;
    background-color: white;
    color: inherit !important;
    padding-right: 60px;
    min-width: calc(100% - 30px);
}

.notification.task i.fa.fa-check {
    position: absolute;
    right: 23px;
    margin: unset;
    color: #44aa44;
}

.notification.task i.fa.fa-times {
    position: absolute;
    right: 23px;
    margin: unset;
    color: #7c0000;
}


.notifications {
    perspective: 984px;
}

.notification {
    cursor: pointer;
}

.advanced-search .add {
    position: absolute;
    right: 40px;
    width: fit-content;
    width: -moz-fit-content;
    left: unset;
    transform: translateY(6px);
}

.advanced-search hr {
}

.advanced-search .main center {
    padding-bottom: 10px;
    padding-top: 20px;
}

.advanced-search .main center h2 {
    margin-top: unset;
}

.advanced-search .main .finish-list {
    margin-top: unset;
    height: 71%;
    overflow: scroll;
}

.advanced-search .operator {
}

.advanced-search .finish-item .value {
    cursor: default;
}

.advanced-search .main .finish-item[or] {
    padding-left: 30px;
}

.advanced-search .main .finish-item {user-select: none; -webkit-user-select: none;}

.advanced-search .white-back .option-button, .advanced-search .white-back i.interact-button {
    position: absolute;
    right: 30px;
    width: -moz-fit-content;
    margin-top: unset;
    top: 50%;
    transform: translateY(-50%);
    right: 100px;
    left: unset;
    cursor: pointer;
    font-size: 21px;
}

.advanced-search [handler] li i.fa.fa-plus {
    padding: 0px 5px;
    cursor: pointer;
}

.advanced-search .white-back .interact-button {
    right: unset;
    left: 100px;
}

.advanced-search .content[handler] .value {
    padding-left: 30px;
}

.advanced-search .content[handler] .finish-list {
    padding-bottom: 40px;
}

[relate='product-management'] .sidebar {
    top: 0px;
    z-index: 2;
    height: 100%;
}

.sidebar-page {
    width: calc(100% - 250px) !important;
    left: 250px;
    height: 100%;
    position: absolute;
    transition: all 300ms;
    z-index: 1;
    overflow-x: hidden;
}

.sidebar-retractable.sidebar-retracted {
    transform: translateX(-80%);
}

.sidebar-page.sidebar-retracted-page {
    left: calc(250px * .2);
    width: calc(100% - (250px * .2)) !important;
}

.sidebar.sidebar-retractable.sidebar-retracted i.fa.fa-mouse {
    position: absolute;
    right: calc(50px / 2 - 7px);
    top: 15px;
}

.sidebar:not(.sidebar-retracted) i.fa.fa-mouse {
    display:none;
}

.sidebar.sidebar-retracted i[lock] {
    display:none;
}

.sidebar.sidebar-retracted i[lock] {
    display:none;
}

.modal.modal-presentation {
    width: 100%;
    height: 100%;
    background-color: #0000005e;
    border-radius: 0;
    box-shadow: unset;
    outline: 10px solid #0000005e;
    z-index: 1300;
    overflow: hidden;
}

.confirm.modal p {
    margin-top: 40px;
}

.popover {
    position: absolute;
    background-color: white;
    z-index: 5;
    box-shadow: 0 0 7px #00000059;
    padding: 15px 15px;
    border-radius: 5px;
    width: fit-content !important;
    width: -moz-fit-content !important;
}

.popover:after {
    content: "";
    position: absolute;
    width: 10px;
    height: 20px;
    top: 50%;
    left: 0px;
    background-color: white;
    transform: translateY(-50%);
}
.popover:before {
    content: unset;
    position: absolute;
    width: 12px;
    height: 12px;
    top: 50%;
    left: -6px;
    background-color: white;
    transform: translateY(-50%) rotate(45deg);
    box-shadow: 0 0 3px #00000052;
}

ul {
    list-style: none;
    padding-left: unset;
    margin-top: unset;
    margin-bottom: unset;
}

.popover ul li {
    padding: 7px 11px;
}

.popover ul li:last-of-type {
    border-bottom: unset;
}

.popover ul {
    margin-bottom: 0px;
    margin-top: 0px;
}

.popover ul li {
    cursor: pointer;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.popover.top-center-arrow:after {
    left: 50%;
    transform: translate(-50%, 0%);
    top: 0;
    width: 20px;
    height: 13px;
}

.popover.top-center-arrow:before {
    top: 2px;
    right: 50%;
    transform: translateY(-50%) translateX(50%) rotate(45deg);
    left: unset;
    border-radius: 3px;
}

.popover.bottom-center-arrow:after {
    left: 50%;
    transform: translate(-50%, 0%);
    bottom: 0px;
    width: 20px;
    height: 10px;
    top: unset;
}

.popover.bottom-center-arrow:before {
    top: 100%;
    right: 50%;
    transform: translateY(-50%) translateX(50%) rotate(45deg);
    left: unset;
}

.popover.right-center-arrow:after {
    right: 0px;
    left: unset;
}

.popover.right-center-arrow:before {
    left: unset;
    right: 0px;
    transform: translate(50%, -50%) rotate(45deg);
}

.series-menu {
    padding: 46px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
}

.dashboard .tile h2 i.fa {
    margin-right: 14px;
    width: 26px;
}

.dashboard .tile {
    padding-top: 10px;
    padding-bottom: 61px;
    box-shadow: 0 0 6px #00000052;
    border-radius: 5px;
    width: 250px;
    position: relative;
    margin: 20px;
}

.dashboard .tile center>i {
    position: absolute;
    right: 18px;
    top: 12px;
}

.button i {
    margin-left: 8px;
    vertical-align: middle;
}

.subscription-editor .settings .finish-item p {
    min-width: 151px;
    display: flex;
    justify-content: space-between;
}

.series-popup {
    width: 250px;
    height: 100px;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    color: #3b3b3b !important;
}

.series-popup>div {
    height: 100%;
    position: relative;
}

.series-popup .next {
    bottom: 0;
    transform: translateX(-50%) scale(.8);
    transform-origin: center;
}

.series-popup img {
    width: 100px;
    height: 100%;
    object-fit: contain;
}

.series-popup p {
    margin-top: 7px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    width: 112px;
}

.sidebar-full-height{
    top:0px;
    height: 100%;
}

.statistics.modal {
    width: 90%;
    height: 90%;
}

.statistics .product-description {
    width: 400px;
}

.sidebar.sidebar-retractable i[lock]{
    position: absolute;
    right: calc(50px / 2 - 7px);
    top: 15px;
    cursor:pointer;
    color: #5c5c5c;
}

.tile {
    box-shadow: 0 0 4px #00000061;
    border-radius: 6px;
    margin: 20px;
    padding: 20px 20px 80px 20px;
    position: relative;
}

.tile.no-next {
    padding-bottom: 30px;
}

.statistics .report-tiles {
    margin-top: 38px;
}

.advanced-search .finish-list.fields{
    margin-top:200px !important;
}

i.fa.fa-angle-left {
    left: 10px;
    position: fixed;
    top: 22px;
    cursor: pointer;
    z-index: 1;
}


.advanced-search.modal.large {
    width: 95%;
    height: 95%;
}

.advanced-search .main.content .finish-item {
    background-color: white;
}

.advanced-search .main.content .finish-item:first-of-type {
    margin-top:5px;
}

.advanced-search .main.content .finish-item:last-of-type {
    margin-bottom:5px;
}

.create-transaction {
    width: 1000px;
    height: 650px;
}

input#amount, input#extra, select#payment_type {
    margin-right: 22px;
}

input#amount, input#extra {
    width: 90px;
    margin-right: 9px;
}

.create-transaction .main .finish-list {
    margin-top: 25px;
}

.create-transaction .main .advanced {
    position: absolute;
    right: 35px;
    top: 20px;
    font-size: 19px;
    cursor: pointer;
}

.create-transaction input#date, .create-transaction input#time {}

input#create_time, input#create_date {
    margin-left: 15px;
}

.create-transaction .finish-list#types {
    width: 80%;
    margin-top: 50px;
    cursor: pointer;
}

.create-transaction .transaction-preview {
    width: 450px;
    margin-top: 50px;
}

.create-transaction .create-options-list.finish-list {
    width: 80%;
    margin-top: 25px;
}

.create-transaction div#sale-items {
    width: 75%;
    margin: auto;
    margin-top: 55px;
}

.create-transaction .assign-gift {
    padding: 5px 20px;
    margin-left: 20px;
}

.merge-block {
    padding: 5px 10px;
    width: fit-content;
    width: -moz-fit-content;
    box-shadow: 0 0 5px #0000004a;
    margin-bottom: 8px;
    border-radius: 5px;
    padding-top: 5px;
    margin-top: 11px;
    margin-left: 15px;
    height: fit-content;
    display: flex;
    align-items: center;
}

.view-code-structure {
    width: 80%;
    height: 520px;
    padding: 20px;
}



.merge-block>span.merge-display {
    margin-right: 20px;
    font-weight: lighter;
    color: #5959ff;
    padding-top: 5px;
    padding-bottom: 5px;
}

.merge-block.conditional-data,.merge-block.body {
    flex-direction: column;
    align-items: flex-start;
}

.finish-list[disabled] * {
    color: #a6a6a6;
    cursor: default !important;
}


.secondary-list {
    height: calc(83% - 70px);
    overflow: scroll;
    box-shadow: inset 0 0 6px #0000003d;
}

.create-series-item input.ord {
    margin-right: 20px;
}

center>h2 i.fa.fa-plus {
    position: absolute;
    right: 50px;
    font-size: 15px;
    top: 50%;
    transform: translateY(-50%);
    cursor: pointer;
}

center {position: static;}

.custom-field-editor .dropdown-page .finish-item {
    background-color: white;
    cursor: grab;
}

.custom-field-editor .dropdown-page>center {
    position: relative;
}


.custom-field-editor .preview h2 {margin-bottom: 0px;}

.content.secondary center {
    position: relative;
}

.change-margin {
    width: 600px;
    height: 400px;
}

.change-margin input.margin-input {
    width: 62px;
    text-align: center;
}

.margin-page {
    width: 100px;
    height: 132px;
    margin: 16px 37px;
    box-shadow: 0 0 9px #00000052;
}

.mailings .next.create-mailing {
    right: 20px;
    bottom: 0;
    top: 0;
    margin: auto;
    left:unset;
    transform:unset;
}

.csv-export.modal {
    width: 600px;
    height: 400px;
}

.items.campaign-wide-items {}

.item.line-item {}

.new-mailing div#sub-population {
    margin-top: 50px;
}

.new-mailing iframe {
    top: 0;
    position: absolute;
    width: 100%;
    height: 100%;
    border: unset;
}

.new-mailing.modal.expand {
    width: 93%;
    height: 90%;
}

.key-item i.fa.fa-fingerprint {
    position: absolute;
    top: 12px;
    left: 12px;
}

.modal.view-credential {
    width: 1000px;
    height: 700px;
}

.dot.true {
    background-color: green !important;
}

article {
    margin-bottom: 90px;
}

code.replaceable {
    color: #1f8000;
}

.transaction:first-of-type {
    margin-top: 40px;
}

.customer-card .main .add:not(button) {
    left: unset;
}

.customer-card .campaigns, .customer-card .transactions {
    margin-bottom: 0px;
    padding-bottom: 10px;
    padding-top: unset;
}


.demon-large-item.history, .demon-large-item.credit-changes {
    min-height: 62px;
    cursor: pointer;
}

.demon-large-item.history i.fa.fa-arrow-right, .demon-large-item.credit-changes i.fa-arrow-right {
    position: absolute;
    font-size: 23px;
    right: 60px;
    top: 50%;
    transform: translateY(-50%);
}


.invoice.invoice-year {
    width: 500px;
    padding: 20px;
    border-radius: 5px;
    box-shadow: 0 0 4px #0000004f;
    display: flex;
    flex-direction: column;
    margin-bottom: 30px;
}

.invoices:not(.content) {
    display: flex;
    align-items: center;
    flex-direction: column;
    margin-top: 50px;
}

.invoice .finish-item {
    cursor: pointer;
}

.finish-item.selectable:hover, li[selectable]:hover {
    background-color: #f3f3f3;
    cursor: pointer;
}

.invoice.invoice-year.minified {
    height: 50px;
    overflow: hidden;
    padding-bottom: 30px;
}

.invoice h2 {
    cursor: pointer;
}

.invoice.minified .finish-list {
    margin-top: 40px;
}

.invoice.content .demon-large-item {
    margin-top: 65px !important;
}

.credit-changes .finish-list {
    margin-top: 50px;
    width: 80%;
}

.credit-changes .finish-item.ui-list-item:last-of-type {
    margin-bottom: 50px;
}

.series-options-page .finish-list {
    width: 80%;
    min-width: 200px;
    max-width: 600px;
    margin-top: 50px;
}

.series-options.modal {
    width: 600px;
    height: 400px;
}

.add-to-campaign.modal {
    width: 700px;
    height: 500px;
}

body.left-bias {
    width: calc(100% - 320px);
}

.left-bias .topbar {
    width: calc(100% + 320px);
}

.remote-entry-data {
    position: absolute;
    width: 275px;
    left: unset;
    right: -270px;
    height: 400px;
    transform: translate(0,-50%);
}

.left-bias-data {
    width: 320px;
    right: -320px;
    height: calc(100% - 50px);
    top: 50px;
    position: fixed;
    z-index: 1;
    overflow: hidden;
    border-left: 1px solid #00000036;
}

.left-bias-data .order-data {
    width: 300px;
    height: 468px;
    position: relative;
    transform: translate(-50%,0%);
    top: 3%;
}

i.fa.fa-times {}

i.fa.fa-times.close {
    position: absolute;
    margin-top: 14px;
    margin-left: 12px;
    font-size: 19px;
    right: 0px;
    cursor: pointer;
}

.left-bias-data .transaction-preview {
    left: unset;
    width: 450px;
    transform: scale(.6666);
    right: 10px;
    transform-origin: top right;
    margin-top: 44px;
    transition: all 200ms;
    border-radius: 10px;
    z-index: 2;
    position: absolute;
    box-shadow: 0 0 9px #0000002e;
}

.controls {
    position: absolute;
    bottom: 30px;
    width: calc(100% - 80px);
    height: 48px;
    background-color: #f6f6f6;
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
    padding: 0px 20px;
    margin-left: 20px;
}

.left-bias-data .controls i {
    cursor: pointer;
}

.content.overflow {
    overflow: visible;
}

.left-bias .modal.modal-presentation {
    width: calc(100% + 320px);
    transform: translate(0,-50%);
    left: unset;
}

.left-bias-data center.empty {
    position: relative;
    top: 36%;
}


.finish-list.tab .finish-item {padding-left: 50px;}

.finish-list.collapse {
    height: 0;
}

.embedded.finish-list {
    margin-top: unset;
    margin-left: 10px;
}

.data-item {
    margin-top: 20px;
    width: 90%;
    margin: auto;
    margin-top: 20px;
    margin-bottom: 20px;
    height: 125px;
    box-shadow: 0 0 6px #00000030;
    border-radius: 5px;
    position: relative;
    overflow: hidden;
    display: flex;
    justify-content: space-between;
    align-items: center;
    cursor: grab;
}

.customer-card .personal-info .add {
    position: relative;
}

.data-item .data-label {
    font-weight: lighter;
    margin-left: 7px;
    margin-top: 5px;
    font-size: 12px;
}

.address .address-line {
    position: relative;
    margin-left: 15px;
    font-weight: lighter;
    max-width: 65%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.data-item .modify {
    margin-right: 12px;
    font-size: 11px;
    white-space: nowrap;
    transform: translateY(-5%);
}

.data-item .modify>* {
    margin-left: 6px;
    cursor: pointer;
    padding: 0 5px;
}

.pii-container .notes {
    width: 500px;
    min-height: 250px;
    margin-bottom: 20px;
    margin: auto;
    margin-top: 20px;
    overflow: hidden;
    box-shadow: 0 0 8px #00000029;
    border-radius: 5px;
    padding: unset;
}

.customer-info {
    position: relative;
    width: 400px;
    padding-bottom: 29px;
    margin-left: 20px;
    margin-right: 20px;
    z-index: 1;
    height: fit-content;
    margin-top: 20px;
    height: -moz-fit-content;
    padding: 0px 20px 0px;
}

.personal-data {
    width: 500px;
    padding-bottom: 33px;
    margin-left: auto;
    margin-right: auto;
    box-shadow: 0 0 8px #00000029;
    border-radius: 5px;
    overflow: hidden;
}

.personal-data input {
    width: 150px;
    text-align: left;
}

.account-data-container {
    margin-left: auto;
    margin-right: auto;
}

.personal-info {
    margin-top: 60px;
    display: flex;
    justify-content: center;
    align-items: center;
    margin-bottom: 60px;
    flex-wrap: wrap;
    padding: 0px 0px;
}

.personal-info .telephones, .personal-info .emails, .personal-info .addresses, .personal-info .tags, .personal-info .attributes {
    width: 440px;
    height: 275px;
    padding: 0px 0px;
    overflow-y: scroll;
    overflow-x: hidden;
    position: relative;
    align-self: baseline;
    margin: 10px;
    box-shadow: 0 0 8px #00000029;
    border-radius: 5px;
}

.data-item.phone, .data-item.email {
    height: 50px;
}

.phone-line, .email-line {padding-left: 13px;max-width: 64%;overflow: hidden;text-overflow: ellipsis;}

.modify {
    font-size: 12px;
}

.modify>* {
    margin-left: 10px;
    cursor: pointer;
}

.personal-info .finish-list p {
    max-width: 87%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.edit-email, .edit-phone, .edit-address, .add-tag, .edit-note, .edit-attribute {
    width: 600px;
    height: 400px;
}

.edit-email .finish-list {
}

.personal-info .finish-list small {
    font-size: 12px;
    text-align: center;
}

.personal-info .flex-v.special>i, .object-container .flex-v.special>i {
    font-size: 10px;
    color: black;
}

.edit-address.modal {
    height: 560px;
    width: 740px;
}

.lookup-result {
    display: inline-block;
    margin-right: 20px;
    font-size: 11px;
    max-width: 190px;
    overflow: hidden;
    text-align: right;
    text-overflow: ellipsis;
}

.lookup-result-container{
	align-items: center;
  display: flex;
}

.partial-address {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 160px;
    position: absolute;
    transform: scale(.75);
    transform-origin: center right;
    right: 55px;
    top: 21px;
}

.personal-info .finish-list {
    padding-bottom: 20px;
    margin-top: unset;
}

[handler] li .value * {
    margin-left: 20px;
}

.label-item {
    text-align: center;
    margin-top: 30px;
    font-weight: 100;
    font-size: 17px;
    margin-bottom: 7px;
    border-bottom: 1px solid #eaeaea;
    padding-bottom: 5px;
}

.customer-list center h2 {
    margin-bottom: 6px;
}

div {}

.warnings {
    font-size: 12px;
    position: relative;
    width: fit-content;
    width: -moz-fit-content;
    border: 1px solid gray;
    padding: 5px;
    cursor: pointer;
    transition: all 100ms;
    border-radius: 5px;
    margin-top: 20px;
}

.warnings .fa {
    margin-left: 12px;
    margin-right: 12px;
    font-size: 10px;
}

.warnings:hover {
    background-color: #ab0006;
    color: white;
    border: 1px solid transparent;
}

.modal.warnings-ui {
    width: 700px;
    padding-bottom: 25px;
    min-height: 300px;
}

.customer.ui-list-item .finish-list {
    width: 100%;
    margin-top: unset;
}

.customer.ui-list-item .customer-header, .campaign.ui-list-item .campaign-header, .large-object .object-header {
    width: 100%;
    position: relative;
    height: 40px;
    display: flex;
    left: 0;
    align-items: center;
    padding-top: 4px;
    padding-bottom: 4px;
    z-index: 2;
    border-bottom: 1px solid lightgrey;
    flex-shrink: 0;
    cursor: pointer;
}

.customer.ui-list-item .customer-name {
    margin-left: 15px;
    white-space: nowrap;
    text-overflow: ellipsis;
    max-width: 82%;
    overflow: hidden;
}

.large-object.ui-list-item .finish-list .finish-item {
    padding-left: 10px;
    padding-right: 10px;
}

.customer-body-section, .object-body-section {
    position: relative;
    left: 0;
    padding: 0px 0px;
    height: calc(100% - 49px);
    width: 100%;
    margin: auto;
    max-height: 185px;
    overflow-y: scroll;
    overflow-x: hidden;
    padding-bottom: unset;
}

.customer:not(.empty):hover {
    background-color: #1a62bf03;
}

.customer.new.ui-list-item {
    /*height: 15px;*/
}


.customer.population-selected .customer-header {
    color: white;
    border-bottom: 1px solid #ffffffb3;
}
.customer.highlight-selected .customer-header {
    color: white;
    border-bottom: 1px solid #ffffffb3;
}

.customer.population-selected {
    background-color: white;
    box-shadow: 0 0 0px 2px #2c71f0;
}

.customer.highlight-selected {
    background-color: white;
    /*box-shadow: 0 0 0px 2px #802ef0;*/
}

.modal.bulk-customer-actions {
    width: 700px;
    height: 500px;
}


.pii-row-item {
    margin: 10px;
    margin-top: 20px;
}

.edit-address .finish-item i.fa.fa-arrow-right {
    margin-left: 20px;
}

.iso-lookup-tab.modal {
    width: 700px;
    height: 530px;
}

.system-page {
    width: 100%;
    height: calc(100% - 50px);
    margin-top: 50px;
    position: absolute;
}

.campaign-list {
    display: flex;
    margin: auto;
    margin-top: 20px;
    max-width: 900px;
    justify-content: center;
}

.campaign.ui-list-item {
}

.campaign-code {
    margin-top: 0;
    font-weight: lighter;
    font-size: 11px;
}

.campaign-name {}

.system-page .sidebar {
    top: 0;
    height: 100%;
}


.transaction-item {
    width: 500px;
    box-shadow: 0 0 4px #0000003d;
    border-radius: 6px;
    margin: auto;
    position: relative;
    margin-bottom: 20px;
    cursor: pointer;
    overflow: hidden;
    z-index: 2;
}

.transaction-item:first-of-type {
    margin-top: 20px;
}

.transaction-item .object-header {
    height: 45px;
    border-bottom: 1px solid #0000002b;
    display: flex;
    padding: 0px 20px;
    align-items: center;
    justify-content: left;
    font-size: 12px;
    background-color: white;
}

.transaction-item .dates {
    text-align: right;
}

.object-body {
    height: fit-content;
    position: relative;
    width: 100%;
    overflow-y: scroll;
    background-color: #fbfbfb;
}

.dates.flex-right {
    margin-left: auto !important;
}

.object-header>*:not(:first-of-type) {
    margin-left: 25px;
}

.transaction-item .object-header .fa {
    font-size: 10px;
    margin-left: 4px;
}

.icon-tags {
    position: absolute;
    bottom: 8px;
    right: 10px;
    display: flex;
    color: #000000cf;
    font-size: 12px;
    align-items: center;
    flex-direction: row-reverse;
}

.icon-tags>i {
    margin-left: 8px !important;
}

.transaction-item.small {
    height: 45px;
}

.transaction-item.small .object-header {
    border-bottom: unset;
}

.object-header .icon-tags {
    position: relative;
    bottom: unset;
    right: unset;
    margin-left: 10px;
}

.transaction-item:hover {box-shadow: 0 0 0px 1px #2c71f0;}

.object-header .type {
    min-width: 70px;
    max-width: 70px;
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
}


.object-body div.itemlist {height: 200px;width: 100%;padding: unset;border-radius: unset;box-shadow: unset;border: unset;border-top: 1px solid #ececec8f;}


.object-body i.icon.fa.fa-shopping-cart {
    font-size: 8px;
    top: 7px;
    left: 7px;
}

.transaction-item .object-header i.has-action {
    color: #4d82ef;
    transition: all 200ms;
}

.transaction-item .object-header i.has-action:hover {
    transform-origin: center center;
}

.parallel-customer-container{
	width: 95%;
	margin: auto;
	display: flex;
	flex-wrap: wrap;
	justify-content: space-evenly;
	margin-bottom: 100px;
}

.transaction-item.medium {
}

center {}

.transaction-item .sub-range {
    text-align: center;
    font-size: 15px;
    display: flex;
    align-items: center;
}

.transaction-item .sub-range i {
    margin: 0px 10px;
    font-size: 7px;
}

.remote-order-screen {
    width: 700px;
    height: 500px;
}

.topbar.remote-entry-topbar.main-topbar {
}

.topbar .next.white.exit {
    margin-left: auto;
}

.encapsulation-topbar .next, .topbar .next, .next.right {
    top: unset;
    left: unset;
    margin-right: 20px;
    margin-left: auto;
    transform: unset;
    position: relative;
    bottom: unset;
    transform: translate(8px, 0px) scale(0.8);
}

.topbar div.first {
    margin-left: 30px;
}

.topbar>* {
    position: relative;
}

.next:not(.error):hover {
    box-shadow: 0 0 5px #00000059;
}

.topbar .item {
    margin-left: 5px;
    margin-right: 5px;
}

.item.search {
}

.view-transaction {
	width: 1200px;
	height: 750px;
}

.view-transaction .transaction-item {
    margin: auto;
    margin-top: 80px;
}

.view-transaction .main>.finish-list {
    width: 90%;
    bottom: 20px;
    position: absolute;
}

.view-transaction .content .finish-item>i {
    margin-right: 20px;
}

.view-transaction .content>.finish-list {
    width: 90%;
}

.red {
}

.create-transaction .transaction-item {
    margin-top: 0px !important;
    flex-grow: 0;
    margin-bottom: 0px;
}

.create-transaction .vertical-middle {
    height: 80%;
    position: absolute;
    width: 100%;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.transaction-item .finish-item:last-of-type {
    margin-bottom: 5px;
}

.transaction-item.limited .object-body {
    max-height: calc(244px - 45px);
}

.edit-transaction .finish-item p i {
    margin-right: 20px;
}

.view-transaction i.fa.fa-question-circle {
    margin-right: 13px;
}

.active-indicator {
    width: 4px;
    height: 4px;
    border-radius: 100%;
    position: absolute;
    top: calc(45px / 2);
    left: 9px;
    transform: translate(0,-50%);
    z-index: 2;
}

.green {
}

.active-indicator.active {
    background-color: green;
}

.active-indicator.inactive {
    background-color: red;
}

.live-object.order-item {
    height: fit-content;
    width: auto;
    padding: 35px 20px 10px 20px;
    display: flex;
    justify-content: left;
    border-bottom: 1px solid #00000029;
    position: relative;
    transition: all 200ms;
}

.live-object .monitors {
    height: 100%;
    width: fit-content;
    display: flex;
    flex-direction: column;
    align-items: center;
}

.live-object .monitors>* {
    margin-top: 2px;
    margin-bottom: 2px;
    font-size: 9px;
}

.live-object .monitors>.inactive {
    color: #00000021;
}

.live-object .body {
    width: -webkit-fill-available;
    padding-left: 16px;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.live-object .order-item .type {
    font-weight: 100;
}

.live-object.order-item {
    font-weight: lighter;
    cursor: pointer;
}

.order-item .type {
    font-size: 16px;
    position: absolute;
    top: 10px;
    left: 20px;
}

.order-item .time {
    position: absolute;
    top: 7px;
    right: 12px;
    font-size: 10px;
}

.live-object.order-item:hover {background-color: #fafafa;}

.order-item .person {
    font-size: 12px;
}

.yellow {
    color: #f37916;
}

.queue-item .transaction-item.minimize {
    position: absolute;
    margin: unset;
    top: 20px;
    right: 20px;
    transition: all 200ms;
    transform: scale(.4);
    transform-origin: top right;
}

.queue-item .transaction-item.minimize:hover {
    transform: scale(1);
}

.queue-item .finish-list.order-options {
    width: 580px;
    bottom: 160px;
    position: absolute;
}

.queue-column {
    width: 500px;
}

.note {
    max-width: 270px;
}

.queue-item>.itemlist {
    width: 500px;
    margin: auto;
    margin-top: 170px;
}

.queue-item .transaction-item:not(.minimize) {
    margin-top: 110px;
}

.product .product-info, .flow .flow-info {
    width: -webkit-fill-available;
    margin-right: auto;
    height: 100%;
    margin-top: 20px;
}

.product .product-info h2 {
		margin-top: 0;
		margin-left: 0;
		text-align: center;
		overflow: hidden;
		white-space: nowrap;
		max-width: 100%;
		text-overflow: ellipsis;
		margin: auto !important;
		margin-bottom: 10px;
}

.product-image {
    width: 200px;
}

.product .product-info i.fa.fa-arrow-right {
}

.product:hover {}

.topbar>i.fa.fa-arrow-left.back {
    z-index: 2;
    font-size: 17px;
    position: relative;
    margin-left: unset;
    top: 0;
    left: 0;
    margin-left: 35px;
    margin-right: -14px;
}

.topbar i.fa.fa-arrow-left.back {
    position: relative;
    top: 0;
    left: 0;
    margin-left: 35px;
    margin-right: 0px;
}

.product-image, .system-image {
    width: 200px;
    height: 200px;
    justify-content: center;
    display: flex;
    margin-right: 40px;
    position: relative;
}

.product-card .product-options .finish-list {
}

.variant .flex, .flex {
    display: flex;
    flex-direction: row;
}

.product-card .flex.product-head {
    padding: 40px;
    justify-content: space-around;
    border-bottom: 1px solid #00000012;
    height: 220px;
}

.product-card .product-options, .product-card .product-tags {
    width: -webkit-fill-available;
    width: 382px;
    position: relative;
}

.product-card .title {
    margin-bottom: -20px;
    margin-left: 40px;
    font-size: 24px;
    color: #4e4e4e;
}

.product-options h3, .product-tags h3 {
    margin-top: 15px;
    margin-bottom: 25px;
}

.product-card .variants-list {
    margin: auto;
    width: 700px;
    margin-top: 40px;
    position: relative;
}

.variant {
    width: 370px;
    height: 350px;
    box-shadow: 0 0 4px #0000003d;
    border-radius: 4px;
    margin: 20px;
    position: relative;
    display: flex;
    flex-direction: column;
    padding-top: 40px;
}

.variant .product-image {
    height: 130px;
    width: 130px;
    justify-content: center;
    display: flex;
    margin-right: 0;
}

.variant .data-body {
    font-family: monospace;
}

.variant .table {
    margin-left: 1px;
    font-size: 10px;
    font-family: monospace;
    width: 160px;
    margin-right: 10px;
}

.variant input {
    width: 95px;
    border-radius: 0;
}

.variant .modify {
    margin-left: auto;
    margin-right: 40px;
    font-size: 20px;
}

.variant .variant-option-data {
    margin-left: 0px;
    font-size: 13px;
    width: fit-content;
    min-width: 100px;
    text-transform: capitalize;
    margin-top: 20px;
    position: absolute;
    top: 0px;
}

.variant .table.sku {
    margin-left: auto;
    margin-right: 20px;
    width: 180px;
}


.product-image.editable:hover img {
    filter: brightness(0.5);
}

.product-image .modify {
    display: none;
    position: absolute;
    z-index: 12;
}

.product-image:hover modify {
    display: block;
}

.product-image.editable:hover .modify {
    display: flex;
    flex-direction: column;
    top: 50%;
    transform: translate(0,-50%);
    font-size: 30px;
    color: white;
}

.product-image .fa {
    padding: 20px;
}

.variant-count .fa-plus {
    font-size: 18px;
    float: right;
    margin-right: 38px;
    cursor: pointer;
}

.variants-list .add {
    position: absolute;
    right: 40px;
    left: unset;
    margin-top: 4px !important;
}

.variant:last-of-type {
}

.edit-variant {
    width: 900px;
    height: 570px;
}

.edit-variant .finish-list.variant-options {
}

.edit-variant .variant-head {
    display: flex;
}

.edit-variant .variant-head {
    margin-top: 35px;
    margin-left: 40px;
    margin-right: 40px;
    justify-content: center;
    align-items: start;
    padding-bottom: 40px;
    border-bottom: 1px solid #0000000d;
}

.edit-variant .other.finish-list {
    margin-top: 30px;
    width: 80%;
}

.topbar.white .item.open {
    outline: 1px solid #00000029;
}

.tab-list {
    height: 50px;
    box-shadow: 0px 2px 4px #0000001a;
    display: flex;
    align-items: center;
}

.tab-list .item {
    width: fit-content;
    padding: 16px 50px;
    overflow: hidden;
    border-right: 1px solid #0000000f;
}

.tab-list .item:hover {
    background-color: #00000005;
    cursor: pointer;
}

.tab-list .item:last-of-type {
    border-right: unset;
}

.tab-page {
    position: relative;
    overflow: hidden;
    width: 100%;
}

.variant .data-body {
    height: 80px;
    display: flex;
    align-items: center;
    text-transform: uppercase;
    flex-wrap: wrap;
}

.variant-option-data {}

.variant .data-body .data {
    margin-right: 40px;
    height: 16px;
}

.variant-sub-data {
    height: 32px;
    margin-top: 20px;
    align-items: start;
    justify-content: center;
    display: flex;
    flex-wrap: wrap;
    flex-direction: column;
}

.variant .data-body .data:first-of-type {
}

.d-label {display: inline-block;width: 40px;}

.edit-variant .product-image {
    width: 280px;
    height: 200px;
    display: flex;
}

.notice {
    text-align: center;
    margin-top: 50px;
    font-weight: lighter;
}

.product-selector, .document-selector {
    width: 710px;
    height: 560px;
}

.product-boxed .product-image {
    width: 200px;
    height: 200px;
    margin-right: unset;
}

.product-boxed {
    width: 250px;
    height: 280px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    padding: 15px;
    position: relative;
    overflow: hidden;
    cursor: pointer;
}

.product-boxed p {
    width: 100%;
    height: 16px;
    overflow: hidden;
    margin-left: unset;
    white-space: nowrap;
    margin-top: 30px;
    text-align: center;
    text-overflow: ellipsis;
}

center {}

.product-boxed:hover .product-image {filter: brightness(0.5);}

.product-selector .products {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    margin: auto;
    margin-top: 40px;
    margin-bottom: 40px;
}

.product-small {
    width: 200px;
    height: 218px;
}

.product-small .product-image {
    width: 180px;
    height: 125px;
    margin-top: 0px;
}

.product-small .product-info h2 {font-size: 11px;}

.product-small .modify {
    margin-right: 10px;
    font-size: 13px;
    flex-shrink: 0;
}

.detail .product-image {
    height: 250px;
    width: 250px;
}

.detail .detail-head {
    margin: 40px;
    display: flex;
    align-items: center;
}

.detail-head .finish-list {
    width: 55%;
    left: unset;
    position: relative;
    transform: unset;
    margin: auto;
}

.next.error {
    background-color: #e83c3cc9 !important;
}

.next.error i.fa {
    top: 49%;
}

.series-card .topbar i.fa.fa-edit {
    margin-left: auto;
}

.series-card .topbar i.fa.fa-trash {
    margin-right: 30px;
}

.series-card .topbar i {
    cursor:pointer;
}

.topbar i.fa.fa-angle-left.back {
    position: relative;
    top: 0;
    left: 0;
    margin-left: 15px;
    margin-right: -30px;
}

.object-list{
    margin-top: 30px;
    display: flex;
    flex-direction: column;
    justify-content: start;
    align-items: center;
    width: 90%;
    position: relative;
    flex-wrap: wrap;
    justify-content: center;
    flex-direction: row;
    margin: auto;
    margin-bottom: 30px;
    margin-top: 30px;
    flex-wrap: wrap;
}

.flow i.fa.fa-project-diagram {font-size: 25px;margin-top: 0;margin-bottom: 60px;}

.flow .flow-info {
    margin-top: 0px;
    margin-bottom: 20px;
}

.block-editor {
    width: 100%;
    height: calc(100% - 50px);
}

.flow.ui-list-item {
    height: 113px;
}

.flow h2 {
    margin: 5px;
}


.page .add:not(button) {
    margin-top: 30px;
}

.modal.edit-flow {
    width: 600px;
    height: 400px;
}

.modal.manage-flow {
    width: 600px;
    height: 400px;
}

.modal.flow-point-select {
    width: 700px;
    height: 500px;
}

.flow-point-select .search {
    margin-right: 30px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 220px;
}

.modal.upload-flow-script {
    width: 570px;
    height: 350px;
}

.upload-flow-script input[type="file"] {
    width: 240px;
}


.modal.customer-select {
    width: 95%;
    height: 85%;
    overflow: hidden;
    background-color: #2196f3;
}

.modal.customer-select iframe {
    width: 100%;
    height: calc(100% - 50px);
    border-radius: 3px;
    overflow: hidden;
    border: unset;
}

.customer-select .topbar .next {
    margin-left: 30px;
}

body.plain > .customer-card {
    top: 0px;
    height: 100%;
}

.search-sidebar h2 {
    margin-bottom: 3px;
    margin-top: 23px;
    margin-left: auto;
}

.create-transaction .customer.ui-list-item {transform-origin: top right;transform: scale(.6);position: absolute;right: 60px;}

.create-transaction .name-container {
    height: 135px;
}


.customer-card.flagged .card-name:not(.add-name) {
}

.customer-card .main>.status {
    right: unset;
    left: 20px;
    top: 25px;
    color: #3d3d3d;
    display: flex;
    flex-direction: column;
    justify-content: start;
    background-color: white;
    border-radius: 6px;
    border: 1px solid #3b3b3b;
}

.customer-card .status>* {
    margin-bottom: 17px;
}

.revision.flagged.open {
    background-color: #ff9720;
    color: white;
}

.revision.flagged {
    background-color: #ff97205c;
}

.customer.flagged .customer-header {
    background-color: #ff8800;
    color: white;
}

.customer.flagged i.fa {
    color: white;
}

.customer.flagged.population-selected {
    box-shadow: 0 0 0px 2px #ff8800;
}

.customer.flagged i.fa-flag {
    margin-left: auto;
    margin-right: 20px;
    font-size: 13px;
}

.flagged *:not(.pii-container)>.card-names>.card-name[contenteditable] {
    background-color: #ff9720bf;
}

.customer-card .finish-item.flagged-object {
    background-color: #ffa0004d;
    border-radius: 6px;
}

.transaction-item.flagged-object {
    box-shadow: 0 0 0px 1px #ffa000;
}
.modal.revision-menu {
    width: 900px;
    height: 600px;
}

.page {
    overflow-y: scroll;
    overflow-x: hidden;
    height: calc(100% - 50px);
    position: relative;
    z-index: 1;
    transition: all 300ms;
}

.encapsulate.encapsulate-presentation {
    width: 100%;
    height: 100%;
    position: fixed;
    background-color: white;
    z-index: 4;
    top: 0;
}

.flag-select .customer-card {
    position: absolute;
    transform: rotate(0deg);
    width: calc(100% - 250px);
    left: 250px;
    height: calc(100%);
}

.flag-action-bar {}

.flag-action-bar {
    background-color: white;
    position: absolute;
    position: absolute;
    height: calc(100% - 50px);
    bottom: 0px;
    width: 60px;
    right: 0px;
    box-shadow: 0 0 5px 0 #00000033;
    display: flex;
    flex-direction: column;
    align-items: center;
    z-index: 1;
    transition: all 200ms;
    transform: translateX(0px);
}

.flag-action-bar.right {
    transform: translateX(110%);
}

.encapsulate .page {
    height: 100%;
}

.next.relative {
    bottom: unset;
    transform: unset;
    left: unset;
}

.relative {
    position: absolute;
}

.next.flag-queue {
    margin: auto;
    margin-bottom: 10px;
}

.central-actions {
    width: 200px;
    margin-right: auto;
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
}

.modal.flag-select {
    width: 1246px;
    height: 700px;
}

.flag-select .next.release {
    background-color: green;
}

.notification.move-left {
    transform: translateX(95%);
}

.status i.fa.fa-flag.has-action:hover {
    transform: scale(1.1);
    transition: all 200ms;
    cursor: pointer;
    filter: invert(1);
}

.splash {
    width: 100%;
    height: 100%;
    position: fixed;
    background-color: #2196f3;
		background: linear-gradient(45deg, #3b91ff, #7fb7ff);
    z-index: 1000;
    display: flex;
}

.splash img {
    width: 100px;
    object-fit: cover;
    position: relative;
    margin: auto;
    transform: translateY(-55px);
}

[point-set='access-management-topbar'][point='users'] .finish-list {
    width: 60%;
    margin-top: 30px;
}

[point-set='access-management-topbar'][point='keys'] .finish-list {
    width: 60%;
    margin-top: 30px;
}

.topbar.white.retract {margin-top: -60px; margin-bottom:10px;}

.modal.invoice {
    width: 10in;
    height: 6in;
}

.modal.invoice .demon-large-item {
    box-shadow: unset;
    margin-top: 30px;
    margin-bottom: 20px !important;
    margin: 8px 20px 30px 20px;
}

.population-list-export .next.clear {
    background-color: #3f51b5;
}

.freeze * {
  -webkit-transition: none !important;
  -moz-transition: none !important;
  -o-transition: none !important;
  -ms-transition: none !important;
  transition: none !important;
}

.page.extend {
    height: 100%;
}

.modal.onboard-first {
    width: 1000px;
    height: 600px;
}

.page.content {
    position: absolute;
    top: 50px;
}

.user-detail i.fa.fa-user {
    margin-right: 7px;
}

.user-detail {
    padding: 6px 14px;
    border-radius: 5px;
    overflow: hidden;
    white-space: nowrap;
    flex-shrink: 0;
}

.modal.user-actions {
    width: 600px;
    height: 400px;
}

[point='overview'] .demon-large-item {
}

[point='modules'] .finish-list {
    margin-top: 0px;
}

.product-list, .object-list {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: center;
    margin-top: 40px;
    margin-bottom: 40px;
}


.topbar i.fa-plus.add {
    margin-left: auto;
    margin-right: 30px;
    cursor: pointer;
    left: unset;
    top: unset;
    margin-top: unset;
}

.sequenced-item {
    width: 600px;
    height: 260px;
    margin: 20px auto;
    display: flex;
    flex-direction: row;
    box-shadow: 0 0 4px #0000003d;
    padding: 20px;
    border-radius: 6px;
}

.sequenced-item:first-child {
}

.sequenced-item .product-small {
    box-shadow: unset;
    margin: unset;
    width: 250px;
}

.sequenced-item .finish-list i {
    margin-left: 15px;
}

.edit-series-item {
    width: 700px;
    height: 500px;
}

.nothing-to-show {
    text-align: center;
    position: absolute;
    left: 50%;
    transform: translate(-50%, -50%);
    top: 38%;
    white-space: nowrap;
}

.nothing-to-show h2 {
    margin: unset;
}

.nothing-to-show .fa {
    margin-bottom: 20px;
}

.nothing-to-show * {
    color: #4d4d4d !important;
}

.edit-variant .variant-options {
    position: relative;
    height: 200px;
    width: -webkit-fill-available;
    border-radius: 6px;
}

.topbar-push {
    margin-left: auto;
    margin-right: 30px;
}

.action {
    cursor: pointer;
}

.modal.edit-image {
    width: 700px;
    height: 500px;
}

.edit-image [point='address'] .system-image {
    margin-left: 30px;
}

.edit-image .flex {
    margin-top: 30px;
}

[point='address'] input {
    width: 212px;
}

.variant-options .nothing-to-show {top: 48%;}

.variant .body {
    width: 300px;
    margin-top: 20px;
}

.variant .finish-list {
    margin-top: unset;
    font-size: 12px;
}

.variant .flex {
    justify-content: space-around;
    margin-bottom: 10px;
}

.campaign h2 {
		margin-left: 0;
		text-align: center;
		overflow: hidden;
		white-space: nowrap;
		text-overflow: ellipsis;
		/*margin-bottom: 10px;
		/margin-top: 20px;*/
		margin: 10px auto;
		max-width: 100%;
		margin-bottom: 7px;
}

.campaign {
    margin: 21px;
    width: 380px;
    border-radius: 7px;
    position: relative;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    box-shadow: 0 0 4px #0000003d;
    height: 375px;
    position: relative;
}

[point-set='campaign-card-sidebar'] iframe {
    width: 100%;
    height: 100%;
    border: unset;
    display: block;
}


.campaign-mailing {
    margin: 20px;
    width: 330px;
    border-radius: 7px;
    position: relative;
    overflow: hidden;
    display: flex;
    align-items: center;
    flex-direction: column;
    box-shadow: 0 0 4px #0000003d;
    padding: 20px 20px;
    height: 120px;
}

.campaign-mailing>h2 {
    margin-left: unset;
}

[point-set='campaign-mailing-sidebar'] iframe {
    width: 100%;
    height: 100%;
    display: block;
    border: unset;
}




[point-set='campaign-mailing-sidebar'] iframe {
    width: 100%;
    height: 100%;
    display: block;
    border: unset;
}


.user {
    margin: 21px;
    width: 195px;
    position: relative;
    overflow: hidden;
    display: flex;
    align-items: center;
    flex-direction: column;
    box-shadow: 0 0 4px #0000003d;
    padding: 20px 20px;
    height: 241px;
    border-radius: 6px;
}

.user.key h2 {
    margin-top: 5px;
}

.user.key {
}

.user.key small {
    font-size: 11px;
}

.user h2 {
    margin-top: 10px;
}
.mailing-item {
    margin: 21px;
    width: 380px;
    border-radius: 7px;
    position: relative;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    box-shadow: 0 0 4px #0000003d;
    height: 375px;
    position: relative;
}

.mailing-item:first-child {
}

.mailing-item .finish-item i {
}

.switch.disabled {filter: grayscale(.6);cursor: no-drop;}

.switch.disabled::after {
    background-color: white;
}

.mailing-results-small {
    width: 250px;
    position: relative;
}

.mailing-item h2 {
    margin: unset;
    margin-bottom: 15px;
}

.mailing-item .finish-list {
    font-size: 13px;
}

.mailing-item .fa-check {
    color: green;
}

.mailing-item .flex>div>p {
}

.linear-list {
    margin-top: 60px;
    margin-bottom: 60px;
}

.create-transaction .desc {
    text-align: right;
}

.select-campaign.modal {
    width: 800px;
    height: 600px;
}

.select-address.modal {
    width: 800px;
    height: 600px;
}

.document {
    width: 330px;
    margin: 21px;
    width: 185px;
    border-radius: 7px;
    position: relative;
    overflow: hidden;
    display: flex;
    align-items: center;
    flex-direction: column;
    box-shadow: 0 0 4px #0000003d;
    padding: 20px 20px;
    height: 230px;
}

.document>.fa {
    font-size: 58px;
    margin-top: 30px;
    margin-bottom: 30px;
}

.document h2 {
    margin: 0 auto;
    margin-top: 10px;
    text-align: center;
    overflow: hidden;
    white-space: nowrap;
    max-width: 100%;
    text-overflow: ellipsis;
    margin-bottom: 10px;
    font-size: 15px;
}

.document .document-info {
    width: -webkit-fill-available;
    margin-right: auto;
    height: 100%;
    margin-top: 20px;
}

.document .fa-cog {
    font-size: unset;
    position: absolute;
    bottom: 2px;
    right: 20%;
}

div#html-container {
    height: 100%;
}



.tox-toolbar-overlord {
    margin-top: -1px !important;
}

.tox-toolbar__primary {
    position: fixed !important;
    width: 100% !important;
}

.tox-sidebar-wrap {
    margin-top: 38px !important;
}

.custom-page-size.modal {
    width: 500px;
    height: 300px;
}

.page-setup.modal {
    width: 1000px;
    height: 600px;
}

.modal.merge-menu {
    width: 700px;
    height: 500px;
    z-index: 68;
}

.subscription-model {
    width: 500px;
    height: 300px;
    box-shadow: 0 0 4px #0000003d;
    border-radius: 6px;
    margin: 20px auto;
    overflow: hidden;
}

.subscription-model>p {
    margin-left: 30px;
    font-size: 16px;
}

.subscription-model i.fa.fa-cog {
    margin-left: auto;
    margin-right: 30px;
    cursor: pointer;
}

.edit-series-subscription-model {
    width: 800px;
    height: 500px;
}

.bulk-actions-menu.modal {
    width: 700px;
    height: 500px;
}

.create-mailing.modal {
    width: 600px;
    height: 400px;
}

.customer[noclick] {
    cursor: no-drop;
}

.customer i.fa-minus-circle {
    margin-left: auto;
    margin-right: 20px;
    color: red;
    font-size: 12px;
    cursor: pointer;
}

.topbar.white {
    padding: 0px 0;
}

.display-item.no-sep {
    border-right: unset;
}

.personal-info li, .object-container:not(.basic) li:not([category]) {padding-left: 40px !important;}

.iso-lookup-tab .finish-list {
    margin-top: 0px;
}

.finish-item.selectable.warn {
    background-color: #ffc04c;
    padding-left: 50px;
}

.finish-item.selectable.warn i.fa-exclamation-triangle {
    margin-right: 5px;
    margin-bottom: 5px;
    position: absolute;
    top: 50%;
    transform: translate(-31px, -50%);
}
.customer-info.notes .finish-list {
    margin-top: 0px;
}

datalist {
    display: none !important;
}

.user i.fa.fa-user, .user i.fa.fa-key {
    font-size: 35px;
    margin-top: 34px;
}

.view-credential .finish-list {
    width: 80%;
    margin-top: 30px;
    margin-bottom: 60px;
}

.modal.create-restriction {
    width: 600px;
    height: 400px;
}

.modal.refactor-product-variants {
    width: 950px;
    height: 650px;
}

.refactor-product-variants .finish-item .fa.action {
    transform: translateY(2px);
}


.refactor-product-variants div#options {
    transform: unset;
    left: unset;
    margin-top: unset;
}

.refactor-product-variants .finish-item {
    padding-top: 4px;
    padding-bottom: 4px;
    font-size: 13px;
}

.refactor-product-variants .finish-list {
    left: unset;
    transform: unset;
    margin-top: unset;
}

.refactor-product-variants input[type="text"] {
    width: 130px;
    font-size: inherit !important;
    padding: 3px;
    padding-right: 10px;
}

input[type="datetime-local"] {
    width: 220px !important;
    padding-left: 10px !important;
}


.campaign .display-item {
    max-width: 300px;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.campaign.small-campaign-card {
    height: 50px;
    width: 700px;
    margin: 5px;
    box-shadow: 0 0 2px 0 #00000054;
    border-radius: unset;
    padding: 2px;
    border-radius: 3px;
}

.campaign.small-campaign-card>.topbar {
    box-shadow: unset;
}
.campaign-mailing.small-mailing-card>.topbar {
    box-shadow: unset;
}

.campaign-mailing.small-mailing-card {
    height: 50px;
    width: 700px;
    margin: 5px;
    box-shadow: 0 0 2px 0 #00000054;
    border-radius: unset;
    padding: 2px;
    border-radius: 3px;
}


.modal.customer-toolbox {
    width: 700px;
    height: 500px;
}

.modal.merge-customers {}

.modal.merge-customers {
    width: 600px;
    height: 400px;
}

input[type="radio"] {
    width: unset;
    height: unset;
    padding: unset;
    -webkit-appearance: radio;
    cursor: default;
    border: unset !important;
    outline: none !important;
    border-radius: unset;
}

input[type="checkbox"] {
    width: unset;
    height: unset;
    padding: unset;
    -webkit-appearance: checkbox;
    cursor: default;
}

.flag-select .page>.finish-list {
    margin-top: unset;
}

.flag-select .history-sidebar i.fa.fa-arrow-left.back {
    display: none !important;
}

.checklist {
}

.path-vertical .checklist {
    text-align: left;
    padding-top: 13px;
    padding-bottom: 13px;
    margin-left: 40px;
    position: relative;
    transition: all 100ms;
    display: flex;
    align-items: center;
    user-select: none; -webkit-user-select: none;
}

.flow-bubble {
    width: 30px;
    height: 30px;
    background-color: #353535;
    border-radius: 100%;
    position: relative;
    transform: translate(-50%, 0px);
    z-index: 2;
    margin-right: 10px;
    box-shadow: 0 0 18px 2px #0000003b;
    transition: all 100ms;
    flex-grow: 0;
    flex-shrink: 0;
}

.flow-line {
    position: absolute;
    width: 17px;
    background-color: #adc8ff;
    left: 0px;
    top: 50%;
    height: 100%;
    transform: translate(-50%, 0px);
    box-shadow: 0 0 6px 0 #00000030;
    transition: all 100ms;
}

.checklist:not(.open):not(.active) .flow-line-top {
}

.checklist.open .flow-line, .checklist:not(.open):not(.active) .flow-line {
    background-color: #f2f2f2;
    outline: 2px dotted;
    outline-offset: -2px;
}

.active .flow-bubble {
    background-color: #adc8ff;
}

h3 {}

.checklist h3 {
    margin: unset;
}

.checklist i.fa.fa-lock {
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    color: #cccccc;
    font-size: 12px;
}

.checklist.open .flow-bubble {
    background-color: #558dff;
}

.checklist.open .fa, .checklist.active .fa {
    display: none;
}

.checklist.active .fa {}

.checklist.locked {
    cursor: not-allowed;
}

.checklist {
    cursor: pointer;
    position: relative;
}

.checklist:not(.locked):hover .flow-bubble{
    background-color: #75a2ff;
}

.checklist.locked:hover .flow-bubble .fa{
    color: white;
}

.checklist.locked:hover .flow-bubble{
    background-color: #262626;
}

.checklist.outline-hover-path .flow-line {
    outline: 2px solid #adc8ff !important;
    background-color: #adc8ff !important;
}

.checklist.outline-hover .flow-bubble {
    background-color: #adc8ff;
}

.checklist.outline-hover-path .flow-bubble{
    background-color: #adc8ff;
}

.checklist.outline-hover-exclude .flow-line, .checklist.outline-hover .flow-line {
    filter: opacity(.6);
    /*outline: 2px dotted;
    outline-offset:-2px;*/
}

.checklist.outline-hover-exclude .flow-bubble {
    background-color:#353535;
}

.checklist.outline-unreachable {
    cursor: not-allowed !important;
}

.checklist.outline-unreachable:hover .flow-bubble {
    background-color: #353535;
}

.sidebar-retracted i.fa.fa-arrow-right {
    position: absolute;
    top: 0;
    right: 0;
    width: 50px;
    height: 10000%;
    text-align: right;
    cursor: pointer;
    transform: translate(0px, 0px);
}

.sidebar.sidebar-retractable:not(.sidebar-retracted) i.fa.fa-arrow-right {
    display: none;
}

.sidebar-retracted .fa-arrow-right::before {
    position: relative;
    top: 20px;
    right: 18px;
}

.sidebar-retracted i.fa.fa-arrow-right:hover {
    background-color: #00000008;
}

[path-set='fulfill-path'] .itemlist {
    width: 70%;
    margin: auto;
    margin-top: 60px;
}

.path {
    position: relative;
    margin: auto;
    display: flex;
    flex-direction: row;
    align-items: center;
    width: fit-content;
    margin-top: 20px;
    padding-bottom: 30px;
    margin-bottom: 20px;
}

.path .checklist .flow-line {
    height: 17px;
    width: 100%;
    left: 15px;
    transform: translate(0%, -50%);
}

.path .checklist {
    padding-right: 40px;
    align-items: center;
    display: flex;
}

.path .flow-bubble {
    margin-right: unset;
    transform: translate(0px);
}

.path .checklist:last-of-type {
    padding-right: unset;
    width: 30px;
}

.path .checklist h3 {
    position: relative;
    transform: translate(calc(-50% + -15px), 30px);
    white-space: nowrap;
}

.checklist.list-in .flow-line {
    transform: rotate(-17deg);
}

.checklist.list-out .flow-line {
    transform: rotate(17deg) translate(-100%, 0);
}

.sidebar .checklist:hover {
    border-right: 3px solid #75a2ff;
}

.sidebar .checklist.locked:hover {
    border-right: none;
}

.queue-select .page>.itemlist {
    width: 70%;
    margin: auto;
    margin-top: 105px;
}

.checklist.list-tabbed {
    margin-left: 57px;
}

.modal.edit-product {
    width: 800px;
    height: 500px;
}

.create-transaction [point-set="subscription-config-topbar"] .itemlist {
    width: 80%;
    margin: auto;
    margin-top: 80px;
}

.modal.migrate-transaction {
    width: 500px;
    height: 300px;
}

.transaction-item.highlight {
    box-shadow: 0 0 0px 1px #2c6ff0;
}

.modal.edit-transaction-cart {
    width: 700px;
    height: 480px;
}

.modal.edit-transaction-cart .itemlist {
    width: 80%;
    margin: auto;
    margin-top: 50px;
}

.create-document.modal {
    width: 800px;
    height: 500px;
}

.modal.create-communication {
    width: 600px;
    height: 400px;
}

.modal.set-communication-recipients {
    width: 500px;
    height: 300px;
}

.payment-methods {
    height: 500px;
}

.modal.add-payment-method {
    width: 900px;
    height: 550px;
}

.modal.billing-information {
    width: 750px;
    height: 500px;
}

.demon-large-item.notification-settings .finish-list {
    margin-top: 30px;
    width: 95%;
}

ul {
    font-weight: lighter;
}

li, li[openable]>.open {}

.popover ul li:hover {outline: 1px solid #e8e8e8;}

ul[list] li {
    display: flex;
    justify-content: space-between;
    padding: 0.83em 30px;
    align-items: center;
    border-bottom: 1px solid #ececec8f;
    position: relative;
    align-items: center;

}

ul[list] li:last-of-type {
    border-bottom: unset;
}

li[openable], li[category] {display: block !important;cursor: pointer;user-select: none; -webkit-user-select: none;padding: 0px 0px !important;}

li[openable]>ul, li[category]>ul {border-left: 1px dashed #666666;width: calc(100% - 21px);margin-left: 20px;transform: unset;}

li[openable]>.open, li[category]>.category {left: 0;top: 0;position: relative;display: flex;justify-content: space-between;align-items: center;padding: .8em 30px;}

li[openable] .open:hover {
    background-color: #f3f3f3;
    cursor: pointer;
}

li[openable][open]>.open>.fa-angle-right {
    transform: translate(-2px, 0px) rotate(90deg);
    transition: all 200ms;
}

li[openable]>.open>.fa-angle-right {
    transform: translate(-2px, 0) rotate(0);
    transition: all 200ms;
}

li[openable][open] {
    height: fit-content;
}

li[openable]:not([open])>ul {
    display: none;
}

li[category][hidden]>ul {
    display: none;
}

li[openable]>ul>li:first-of-type, li[category]>ul>li:first-of-type {
    border-top: 1px solid #00000008;
}

.edit-address-component.modal {
    width: 800px;
    height: 600px;
}

.popover li>i {
    margin-left: 20px;
    width: 20px;
    text-align: center;
}

p.preview {
    margin-right: 30px;
    margin-left: auto;
}

.topbar.white.large-topbar {
    transform: unset;
    padding: unset;
    height: 70px;
}

.advanced-search .topbar h2 {
    margin-left: auto;
    margin-right: auto;
}

.advanced-search i.fa.fa-info-circle {
    margin: 0px 10px 0px 0px;
}

.popover.right-top-arrow:before {
    left: unset;
    right: 1px;
    transform: translate(50%, -50%) rotate(45deg);
    top: 11px;
}

.popover.right-top-arrow:after {right: 1px;left: unset;top: 12px;}

.variant .flex {
    flex-direction: column;
    align-items: center;
    margin-top: 15px;
    height: 240px;
    justify-content: space-evenly;
}
.advanced-search ul li {
    background-color: white;
}

.advanced-search .main .value>* {
    margin-left: 10px;
    margin-right: 10px;
}

.advanced-search .main ul {
    max-height: calc(100% - 16% - 70px);
    overflow: scroll;
    margin-bottom: unset;
    margin-top: unset;
}
.object-selector {
    width: 200px;
    height: 20px;
    border: 1px solid #2a9bff;
    padding: 2px 5px 2px 5px;
    border-radius: 4px;
}

.object-select {
    min-width: 20px;
    transition: all 200ms;
    height: 22px;
    display: inline-flex;
    align-items: center;
    background-color: #4caf50;
    border: 1px dashed #4caf50;
    padding: 5px 20px 5px 15px;
    border-radius: 5px;
    white-space: nowrap;
    overflow: hidden;
    cursor: pointer;
}

.object-select:focus, .object-select:hover  {
}

.object-select i {
    margin-right: 13px;
}

.object-select span {
    width: calc(100%);
    overflow: hidden;
    text-overflow: ellipsis;
}

.object-select[required]:not([set]) {
    background-color: #ff57220f;
    border: 1px dashed #ff8686;
}

.object-select:not([required]):not([set]) {
    background-color: #fbfbfb;
    border: 1px dashed #b7b7b7;
}

.object-select[required]:not([set]) i.fa.fa-stroopwafel {

    color: #792020;
}

.object-select:not([required]):not([set]) i.fa.fa-stroopwafel{
    color:#474747;
}

.object-select[reqired]:not([set]) span {
    color: #b4a9a9;
}

.object-select[set] {
    color: white;
}

.object-select[set] i.fa.fa-ban {
    display: block;
    color: #293b2a42;
}

.object-select i.fa.fa-ban {
    display: none;
}

.object-select[set] i.fa.fa-stroopwafel {
    display: none;
}

.object-select i.fa.fa-stroopwafel {}

.object-select[set]:not([disabled]):hover i.fa.fa-ban {
    color: white;
}

.object-select[set]:not([no-change]):hover {
    background-color: #70b873;
    border: 1px solid #70b873;
}

.object-select:not([reqired]):not([set]) span {
    color: Gray;
}

.object-select:not([required]):not([set]):not([disabled]):hover {
    border: 1px solid #00000087;
}

.object-select[required]:not([set]):not([disabled]):hover {
    border: 1px solid #ff8686;
}

.graph {
    width: 500px;
    height: 250px;
}

.graph {
    border: 1px solid #00000014;
    position: relative;
    flex-grow: 0;
    flex-shrink: 0;
    margin: 10px;
}

.graph {}

.graph .load-throbber {
    top: 50%;
    position: absolute;
}

.topbar.white.fix-pad {
    padding: 0px 20px;
    transform: translateX(-40px);
    width: calc(100% + 20px);
}

.graph .page {
    padding: 20px;
}

[point='usage'] .graph:last-of-type {
    margin-bottom: 30px;
}

.modal.quick-product-information {
    width: 800px;
    height: 600px;
}

.modal.customer-communications {
    width: 1050px;
    height: 700px;
}

.modal.new-customer-communication {
    width: 650px;
    height: 450px;
}

.modal.pdf-preview {
    width: 90%;
    height: 90%;
}

.modal.email-preview {
    width: 90%;
    height: 80%;
}




/* Email Client UI */

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

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

.dropdown, .dropleft, .dropright, .dropup {
    position: relative;
}

svg {
    overflow: hidden;
    vertical-align: middle;
}

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

.flex-wrap {
    -ms-flex-wrap: wrap!important;
    flex-wrap: wrap!important;
}


@media (min-width: 992px) {
    .inbox-wrapper .email-aside .aside-content {
        padding-right: 10px;
    }
}

.inbox-wrapper .email-aside .aside-content .aside-header {
    padding: 0 0 5px;
    position: relative;
}

.inbox-wrapper .email-aside .aside-content .aside-header .title {
    display: block;
    margin: 3px 0 0;
    font-size: 1.1rem;
    line-height: 27px;
    color: #686868;
}

.inbox-wrapper .email-aside .aside-content .aside-header .navbar-toggle {
    background: 0 0;
    display: none;
    outline: 0;
    border: 0;
    padding: 0 11px 0 0;
    text-align: right;
    margin: 0;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    position: absolute;
}

@media (max-width: 991px) {
    .inbox-wrapper .email-aside .aside-content .aside-header .navbar-toggle {
        display: block;
    }
}

.inbox-wrapper .email-aside .aside-content .aside-header .navbar-toggle .icon {
    font-size: 24px;
    color: #71738d;
}

.inbox-wrapper .email-aside .aside-content .aside-compose {
    text-align: center;
    padding: 14px 0;
}

.inbox-wrapper .email-aside .aside-content .aside-compose .btn,
.inbox-wrapper .email-aside .aside-content .aside-compose .fc .fc-button,
.fc .inbox-wrapper .email-aside .aside-content .aside-compose .fc-button,
.inbox-wrapper .email-aside .aside-content .aside-compose .swal2-modal .swal2-actions button,
.swal2-modal .swal2-actions .inbox-wrapper .email-aside .aside-content .aside-compose button,
.inbox-wrapper .email-aside .aside-content .aside-compose .wizard > .actions a,
.wizard > .actions .inbox-wrapper .email-aside .aside-content .aside-compose a {
    padding: 11px;
}

.inbox-wrapper .email-aside .aside-content .aside-nav {
    visibility: visible;
    padding: 0 0;
}

.inbox-wrapper .email-aside .aside-content .aside-nav.collapse {
    display: block;
}

@media (max-width: 991px) {
    .inbox-wrapper .email-aside .aside-content .aside-nav.collapse {
        display: none;
    }
}

@media (max-width: 991px) {
    .inbox-wrapper .email-aside .aside-content .aside-nav.show {
        display: block;
    }
}

.inbox-wrapper .email-aside .aside-content .aside-nav .title {
    display: block;
    color: #3d405c;
    font-size: 12px;
    font-weight: 700;
    text-transform: uppercase;
    margin: 20px 0 0;
    padding: 8px 14px 4px;
}

.inbox-wrapper .email-aside .aside-content .aside-nav .nav li {
    width: 100%;
}

.inbox-wrapper .email-aside .aside-content .aside-nav .nav li a {
    display: -webkit-flex;
    display: flex;
    -webkit-align-items: center;
    align-items: center;
    position: relative;
    color: #71748d;
    padding: 7px 14px;
}

.inbox-wrapper .email-aside .aside-content .aside-nav .nav li a:hover {
    text-decoration: none;
    background-color: rgba(114, 124, 245, 0.1);
    color: #727cf5;
}

.inbox-wrapper .email-aside .aside-content .aside-nav .nav li a .icon svg {
    width: 18px;
    margin-right: 10px;
}

.inbox-wrapper .email-aside .aside-content .aside-nav .nav li a .badge {
    margin-left: auto;
}

.inbox-wrapper .email-aside .aside-content .aside-nav .nav li a svg {
    width: 18px;
    margin-right: 10px;
}

.inbox-wrapper .email-aside .aside-content .aside-nav .nav li.active a {
    color: #ff3366;
    background: rgba(255, 51, 102, 0.1);
}

.inbox-wrapper .email-aside .aside-content .aside-nav .nav li.active a .icon {
    color: #ff3366;
}

.inbox-wrapper .email-content .email-inbox-header {
    background-color: transparent;
    padding: 18px 18px;
}

.inbox-wrapper .email-content .email-inbox-header .email-title {
    display: -webkit-flex;
    display: flex;
    -webkit-align-items: center;
    align-items: center;
    font-size: 1rem;
}

.inbox-wrapper .email-content .email-inbox-header .email-title svg {
    width: 20px;
    margin-right: 10px;
    color: #686868;
}

.inbox-wrapper .email-content .email-inbox-header .email-title .new-messages {
    font-size: .875rem;
    color: #686868;
    margin-left: 3px;
}

.inbox-wrapper .email-content .email-inbox-header .input-search .input-group-btn .btn,
.inbox-wrapper .email-content .email-inbox-header .input-search .input-group-btn .fc .fc-button,
.fc .inbox-wrapper .email-content .email-inbox-header .input-search .input-group-btn .fc-button,
.inbox-wrapper .email-content .email-inbox-header .input-search .input-group-btn .swal2-modal .swal2-actions button,
.swal2-modal .swal2-actions .inbox-wrapper .email-content .email-inbox-header .input-search .input-group-btn button,
.inbox-wrapper .email-content .email-inbox-header .input-search .input-group-btn .wizard > .actions a,
.wizard > .actions .inbox-wrapper .email-content .email-inbox-header .input-search .input-group-btn a {
    border-radius: 0;
    padding: 4.5px 10px;
}

.inbox-wrapper .email-content .email-inbox-header .input-search .input-group-btn .btn svg,
.inbox-wrapper .email-content .email-inbox-header .input-search .input-group-btn .fc .fc-button svg,
.fc .inbox-wrapper .email-content .email-inbox-header .input-search .input-group-btn .fc-button svg,
.inbox-wrapper .email-content .email-inbox-header .input-search .input-group-btn .swal2-modal .swal2-actions button svg,
.swal2-modal .swal2-actions .inbox-wrapper .email-content .email-inbox-header .input-search .input-group-btn button svg,
.inbox-wrapper .email-content .email-inbox-header .input-search .input-group-btn .wizard > .actions a svg,
.wizard > .actions .inbox-wrapper .email-content .email-inbox-header .input-search .input-group-btn a svg {
    width: 18px;
}

.inbox-wrapper .email-content .email-filters {
    padding: 20px;
    border-bottom: 1px solid #e8ebf1;
    background-color: transparent;
    width: 100%;
    border-top: 1px solid #e8ebf1;
}

.inbox-wrapper .email-content .email-filters > div {
    display: -webkit-flex;
    display: flex;
    -webkit-align-items: center;
    align-items: center;
}

.inbox-wrapper .email-content .email-filters .email-filters-left .btn-group,
.inbox-wrapper .email-content .email-filters .email-filters-left .fc .fc-toolbar.fc-header-toolbar .fc-left .fc-button-group,
.fc .fc-toolbar.fc-header-toolbar .fc-left .inbox-wrapper .email-content .email-filters .email-filters-left .fc-button-group,
.inbox-wrapper .email-content .email-filters .email-filters-left .fc .fc-toolbar.fc-header-toolbar .fc-right .fc-button-group,
.fc .fc-toolbar.fc-header-toolbar .fc-right .inbox-wrapper .email-content .email-filters .email-filters-left .fc-button-group {
    margin-right: 5px;
}

.inbox-wrapper .email-content .email-filters .email-filters-left input {
    margin-right: 8px;
}

.inbox-wrapper .email-content .email-filters .email-filters-right {
    text-align: right;
}

@media (max-width: 767px) {
    .inbox-wrapper .email-content .email-filters .email-filters-right {
        width: 100%;
        display: flex;
        justify-content: space-between;
    }
}

.inbox-wrapper .email-content .email-filters .email-filters-right .email-pagination-indicator {
    display: inline-block;
    vertical-align: middle;
    margin-right: 13px;
}

.inbox-wrapper .email-content .email-filters .email-filters-right .email-pagination-nav .btn svg,
.inbox-wrapper .email-content .email-filters .email-filters-right .email-pagination-nav .fc .fc-button svg,
.fc .inbox-wrapper .email-content .email-filters .email-filters-right .email-pagination-nav .fc-button svg,
.inbox-wrapper .email-content .email-filters .email-filters-right .email-pagination-nav .swal2-modal .swal2-actions button svg,
.swal2-modal .swal2-actions .inbox-wrapper .email-content .email-filters .email-filters-right .email-pagination-nav button svg,
.inbox-wrapper .email-content .email-filters .email-filters-right .email-pagination-nav .wizard > .actions a svg,
.wizard > .actions .inbox-wrapper .email-content .email-filters .email-filters-right .email-pagination-nav a svg {
    width: 18px;
}

.inbox-wrapper .email-content .email-filters .be-select-all.custom-checkbox {
    display: inline-block;
    vertical-align: middle;
    padding: 0;
    margin: 0 30px 0 0;
}

.inbox-wrapper .email-content .email-list .email-list-item {
    display: -webkit-flex;
    display: flex;
    -webkit-align-items: center;
    align-items: center;
    border-bottom: 1px solid #e8ebf1;
    padding: 10px 20px;
    width: 100%;
    cursor: pointer;
    position: relative;
    font-size: 14px;
    cursor: pointer;
    transition: background .2s ease-in-out;
}

.inbox-wrapper .email-content .email-list .email-list-item:hover {
    background: rgba(114, 124, 245, 0.08);
}

.inbox-wrapper .email-content .email-list .email-list-item:last-child {
    margin-bottom: 5px;
}

.inbox-wrapper .email-content .email-list .email-list-item .email-list-actions {
    width: 40px;
    vertical-align: top;
    display: table-cell;
}

.inbox-wrapper .email-content .email-list .email-list-item .email-list-actions .form-check {
    margin-bottom: 0;
}

.inbox-wrapper .email-content .email-list .email-list-item .email-list-actions .form-check i::before {
    width: 15px;
    height: 15px;
}

.inbox-wrapper .email-content .email-list .email-list-item .email-list-actions .form-check i::after {
    font-size: .8rem;
}

.inbox-wrapper .email-content .email-list .email-list-item .email-list-actions .favorite {
    display: block;
    padding-left: 1px;
    line-height: 15px;
}

.inbox-wrapper .email-content .email-list .email-list-item .email-list-actions .favorite span svg {
    width: 14px;
    color: #686868;
}

.inbox-wrapper .email-content .email-list .email-list-item .email-list-actions .favorite:hover span {
    color: #8d8d8d;
}

.inbox-wrapper .email-content .email-list .email-list-item .email-list-actions .favorite.active span svg {
    color: #fbbc06;
}

.inbox-wrapper .email-content .email-list .email-list-item .email-list-detail {
    display: -webkit-flex;
    display: flex;
    -webkit-justify-content: space-between;
    justify-content: space-between;
    -webkit-flex-grow: 1;
    flex-grow: 1;
    -webkit-flex-wrap: wrap;
    flex-wrap: wrap;
}

.inbox-wrapper .email-content .email-list .email-list-item .email-list-detail .from {
    display: block;
    font-weight: 400;
    margin: 0 0 1px 0;
    color: #000;
}

.inbox-wrapper .email-content .email-list .email-list-item .email-list-detail .msg {
    margin: 0;
    color: #71738d;
    font-size: .8rem;
}

.inbox-wrapper .email-content .email-list .email-list-item .email-list-detail .date {
    color: #000;
}

.inbox-wrapper .email-content .email-list .email-list-item .email-list-detail .date .icon svg {
    width: 14px;
    margin-right: 7px;
    color: #3d405c;
}

.inbox-wrapper .email-content .email-list .email-list-item.email-list-item--unread {
    background-color: rgba(114, 124, 245, 0.09);
}

.inbox-wrapper .email-content .email-list .email-list-item.email-list-item--unread .from {
    color: #000;
    font-weight: 800;
}

.inbox-wrapper .email-content .email-list .email-list-item.email-list-item--unread .msg {
    font-weight: 700;
    color: #686868;
}

.rtl .inbox-wrapper .email-aside .aside-content .aside-header .navbar-toggle .icon {
    position: absolute;
    top: 0;
    left: 0;
}

.rtl .inbox-wrapper .email-aside .aside-content .aside-nav .nav {
    padding-right: 0;
}

.rtl .inbox-wrapper .email-aside .aside-content .aside-nav .nav li a .icon svg {
    margin-right: 0;
    margin-left: 10px;
}

.rtl .inbox-wrapper .email-aside .aside-content .aside-nav .nav li a .badge {
    margin-left: 0;
    margin-right: auto;
}

.rtl .inbox-wrapper .email-aside .aside-content .aside-nav .nav li a svg {
    margin-right: 0;
    margin-left: 10px;
}

.rtl .inbox-wrapper .email-content .email-inbox-header .email-title svg {
    margin-right: 0;
    margin-left: 10px;
}

.rtl .inbox-wrapper .email-content .email-inbox-header .email-title .new-messages {
    margin-left: 0;
    margin-right: 3px;
}

.rtl .inbox-wrapper .email-content .email-filters .email-pagination-indicator {
    margin-right: 0;
    margin-left: 13px;
}

.rtl .inbox-wrapper .email-content .email-list .email-list-item .email-list-detail .date .icon svg {
    margin-right: 0;
    margin-left: 7px;
}

.email-head {
    background-color: transparent;
}

.email-head-subject {
    padding: 25px 25px;
    border-bottom: 1px solid #e8ebf1;
}

@media (max-width: 767px) {
    .email-head-subject {
        padding: 25px 10px;
    }
}

.email-head-subject .title {
    display: block;
    font-size: .99rem;
}

.email-head-subject .title a.active .icon {
    color: #fbbc06;
}

.email-head-subject .title a .icon {
    color: silver;
    margin-right: 6px;
}

.email-head-subject .title a .icon svg {
    width: 18px;
}

.email-head-subject .icons {
    font-size: 14px;
    float: right;
}

.email-head-subject .icons .icon {
    color: #000;
    margin-left: 12px;
}

.email-head-subject .icons .icon svg {
    width: 18px;
}

.email-head-sender {
    padding: 13px 28px;
}

@media (max-width: 767px) {
    .email-head-sender {
        padding: 25px 10px;
    }
}

.email-head-sender .avatar {
    float: left;
    margin-right: 10px;
}

.email-head-sender .date {
    float: right;
    font-size: 12px;
}

.email-head-sender .avatar {
    float: left;
    margin-right: 10px;
}

.email-head-sender .avatar img {
    width: 36px;
}

.email-head-sender .sender > a {
    color: #000;
}

.email-head-sender .sender span {
    margin-right: 5px;
    margin-left: 5px;
}

.email-head-sender .sender .actions {
    display: inline-block;
    position: relative;
}

.email-head-sender .sender .actions .icon {
    color: #686868;
    margin-left: 7px;
}

.email-head-sender .sender .actions .icon svg {
    width: 18px;
}

.email-body {
    background-color: transparent;
    border-top: 1px solid #e8ebf1;
    padding: 30px 20px;
}

@media (max-width: 767px) {
    .email-body {
        padding: 30px 10px;
    }
}

.email-attachments {
    background-color: transparent;
    padding: 25px 28px 5px;
    border-top: 1px solid #e8ebf1;
}

@media (max-width: 767px) {
    .email-attachments {
        padding: 25px 10px 0;
    }
}

.email-attachments .title {
    display: block;
    font-weight: 500;
}

.email-attachments .title span {
    font-weight: 400;
}

.email-attachments ul {
    list-style: none;
    margin: 15px 0 0;
    padding: 0;
}

.email-attachments ul > li {
    margin-bottom: 5px;
}

.email-attachments ul > li:last-child {
    margin-bottom: 0;
}

.email-attachments ul > li a {
    color: #000;
}

.email-attachments ul > li a svg {
    width: 18px;
    color: #686868;
}

.email-attachments ul > li .icon {
    color: #737373;
    margin-right: 2px;
}

.email-attachments ul > li span {
    font-weight: 400;
}

.rtl .email-head-subject .title a .icon {
    margin-right: 0;
    margin-left: 6px;
}

.rtl .email-head-subject .icons .icon {
    margin-left: 0;
    margin-right: 12px;
}

.rtl .email-head-sender .avatar {
    margin-right: 0;
    margin-left: 10px;
}

.rtl .email-head-sender .sender .actions .icon {
    margin-left: 0;
    margin-right: 7px;
}

.email-head-title {
    padding: 15px;
    border-bottom: 1px solid #e8ebf1;
    font-weight: 400;
    color: #3d405c;
    font-size: .99rem;
}

.email-head-title .icon {
    color: #696969;
    margin-right: 12px;
    vertical-align: middle;
    line-height: 31px;
    position: relative;
    top: -1px;
    float: left;
    font-size: 1.538rem;
}

.email-compose-fields {
    background-color: transparent;
    padding: 20px 15px;
}

.email-compose-fields .select2-container--default .select2-selection--multiple .select2-selection__rendered {
    margin: -2px -14px;
}

.email-compose-fields .select2-container--default .select2-selection--multiple .select2-selection__rendered .select2-selection__choice {
    border-radius: 0;
    background: #727cf5;
    color: #ffffff;
    margin-top: 0px;
    padding: 4px 10px;
    font-size: 13px;
    border: 0;
}

.email-compose-fields .select2-container--default .select2-selection--multiple .select2-selection__rendered .select2-selection__choice span {
    color: #ffffff;
}

.email-compose-fields .select2-container--default .select2-selection--multiple .select2-selection__rendered .select2-search {
    line-height: 15px;
}

.form-group.row {
    margin-bottom: 0;
    padding: 12px 0;
}

.form-group.row label {
    white-space: nowrap;
}

.email-compose-fields label {
    padding-top: 6px;
}

.email.editor {
    background-color: transparent;
}

.email.editor .editor-statusbar {
    display: none;
}

.email.action-send {
    padding: 8px 0px 0;
}

.btn-space {
    margin-right: 5px;
    margin-bottom: 5px;
}

.breadcrumb {
    margin: 0;
    background-color: transparent;
}

.rtl .email-compose-fields .select2-container--default .select2-selection--multiple .select2-selection__rendered .select2-selection__choice {
    float: right;
}

.rtl .btn-space {
    margin-right: 0;
    margin-left: 5px;
}
.card {
    box-shadow: 0 0 10px 0 rgba(183, 192, 206, 0.2);
    -webkit-box-shadow: 0 0 10px 0 rgba(183, 192, 206, 0.2);
    -moz-box-shadow: 0 0 10px 0 rgba(183, 192, 206, 0.2);
    -ms-box-shadow: 0 0 10px 0 rgba(183, 192, 206, 0.2);
}
.card {
    position: relative;
    display: flex;
    flex-direction: column;
    min-width: 0;
    word-wrap: break-word;
    background-color: #fff;
    background-clip: border-box;
    border: 1px solid #f2f4f9;
    border-radius: 0.25rem;
}
.badge {
    padding: 6px 5px 3px;
}
.text-white {
    color: #ffffff !important;
}
.font-weight-bold {
    font-weight: 700 !important;
}
.float-right {
    float: right !important;
}
.badge-danger-muted {
    color: #212529;
    background-color: #f77eb9;
}

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

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

.flex-wrap {
    -ms-flex-wrap: wrap!important;
    flex-wrap: wrap!important;
}

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

*, ::after, ::before {
}

svg {
    overflow: hidden;
    vertical-align: middle;
}

.dropdown, .dropleft, .dropright, .dropup {
    position: relative;
}

.dropdown-menu {
    position: absolute;
    top: 100%;
    left: 0;
    z-index: 1000;
    display: none;
    float: left;
    min-width: 10rem;
    padding: .5rem 0;
    margin: .125rem 0 0;
    font-size: 1rem;
    color: #212529;
    text-align: left;
    list-style: none;
    background-color: #fff;
    background-clip: padding-box;
    border: 1px solid rgba(0,0,0,.15);
    border-radius: .25rem;
}

/* End Email Client UI*/

.email-preview iframe {
    border: unset;
    width: 100%;
}

.valid {outline: green auto 1px;}

.modal.geocode-result {
    width: 500px;
    height: 420px;
}

p[index='formatted_address'] {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 70%;
}

.button.red {
    background-color: #900909;
}

.advanced-search .object-select {
    margin: 0px 5px;
}

.modal.bulk-action {
    width: 600px;
    height: 400px;
}

.disabled>*, [disabled]>* {
    color: gray;
}

.content.filters li[filter-id] {
    cursor: default;
}

.content.filters li[filter-id] .fa-plus {
    cursor: pointer;
}

.transactions .topbar.white {
    margin-bottom: 60px;
}

.modal.tag-select {
    height: 300px;
    width: 500px;
}

.modal.edit-customer-name {
    width: 700px;
    height: 500px;
}

.modal.change-password {
    width: 500px;
    height: 250px;
}

.topbar.white.line {
    box-shadow: unset;
    border-bottom: 1px solid #00000012;
}

.topbar.white.line {
    box-shadow: unset;
    border-bottom: 1px solid #00000012;
}

.page[point-set='product-card-topbar'][point='configuration'] {
    overflow: hidden;
}

.flex-h {
    display: flex;
    flex-direction: row;
}

.remote-order .customer {
    margin: auto;
    margin-top: 29px;
    box-shadow: unset;
    width: 78%;
    border: 1px solid #dfdfdf;
    margin-bottom: 20px;
}

.remote-order .transaction-item:first-of-type {margin-top: 150px;}

.customer [category] i.fa.fa-star, .customer [openable] i.fa.fa-star, .customer [category] i.fa.fa-exclamation-triangle, .customer [openable] i.fa.fa-exclamation-triangle {
    font-size: 9px;
}

.customer i.fa {
    color: #5266ff;
    top: 20px;
    left: 20px;
}

.add-transaction-communication {
    width: 750px;
    height: 530px;
}

.object-select[no-change] {
    cursor: default;
}

.object-select[no-change][set] i {
    display: none !important;
}

.object-select[no-change] {
    padding-left: 20px;
}

.card-names .card-name.add-name {
    border: 1px dashed #3b3b3b;
    color:#3b3b3b;
}

.card-names .card-name.add-name:hover {
    cursor:pointer;
}

.card-names.status-left {
    margin-left: 80px;
}

.modal.auto-renew {
    width: 400px;
    height: 200px;
}

.modal.bulk-import {
    width: 1300px;
    height: 700px;
}

.bulk-import td {
    border-right: 1px solid white;
    white-space: nowrap;
    padding: 5px;
    border-collapse: separate;
}

.bulk-import td:first-of-type {
}

.bulk-import tr {
    border: unset;
}

.bulk-import tr:nth-child(odd) {}

.bulk-import tr td, .bulk-import tr th {
    border: 1px solid #e7e7e7;
}

.bulk-import table {
    border-collapse: collapse;
}

.load-throbber.mini {
    position: relative;
    left: unset;
    top: unset;
    width: 30px;
    height: 30px;
    transform: unset;
    font-size: 12px;
}

.mini .throbber {
}

.remote-order .warn {
    background-color: #ffddb7;
}

.bulk-import tr td {
    cursor: pointer;
}

.bulk-import .column-select {}

.bulk-import td.highlight {}

.bulk-import tr[head]:first-of-type {
  position: -webkit-sticky; /* for Safari */
  position: sticky;
  top: 0;
  background-color: white;
  border: 1px solid #898989;
}

.bulk-import ul#columns i.fa.fa-arrow-right {
    color: gainsboro;
    margin-left: 15px;
}

.import-column-drag-ghost .rule-ui-tag{
	display:block !important;
	background-color:white;
}

#columns .rule-ui-tag {
    display: block;
}

p.rule-ui-tag {
    display: none;
}

.bulk-import #columns li.highlight, .bulk-import #dedupe li.highlight {
    background-color: #a4caff;
}

.bulk-import #columns li.highlight i.fa-arrow-right {
    color: white;
}

.modal.edit-campaign {
    width: 600px;
    height: 400px;
}

.transaction-item.medium.not-local-transaction {
    background-color: white;
}

.transaction-item.not-local-transaction .object-header {
    background-color: #ff57221c;
}

.report {
    margin: 21px;
    width: 300px;
    border-radius: 7px;
    position: relative;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    box-shadow: 0 0 4px #0000003d;
    height: 345px;
    position: relative;
}

.report i.fa.fa-chart-pie {
    font-size: 59px;
}

.flex-h {}

.flex-v {
    display: flex;
    flex-direction: column;
}

.modal.configure-report {
    width: 800px;
    height: 500px;
}

.modal.change-inventory {
    width: 500px;
    height: 300px;
}

.modal.full-sale-history {
    width: 50;
    width: 700px;
    height: 400px;
}

.modal.full-sale-history .itemlist {
    width: 80%;
    margin: auto;
    top: 47%;
    transform: translateY(-50%);
}

svg > g > g:last-child { pointer-events: none }

.modal.configure-mailing {
    width: 95%;
    height: 85%;
}

.next.include {
    background-color: #f6963c;
}

.next.exclude {
    background-color: #4e4e4e;
}

.next .fa-external-link-alt {margin: 0px 0px 0px 1px;}

.modal.configure-mailing iframe {
    width: 100%;
    height: 100%;
    border: unset;
    display: block;
}

.customer.ui-list-item li {
    white-space: nowrap;
}

.modal.configure-linkage {
    width: 700px;
    height: 500px;
}

.personal-info li[category]>ul {
    margin-left: 25px;
}

.slider {
    height: 42px;
    width: 410px;
    position: absolute;
    bottom: 30px;
    left: 50%;
    transform: translate(-50%, 0);
    border-radius: 46px;
    background-color: #f9f9f9;
    box-shadow: 0 0 6px 0 #0000004d;
    border: 1px solid #a9a9a9;
    overflow: hidden;
}

.slider .circle {
    width: 40px;
    height: 40px;
    border-radius: 100%;
    background-color: #ffffff;
    box-shadow: 0 0 8px 0 #00000033;
    border: 1px solid #dedede;
    z-index: 26;
    position: absolute;
}

.block {}

.slider .block {
    height: 100%;
    width: 300px;
    background-color: #f9f9f9;
    position: absolute;
    top: 0;
    right: 0;
}

.modal.manage-object-mirroring {
    width: 600px;
    height: 400px;
}

.modal.add-object-mirror {
    height: 400px;
    width: 700px;
}

.modal.add-object-mirroring {
    width: 550px;
    height: 320px;
}

.customer-list .customer.ui-list-item .customer-body-section, .small.customer.ui-list-item .customer-body-section {
    max-height: 130px;
    min-height: 130px;
}

i.fa.fa-send {
    transform: translate(-52%, -46%);
}

.modal.email-deliverability {
    width: 600px;
    height: 400px;
}

.graph p.graph-title {
    font-weight: normal;
    display: flex;
    align-items: center;
}

.graph i.fa.fa-info-circle {
    font-size: 13px;
    margin-left: 10px;
    transform: translate(0, 0px);
}

.graph .graph-body {
    padding: 20px;
    padding-bottom: 44px;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    height: -webkit-fill-available;
}

.graph-container {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
}

.graph .graph-header-box {
    height: 50px;
}

.graph p.graph-aggregate {
    font-size: 21px;
}

.graph .comparison-tag-box {
    color: #4f566b;
    background-color: #e3e8ee;
    border-radius: 6px;
    margin-left: 10px;
    padding-left: 10px;
    font-size: 13px;
    display: flex;
    align-items: center;
    padding-top: 0px;
    width: fit-content;
    padding-right: 10px;
    justify-content: center;
}

.comparison-tag-box .tag {
    height: fit-content;
}

.graph .graph-point {
    font-size: 13px;
    margin-top: 5px;
}

.load-throbber .load-text {
    position: absolute;
    white-space: nowrap;
    left: 50%;
    transform: translate(-50%, 21px);
    font-size: 21px;
}

.inline-throbber {
    display: flex;
    flex-direction: row;
    align-items: center;
    margin: auto;
}

.load-throbber.inline-throbber .load-text {
    left: 100%;
    top: 50%;
    transform: translate(30px, -50%);
}

.inline-throbber {}

.relative.load-throbber {
    position: relative;
    transform: unset;
    top: unset;
    left: unset;
}

.inline-throbber .load-text {
    margin-left: 21px;
}

.graph-ui-item {
    width: 100%;
    height: 100%;
    margin-bottom: 5px;
}

.graph-dashboard {
    margin: 30px 30px;
}

.dashboard-head-box {
    margin-bottom: 40px;
    padding-bottom: 10px;
    border-bottom: 1px solid #0000003d;
}

.dashboard-head-box h2 {
    margin-left: unset;
    font-weight: lighter;
    font-size: 26px;
    margin-top: unset;
}

.left-range-select {
    height: 30px;
    border-radius: 5px;
    border: 1px solid #d6d6d6;
    position: relative;
    flex-shrink: 0;
    flex-grow: 0;
}

button {
    appearance: none;
    border: unset;
    background-color: unset;
    font-size: 13px;
    padding: 5px;
    padding-left: 15px;
    color: #3b3b3b;
    font-weight: lighter;
    padding-right: 15px;
    transition: all 200ms;
    cursor: pointer;
    position: relative;
    height: 30px;
		margin-left:unset;
		margin-right:unset;
}

.graph-dashboard .controls-bar.flex-h {
    font-size: 15px;
    align-items: center;
}

.button i.fa.fa-angle-down {
    margin-right: 5px;
}

.controls-bar button i.fa.fa-angle-down {
    margin-left: 5px;
    transform: translate(0px, 1px);
}

.left-range-select button:not(:last-child) {margin-right: 1px;}


.button-bar button:first-child {
    border-top-left-radius: 4px;
    border-bottom-left-radius: 4px;
}

.button-bar button:last-child {
    border-top-right-radius: 4px;
    border-bottom-right-radius: 4px;
}

.button-bar button:after, .button-bar button:before{
    position: absolute;
    top: 0;
    bottom: 0;
    z-index: 1;
    display: block;
    width: 1px;
    background: #0000000a;
    content: "";
}

.button-bar button:first-child:before, .button-bar button:last-child:after{
    display:none;
}


.button-bar button:after {
    right: -1px;
}

.button-bar button:before {
    left: -1px;
}

i.fa.fa-calendar {}

button i.fa.fa-calendar {
    margin-right: 10px;
}

button:focus {
    box-shadow: rgb(0 0 0 / 0%) 0px 0px 0px 0px, rgb(58 151 212 / 36%) 0px 0px 0px 4px, rgb(0 0 0 / 12%) 0px 1px 1px 0px, rgb(60 66 87 / 16%) 0px 0px 0px 1px, rgb(0 0 0 / 0%) 0px 0px 0px 0px, rgb(0 0 0 / 0%) 0px 0px 0px 0px, rgb(60 66 87 / 8%) 0px 2px 5px 0px;
    z-index: 2;
}

.button-bar select {
    appearance: none;
    position: relative;
    z-index: 1;
    -ms-flex: 0 1 auto;
    flex: 0 1 auto;
    margin: 0;
    text-decoration: none;
    vertical-align: middle;
    word-break: normal;
    background: transparent;
    border: 0;
    outline: 0;
    transition: color .24s;
    -webkit-appearance: none;
    appearance: none;
    -webkit-user-select: auto;
    -ms-user-select: auto;
    user-select: auto;
    padding-left: 20px;
    padding-right: 35px;
    height: 30px;
}

.button-bar {
    display: flex;
    flex-direction: row;
    align-items: center;
    height: fit-content;
    height: -moz-fit-content;
    border-radius: 5px;
    border: 1px solid #d6d6d6;
    position: relative;
    flex-shrink: 0;
    flex-grow: 0;
    background-color: white;
color: #3b3b3b !important;}

.button-bar .fa.fa-arrows-alt-v {
    margin-right: 10px;
    position: absolute;
    right: 5px;
}

.button-bar button {}

.button-bar button i.fa.fa-cog {
  margin-right: 5px;
}

ul.custom-range-ul li {
    padding: 6px;
    padding-left: 40px;
    padding-right: 30px;
}

ul.custom-range-ul li:hover {
    background-color: #a2b7f41c;
    outline: unset;
}

ul.custom-range-ul {
    width: calc(100% + 30px);
    left: 0px;
    transform: translate(-15px);
    overflow: hidden;
}

ul.custom-range-ul li {
    border: unset;
}

.custom-range-ul li.selected .fa.fa-check {
    font-size: 10px;
    position: absolute;
    left: -7px;
}

ul.custom-range-ul li.selected {
    color: #7083e7;
}

.flex-h.comparison-tag-box.red {
    color: rgb(152, 55, 5);
    background-color: #f8e5b9;
}

p.graph-aggregate[compared-aggregate] {
    text-align: right;
}

p.graph-point[compared-point] {
    text-align: right;
}

.graph .comparison-tag-box.green {
    color: rgb(14, 98, 69);
    background-color: rgb(203, 244, 201);
}

@media screen and (max-width: 1050px) {
  .advanced-search{
    width:90%;
  }
 }

 @media screen and (max-height: 800px) {
    .advanced-search{
      height:90%;
    }
 }

 .customer.ui-list-item .customer-body-selection {
     overflow: hidden !important;
 }

 .customer.ui-list-item .customer-body-section {
 }


.customer-list .customer.ui-list-item.group .customer-body-section {
    overflow: scroll !important;
}

.extra {}

.graph .action.extra {
    position: absolute;
    color: #4e8cff;
    bottom: -6px;
    right: 12px;
    transform: translate(0, -100%);
    font-size: 14px;
    display: none;
}

.graph .action.extra .fa {
    margin-left: 5px;
}

.graph:hover .action.extra {
    display: block;
}

.graph:hover .action.extra:hover {
    color: #1f407b;
}

.graph .endpoint-labels {
    width: 100%;
    height: 10px;
    display: flex;
    justify-content: space-between;
    margin-top: -8px;
    margin-right: 5px;
}

.endpoint-labels p {
    font-size: 12px;
    margin-left: 3px;
    margin-right: 3px;
}

.customer-card.flagged .card-name *:not(button *, button) {
}

.credential-identity {
    width: 10px;
    height: 50px;
    border: 1px solid black;
    margin-left: 15px;
    cursor: pointer;
}

.identity.flex-h {
    margin-top: 25px;
    margin-left: 30px;
}

.identity.flex-h.status-left {
    margin-left: 80px;
}

.credential-identity:hover i {
    transform: scale(1.3);
    cursor: pointer;
    color: #3786ff;
}

.credential-identity i {
    transition: all 200ms;
}

.credential-identity:hover {
    background-color: #ffffff;
}

.modal.customer-credential-menu {
    width: 600px;
    height: 400px;
}

.button-bar.large>* {
    height: 41px;
    padding-left: 20px;
    padding-right: 20px;
}

.button-bar.large.finish {
    width: max-content;
    left: 50%;
    transform: translate(-50%, -5%);
    bottom: 30px;
    position: absolute;
}

.button-bar.large.finish {}

.modal.edit-automation {
    width: 95%;
    height: 90%;
    min-width: 800px;
    min-height: 500px;
}

.edit-automation .fa-ellipsis-h {
    margin-left: 30px;
}


.input-connector:not([connected]), .output-connector:not([connected]) {
    background-color: #00000003;
    border: 1px dashed #000000c7;
}

.input-connector[connected], .output-connector[connected] {
    background-color: #53c53dba;
    border: 1px dashed #000000c7;
}

.output-connector, .input-connector {
    width: 20px;
    height: 20px;
    border-radius: 25px;
    transition: all 200ms;
    margin-right: 15px;
    position: absolute;
    left: -32px;
    top: 50%;
    transform: translate(0, -50%);
    text-align: center;
}


.output-connector:not([connected]):not(.no-connect):hover, .input-connector:not([connected]):not(.no-connect):hover {

    cursor: crosshair;
    border: 1px solid #000000c7;
}

.edit-automation span.object-select {
    margin-left: auto;
}

.edit-automation canvas {
    position: absolute;
    z-index: 2;
    pointer-events: none;
}


.modal.select-action {
    width: 600px;
    height: 400px;
}

.output-connector::before, .input-connector::before {
    top: 4px;
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -49%);
    font-size: 12px;
}

.output-connector::before {
   transform: translate(-50%, -45%);
}

.edit-automation li[category]>ul {
    margin-left: 40px;
    width: calc(100% - 41px);
}

.edit-automation li[category]>ul>li:last-of-type {
    border-bottom: 1px solid #00000008;
}

.input-connector.no-connect {opacity: .2;}

.input-connector.no-connect:hover {}

.automation-action-bar {
    margin-right: 15px;
    cursor: grab;
    left: 15px;
    position: absolute;
}

.edit-automation [category] p:first-child {
    margin-left: 15px;
}

.modal.purchase-number {
    width: 1000px;
    height: 600px;
}

.button-bar.finish {
    position: absolute;
    margin: auto;
    width: fit-content;
    bottom: 50px;
    left: 50%;
    transform: translate(-50%, 0);
}
.configure-mailing textarea {
    min-height:200px;
    max-height:300px;
    resize:none;
}

.edit-phone.modal {
    width: 700px;
    height: 450px;
}

.communication-label {
    font-size: 10px;
    margin-bottom: 5px;
}

li.communication {
    display: flex;
}

.communication-footer {
    font-size: 10px;
    margin-top: 4px;
}

p.communication-recipients:hover, p.communication-attachments:hover {
    color: #3b8ff8;
}

.status-icon .load-throbber.relative {
    height: 30px;
    width: 30px;
    font-size: 16px;
}

.status-icon i.fa:hover {
    transform: scale(1.3);
    color: #3b3b3b !important;
}

.status-icon i.fa {
    transition: all 100ms;
}

.queue-select .transaction-item:first-of-type, .view-transaction .transaction-item:first-of-type {
    margin-top: 20px;
    margin-bottom: 50px;
}

ul[list][embedded-list] li {
    padding-left: 0px;
    padding-right: 0px;
}

.object-select[set][disabled] span {
    color: white;
}

.object-select[set][disabled]:hover {
    background-color: #4caf50;
    border: 1px dashed #4caf50;
}

.object-select[set][disabled] .fa-ban {}

.advanced-search.modal.fullscreen {
    width: 95%;
    height: 95%;
}

.advanced-search.modal.tall {
    height: 101%;
}

.personal-info li[flagged], .customer-info.notes li[flagged], .object-container li[flagged] {
    background-color: #ff8800;
    color: white !important;
}

.personal-info li[flagged] .fa:not(button .fa), .object-container li[flagged] .fa:not(button .fa) {
    color: white !important;
}

.object-select[flagged] {
    background-color: #ff9720;
    border: 1px dashed #ff9720;
}

.object-select[flagged]:not([no-change]):hover {
    background-color: #ffaf54;
    border: 1px solid #ffaf54;
}

.object-select[error] {
    background-color: #fb6f6f;
    border: 1px dashed #fb6f6f;
}

.object-select[error]:not([no-change]):hover {
    background-color: #ff8585;
    border: 1px solid #ff8585;
}

.remote-order .object-select {
    max-width: 300px;
}

.flex-v.special {
}

.personal-info .flex-v.special, .object-container .flex-v.special {
    position: absolute;
    left: 14px;
    text-align: center;
}

.personal-info .flex-v.special>*, .object-container .flex-v.special>* {
    margin-top: 5px;
    margin-bottom: 5px;
}

.personal-info .flex-v.special .bad-address {
    color: #c32929;
    font-size: 10px;
}

.customer.flagged i.fa-star {
    color: #3b3b3b;
}

.customer [category] .flex-v.special {
    position: absolute;
    left: 12px;
    text-align: center;
}

.customer.flagged i.fa.fa-exclamation-triangle {
    color: #c32929;
}

.customer [category] .flex-v.special>* {
    margin-top: 2px;
    margin-bottom: 2px;
}

.invoice iframe {
    width: 100%;
    height: 100%;
    border: unset;
}

ul li[icon-button] {
    width: 100px;
    height: 120px;
    border: 1px;
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    justify-content: space-around;
    margin: 10px;
    box-shadow: 0 0 3px 0 #0000002e;
    border-radius: 2px;
    cursor: pointer;
    transition: all 100ms;
}

ul li[icon-button] .fa {
    font-size: 30px;
}

li[icon-button]:hover {
    background-color: #68a4fd;
    color: white;
}

.transaction-item:first-of-type {
}

.remote-order .transaction-item:last-of-type {
    margin-bottom: 250px;
}

.modal.view-remote-order {
    width: 1000px;
    height: 600px;
}

.modal.payment-methods {
    width: 700px;
}

ul[embedded-list]>li {
    height: 40px;
}

.view-transaction .transaction-item {
    width: 600px;
}

.modal.setup-integration {
    width: 1100px;
    height: 700px;
}

.modal.integration-type-select {
    width: 800px;
    height: 500px;
}

.sidebar.path-vertical i.fa.fa-arrow-left.back {
    top: 22px;
    left: 25px;
}

.has-back-arrow.sidebar center h2 {
    width: 90%;
    margin-left: 10%;
}

.modal.oauth-window {
    width: 600px;
    height: 300px;
    padding: 20px;
}

.oauth-window h3 {}

.oauth-window ul {
    margin-top: 30px;
}

.oauth-window .fa-check {
    margin-right: 7px;
    padding-top: 7px;
    padding-bottom: 7px;
}

.customer.ui-list-item.individual.small.empty {
    filter: brightness(.6) blur(1px) !important;
    cursor: default !important;
}

.customer.ui-list-item.empty .customer-header, .campaign.ui-list-item.empty .campaign-header, .large-object.empty .object-header {
    cursor: default;
}

.customer.empty .assign {position: absolute;width: 100%;margin-top: 30px;}

.assign {}

.gift-giver-assign {
    position: absolute;
    top: 135px;
    left: 50%;
    transform: translateX(-50%);
    z-index: 3;
}

.customer.highlight-selected.flagged {}

.customer.highlight-selected.flagged .customer-header {
    background: rgb(128,46,240);
    background: linear-gradient(34deg, rgba(128,46,240,1) 0%, rgba(255,136,0,1) 100%);
}

.customer-left-side {
    width: 400px !important;
    border-right: 1px solid #d8d8d8;
    flex-shrink: 0;
}

.object-container .object-container-header {
    height: 45px;
    background-color: #f4f4f4b5;
    align-items: center;
    justify-content: space-between;
    border-bottom: 1px solid #e2e2e2;
}

.object-container {
    width: 100%;
    border-bottom: 1px solid #0000000f;
}

.customer-left-side {}

.alerts-bar {
    height: 50px;
}

.object-container:last-of-type {
    margin-bottom: 100px;
}

.flex-v.status-bar {
    height: 50px;
}

.flex-v.customer-left-hug {
    position: relative;
    box-shadow: inset 0 0 4px 0 #0000003b;
    width: 45px;
}

.status-item {
    color: white;
    width: 45px;
    height: 45px;
    transition: all 200ms;
    cursor: pointer;
}

.status-item>* {
    margin: auto;
}

.status-item.flag {
    background-color: #ff8800;
}

.status-item.flag:hover {background-color: #c26801;}

.customer-top-hug {
    background-color: white;
    border-bottom: 1px dashed #cacaca;
    height: 45px;
}

.status-item.grouped {
    background-color: #3e1874;
}

.status-item.duplicate {
    background-color: #aa0000;
}

.status-item.delete {
    background-color: #252525;
}

.status-item.flex.merge {
    background-color: #2359f0;
}

.status-item.history {
    background-color: #00805c;
}

.status-item:hover {
    filter: saturate(1.3);
}

.flex-h.hug-actions>* {
    border-right: unset;
    border-left: 1px solid white;
}

.object-container.names .object-container-header {
}

.flex-h.midway-tile {
}

.flex-v.midway-tile {
    min-width: 550px;
    flex-grow: 1;
    border-right: 1px solid #d8d8d8;
}

.customer-card .flex-h.right-tile {
    height: 100%;
    flex-grow: 1;
}

.object-container.transactions {padding-bottom: 0px;margin-bottom: 0px;}

.customer-top-hug {
    background-color: white;
}

.object-header .listing {
    max-width: 63%;
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
}

.object-container-header.superior-header {
    background-color: #fdfdfd;
}

.object-container.superior {
    height: 45px;
}

.itemlist.multiline {height: fit-content;min-height: 200px;overflow-y: scroll;max-height: 400px;}

.itemlist.multiline .contents {
    position: relative;
    flex-wrap: wrap;
    overflow-y: scroll;
    justify-content: center;
    margin-top: 10px;
}

.status-item.dedupe {
    background-color: #ff8d35;
}

.object-container.history .itemlist.multiline {
    width: 100%;
    border-radius: 0;
}

.status-item.flex.inbox {
    background-color: #438eb6;
}

.flex-left-sidebar {
    width: 400px;
    flex-shrink: 0;
    border-right: 1px solid #d8d8d8;
}

ul[list] li[selectable][selected] {
    background-color: #cce2ff;
}

ul[list] li[selectable][selected]::after {
    font-family: "Font Awesome 5 Free";
    content: "\f105";
    font-weight: 800;
    font-style: normal;
    font-variant: normal;
    text-rendering: auto;
    line-height: 1;
}
.button-bar.small button {padding: 3px;padding-right: 12px;padding-left: 13px;height: 27px;}

.default-tag {margin-left: 15px;background-color: #c2e2ff;padding: 3px 11px;border-radius: 4px;color: #0e83ec;}

.graph.minified {border: unset;padding: unset;height: 70px;width: 250px;}

.graph.minified .graph-body {padding: unset;}

.modal.preview-document {width: 95%;height: 80%;;}

.modal.select-transaction {width: 600px;;height: 600px;}

.preview-page-body {background-color: white;margin: 50px;padding: .5in;margin-top: 25px;border: unset;width: calc(100% - 100px - 1in);}

.preview-page-header {background-color: white;margin: 50px;padding: .2in;margin-bottom: 0px;padding-left: 0.5in;}

.attachment {background-color: white;padding: 20px;position: relative;margin-right: 15px;flex-grow: 0;flex-shrink: 0;margin-bottom: 15px;}

.attachment p {text-align: center;margin-bottom: 20px;margin-top: 15px;}

.attachment i.fa.fa-file-pdf {position: absolute;left: 10px;top: 10px;font-size: 15px;color: #00000061;}

.button-bar.bottom {position: absolute;left: 50%;transform: translateX(-50%);bottom: 30px;}

table {width: 100%;}

table td, table th {padding: 2px 10px 2px 10px;}

table tr:nth-child(odd) {}

table {border-collapse: collapse;}

table th {text-align: left;}

table td, table th {font-weight: lighter;border: 1px solid #c9c9c9;}

table th {font-weight: 400;color: black;}

.modal.select-advanced-search {width: 800px;height: 500px;}

.loop-access .output-connector {position: relative;left: unset;margin: unset;transform: unset;margin-left: 25px;}

.loop-access {display: flex;align-items: center;outline: 1px solid #e5e5e5;outline-offset: 7px;padding: 0px 12px;margin-left: 40px;}

.input-output .input-connector {top: 28%;}

.input-output .output-connector {top: 72%;}

.category.input-output {min-height: 40px;}

button.select.disabled {box-shadow: unset;}

button.select.disabled:hover {cursor: default;box-shadow: unset;}

/* CSS Document */

*{
	--main-blue: #1473ee;
}

*.demon-gradient{
	background: rgb(72, 136, 255);
	background: linear-gradient(45deg, rgb(72, 146, 255) 0%, rgb(58, 74, 255) 100%);
}

@media screen and (max-width: 865px){
	.topbar .monitor-cluster{
        display:none !important;
    }
}

@media screen and (max-width: 1300px){
   .modal.flag-select.queue-select {
        width: 92%;
   }
}

@media screen and (max-width: 1100px){
   .modal.create-transaction {
        width: 92%;
   }
}

.finish-item:last-of-type {
    border-bottom: unset;
}

.search-sidebar.right {
    transform: unset !important;
}

i.mobile-search.fa.fa-search {
    display:none;
}


body {
	background-color:white !important;
	color:#3b3b3b;
	font-family: 'Montserrat', Helvetica, sans-serif;
}

input:not([type='radio']) {
    border-radius: 3px;
    border: none;
    box-shadow: 0 0 2px #00000073;
    width: 160px;
    padding-top: 5px;
    padding-bottom: 5px;
    padding-left: 20px;
    -webkit-appearance: none;
}

.button {
    white-space: nowrap;
    cursor: pointer;
    width: auto;
    width: -moz-fit-content;
    height: fit-content;
    background-color: var(--main-blue);
    color: white;
    border-radius: 5px;
    text-align: center;
    transition: all 100ms;
    padding: 0.5em 2em;
    display: flex;
    align-items: center;
    text-align: center;
}

.header {
    text-align: center;
    padding-top: 18px;
    font-weight: bold;
    color: #494949;
    display: flex;
    justify-content: center;
}

.load-throbber {
    left: 50%;
    top: 44%;
    transform: translateX(-50%) translateY(-50%);
    position: fixed;
    z-index: 30000;
    font-size: 26px;
    height: 60px;
    width: 60px;
}

.throbber {
    height: calc(100% - .4em);
    width: calc(100% - .4em);
    background-color: transparent;
    border-radius: 50%;
    border: .2em solid #ffffff00;
    border-top: .2em solid #303030;
    transition:100ms ease-in-out;
    animation: spin .7s ease-in-out infinite;
    position: relative;
    margin-top: 0em;
}

@-webkit-keyframes spin {
  0% { -webkit-transform: rotate(0deg); border-size:8px; }
  100% { -webkit-transform: rotate(360deg); }
}

@keyframes spin {
  0% { transform: rotate(0deg); }
  100% { transform: rotate(360deg); }
}


.login {
    width: 400px;
    height: 300px;
    left: 50%;
    top: 40%;
    position: absolute;
    transform: translate(-50%,-50%);
    box-shadow: 0px 1px 7px #00000085;
    border-radius: 3px;
    overflow: hidden;
}


.login__header-bar {
    width: 100%;
    height: 40px;
    background-color: var(--main-blue);
    position:relative;
    z-index: 2;
}

.login__header-bar__header {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    padding-left: 30px;
    color: white;
    font-weight: bold;
}

.login__header-bar .reset {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    right: 30px;
    color: white;
    font-size: 10px;
    cursor: pointer;
    user-select: none; -webkit-user-select: none;
}

form.login__login-form {
    width: auto;
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    top: 30%;
}

form input {
    display: block;
    margin-top: 10px;
    width: 200px;
    top:31%;
}

.login__submit-button {
    bottom: 40px;
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    border-radius: 5px;
    text-align: center;
    cursor: pointer;
}

.topbar {
    width: 100%;
    transition: all 300ms;
    height: 50px;
    background-color: var(--main-blue);
    top: 0px;
    left: 0px;
    position: relative;
    z-index: 4;
    box-shadow: 0 0 5px #0000007a;
    display: flex;
    align-items: center;
    color: white;
}

.item.logout {
    float: right;
    margin-right: 30px;
}

.item.system {
    float: right;
    margin-right: 50px;
}

.topbar.main-topbar .item.search, .topbar.main-topbar>*:nth-child(3) {
}

.topbar .item, .detail-down .item, .topbar .display-item {
    color: white;
    font-size: 17px;
    font-weight: 100;
    position: relative;
    cursor: pointer;
    transition: all 200ms;
    transform: translateY(-6%);
    padding: 5px 15px 5px 15px;
    margin-top: 2px;
}

.user-detail {
    position: relative;
    color: white;
    font-weight: 100;
    font-size: 17px;
    cursor: pointer;
    width: fit-content;
    text-align: center;
    z-index: 2;
    user-select: none; -webkit-user-select: none;
    margin-right: 30px;
}

.threebar{
	display:none;
}

.detail-down {
    position: absolute;
    right: 10px;
    top: 50px;
    height: auto;
    width: 190px;
    background-color: rgb(66, 81, 255);
    box-shadow: 0px 1px 5px #0000007a;
    border-radius: 2px;
    z-index: 3;
    display: flex;
    flex-direction: column;
}

.detail-down .item {
    text-align: center;
    width: auto;
    margin: unset !important;
    top: unset;
    margin-top: 5px !important;
    font-size: 16px;
    padding-bottom: 15px;
    transform: unset;
}

.detail-down .item:first-of-type {margin-top: 15px !important;}

.detail-down .item:last-of-type {
}

.topbar .monitor-cluster {
    display: flex;
    overflow: visible;
    margin-left: auto;
}

.topbar.main-topbar .monitor-cluster {margin-left: auto;margin-right: 30px;padding-left: 30px;}

.topbar .monitor-item {
    width: auto;
    background-color: white;
    height: 30px;
    border-radius: 3px;
    cursor: pointer;
    display: inline-block;
    margin-right: 8px;
    position: relative;
    box-shadow: 0 0 3px #00000029;
    overflow: hidden;
    white-space: nowrap;
    flex-shrink: 0;
}

.topbar .monitor-item .fa {
    top: 50%;
    transform: translateY(-50%);
    position: absolute;
    margin-left: 6px;
    font-size: 13px;
}

.monitor-item .count {
    text-align: right;
    top: 50%;
    transform: translateY(-50%);
    position: relative;
    padding-left: 29px;
    padding-right: 8px;
    color: #3b3b3b;
}

.sidebar {
    position: absolute;
    left: 0px;
    width: 250px;
    transition: all 300ms;
    height: calc(100%);
    box-shadow: 2px -1px 6px #00000030;
    z-index: 3;
    background-color: white;
    overflow-y: scroll;
display: flex;flex-direction: column;}

.sidebar .item {
    text-align: left;
    padding-top: 10px;
    padding-left: 20px;
    cursor: pointer;
    padding-bottom: 10px;
    position: relative;
    transition: all 100ms;
}

.sidebar .item:nth-child(2) {
    margin-top: 27px;
}

.sidebar .item:hover {
    background-color: #e9e9e9;
}

.sidebar .item.open {
    background-color: #56a6fd;
    color: white;
}

.sidebar .item i.fa.fa-angle-right {
    opacity: 0;
    transition: opacity 100ms;
    right: 8px;
    position: absolute;
    top: 50%;
    color: white;
    transform: translateY(-50%);
}

.sidebar .item.open i.fa-angle-right {
    opacity: 1;
}

body>.management, body .account-info-data{
    width: 100%;
    position: absolute;
    top: 50px;
    height: calc(100% - 50px);
    overflow-y: scroll;
    overflow-x: hidden;
}


.sidebar-page .header {
    font-size: 17px;
}

.user-list {
    transform: translateX(-50%);
    position: absolute;
    left: 50%;
    width: fit-content;
    margin-top: 30px;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
}

.user-list .user {
    background-color: #ffffff;
    width: 200px;
    height: 100px;
    color: #3b3b3b;
    position: relative;
    margin: 10px;
    box-shadow: 0 0 5px #0000006b;
    border-radius: 6px;
}

.user-list .user i.fa.fa-user {
    display: inline-block;
    margin-right: 2px;
    margin-left: 2px;
}

.user-list .user .username {
    display: inline-block;
    font-size: 13px;
    margin-right: 0px;
    margin-left: 0px;
}

.user-list .user .mid {
    text-align: center;
    top: 37%;
    transform: translateY(-50%);
    position: absolute;
    width: 100%;
}

.user-list .user .actions {
    position: absolute;
    bottom: 20px;
    left: 50%;
    transform: translateX(-50%);
}

.user-list .user .actions>* {
    margin-left: 10px;
    margin-right: 10px;
    cursor: pointer;
}

.user-list .admin,.user-list .pending {
    right: 11px;
    position: absolute;
    top: 5px;
    font-size: 10px;
}

.add:not(button) {
    display: block;
    position: relative;
    left: 12%;
    cursor: pointer;
    position: relative;
    width: fit-content;
    width: -moz-fit-content;
}

.add:not(button) * {
    margin-left: 5px;
    margin-right: 5px;
}

.darken {
    width: 125%;
    height: 100%;
    position: fixed;
    top: 0px;
    left: 0px;
    z-index: 4;
    background-color: #0000005e;
}

.new-user, .new-mailmerge, .new-backing {
    position: fixed;
    left: 50%;
    top: 50%;
    transform: translate(-50%,-50%);
    width: 500px;
    height: 310px;
    background-color: white;
    overflow: hidden;
    border-radius: 3px;
}

.content {
    width: 100%;
    height: 100%;
    transition: all 400ms;
    position: absolute;
    overflow-y: scroll;
    overflow-x: hidden;
    top: 0px;
    left: 0px;
    transform: translate(0,0);
}

.content.left {
    transform: translate(-100%);
}

.content.right {
    transform: translateX(100%);
}

.management .create.button {
    bottom: 39px;
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
}

.new-user input.username {
    width: 200px;
    left: 50%;
    position: absolute;
    transform: translateX(-50%);
    margin-top: 55px;
}

.new-user input.creation {
    width: 200px;
    position: relative;
    display: inline-block;
    position: relative;
    left: unset;
    margin-top: unset;
}

input[type="checkbox"] {
    border: none;
    box-shadow: none;
    width: auto;
    -webkit-appearance: checkbox;
}

.admin-select {
    left: 50%;
    transform: translateX(-50%);
    top: 135px;
    width: 150px;
}

.user-list .pending {
    left: 11px;
}

.new-user div.creation {
    margin-top: 96px;
    position: absolute;
    left: 50%;
    white-space: nowrap;
    transform: translateX(-50%);
}

.new-user .creation * {
}

.new-user .creation .fa-clipboard {
    cursor: pointer;
    position: absolute;
    margin-left: 12px;
    margin-top: 2px;
}

.monitor-cluster .monitor-extension {
    position: absolute;
    width: 200px;
    height: 106px;
    background-color: #446aff;
    left: 50%;
    transform: translateX(-50%);
    top: 49px;
    box-shadow: 0 0 10px #00000052;
    border-radius: 4px;
    cursor: default;
}

.monitor-cluster .monitor-extension::after {content: "";width: 18px;height: 18px;position: absolute;top: -5px;left: 50%;transform: translateX(-50%) rotate(45deg);background-color: #446aff;z-index: -1;}

.monitor-extension .active-series-item {
    color: white;
    text-align: center;
    margin-top: 10px;
    position: absolute;
    width: calc(100% - 67px);
    right: 0px;
    height: 100%;
}

.left-image,.right-info {
    display: inline-block;
    position: absolute;
}

.right-info {
    position: absolute;
    left: 0px;
    margin-top: 0px;
    text-align: center;
    width: 100%;
    font-size: 5px;
    height: 35px;
    align-items: center;
    display: flex;
    justify-content: center;
}

img.left-series-item-img {
    height: 86px;
    margin-top: 9px;
    border-radius: 3px;
    margin-left: 13px;
    object-fit: fill;
    border-radius: 4px;
    overflow: hidden;
}

.monitor-extension .right-info .series-item {
    color: white;
    margin-top: 1px;
    font-size: 12px;
    font-weight: 100;
    text-align: center;
    margin-left: 5px;
    margin-right: 5px;
}

.monitor-extension .button.manage-series-item {
    font-size: 13px;
    height: 17px;
    width: 96px;
    background-color: white;
    color: black;
    bottom: 22px;
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
}

.sidebar-page .list-container, .new-mailing .list-container, .letter-selector .list-container, .content.printing .list-container {
    width: 80%;
    left: 10%;
    display: flex;
    position: absolute;
    margin-top: 60px;
    justify-content: center;
    flex-wrap: wrap;
}

*:not(.letter-viewer)>.letter {
    position: relative;
    width: 150px;
    height: 200px;
    background-color: white;
    border-radius: 4px;
    color: #3b3b3b;
    margin-right: 20px;
    margin-left: 20px;
    margin-bottom: 40px;
    box-shadow: 0 0 7px #0000004a;
}

.letter>i.fa {
    font-size: 40px;
    left: 50%;
    position: absolute;
    transform: translateX(-50%);
    top: 30%;
}

.letter .header {
    font-size: 10px;
    font-weight: lighter;
    margin: 0px 5px;
}

.letter .actions {
    white-space: nowrap;
    position: absolute;
    bottom: 30px;
    left: 50%;
    transform: translateX(-50%);
}

.letter .actions * {
    margin-left: 10px;
    margin-right: 10px;
    cursor: pointer;
}

.letter .letter-id {
    position: absolute;
    width: 100%;
    text-align: center;
    top: 54%;
    font-size: 10px;
}

.sidebar.left, .search-sidebar.left, .history-sidebar.left {
    transform: translateX(-100%);
}

.search-sidebar,.history-sidebar {
    transition:all 200ms;
    width: 250px;
    height: calc(100%);
    position: absolute;
    left: 0px;
    background-color: white;
    box-shadow: 2px -1px 6px #00000030;
    overflow: scroll;
    z-index: 2;
    display: flex;
    flex-direction: column;
}

.primary-info input {
    position: relative;
    margin: auto;
    width: 190px;
}

.primary-info .info-box {
    margin-top: 9px;
    position: relative;
    height: 22px;
    display: flex;
}

.primary-info .info-box:first-of-type {
}

.search-sidebar .primary-info {
    margin-top: 3px;
    margin-bottom: 20px;
}

.search-sidebar .info-box.separator {
    margin-top: 30px;
}

body>.customer-list,body>.customer-card {
    left: 250px;
    position: absolute;
    top: 50px;
    width: calc(100% - 250px);
    height: calc(100% - 50px);
    z-index: -2;
    transform: rotate(0deg);
    overflow-x: hidden;
}

.customer-list .list {
    width: 90%;
    margin-top: 36px;
    left: 50%;
    transform: translateX(-50%);
    position: absolute;
    min-width: 500px;
    max-width: 900px;
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
}

.customer, .large-object {
    background-color: #ffffff;
    overflow: hidden;
    cursor: pointer;
    position: relative;
    margin-bottom: 9px;
    display: flex;
    flex-direction: column;
    box-shadow: 0 0 7px #00000047;
    border-radius: 5px;
    font-weight: 100;
    font-size: 12px;
    width: 340px;
    margin: 10px;
}

.customer .customer-header i.fa, .large-object i.fa {
    padding-left: 20px;
    color: #5266ff;
    top: 20px;
    left: 20px;
}

.customer .item {
    padding-left: 20px;
    display: inline-block;
    vertical-align: middle;
}

.customer .name {
}

.customer .item.address {
    font-size: 12px;
    position: absolute;
    padding-right: 23px;
    right: 0px;
    max-width: 50%;
    text-align: right;
}

.customer .mid {
    top: 50%;
    position: absolute;
    transform: translateY(-50%);
    width: 100%;
}

.customer-card .card-names {
    position: relative;
    color: black;
    width: fit-content;
    display: flex;
    z-index: 1;
    flex-direction: column;
}

.identity .card-names .card-name, .identity .credential-identity {
    transition: all 300ms;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #3b3b3b;
    padding-top: 10px;
    border: 1px solid #3b3b3b;
    padding-bottom: 10px;
    padding-left: 20px;
    padding-right: 20px;
    border-radius: 6px;
    height: fit-content;
    font-size: 16px;
    margin-bottom: 10px;
    background-color: white;
    height: 18px;
}

.customer-card .record-type i.fa {
    color: #2e34cf;
    margin-left: 10px;
}

.customer-card .main>.actions, .customer-card .main>.status {
    position: absolute;
    right: 16px;
    top: 16px;
    padding: 11px;
    z-index: 1;
    color: white;
    display: flex;
    flex-direction: column;
    text-align: center;
}

.customer-card .main>.actions * {
    margin-bottom: 17px;
    color: #3d3d3d;
    font-size: 21px;
    cursor: pointer;
}

.customer-card .actions *:last-of-type, .customer-card .status *:last-of-type {
    margin-bottom: unset;
}

.card-names .account-detail {
    color: black;
}

.customer-card .account-status {display: inline-block;margin-left: 30px;}

.customer-info {
    position: relative;
    width: 400px;
    padding-bottom: 29px;
    margin-left: 20px;
    margin-right: 20px;
    z-index: 1;
    height: fit-content;
    margin-top: 20px;
    height: -moz-fit-content;
}

.customer-info .item {
    left: 50%;
    position: relative;
    transform: translateX(-50%);
    margin-top: 3px;
    margin-left: 10px;
    height: 24px;
}

.customer-info .item * {
    top: 50%;
    position: absolute;
    transform: translateY(-50%);
}

.customer-info .item .title {position: absolute;left: 25px;width: 100px;font-size: 14px;}

.customer-info .item input {
    right: 30px;
    height: 11px;
    width: 186px;
}

.customer-info .item:nth-child(3) {
    margin-top: 20px;
}

.customer-card .tags:not(.object-container) {
    position: relative;
    display: inline-block;
    width: auto;
    height: 20px;
    margin-left: 34px;
}

.customer-card .tags .tag {
    display: inline-block;
    margin-right: 8px;
    padding-left: 10px;
    padding-right: 10px;
    padding-top: 5px;
    padding-bottom: 5px;
    background-color: #297be5;
    color: white;
    border-radius: 2px;
}

.customer-info.notes {
    width: 380px;
    margin-top: 20px;
    min-height: 100px;
    margin-bottom: 20px;
}

i.fa.fa-arrow-left.back {
	cursor:pointer;
	position: fixed;
	left: 22px;
	top: 21px;
	font-size: 20px;
	z-index: 1;
}

.customer-card .pii-container {margin-top: 20px;display: flex;justify-content: space-evenly;padding-left: 50px;padding-right: 50px;flex-wrap: wrap;}

.customer-card .transactions, .open-documents .documents, .customer-card .campaigns {
    position: relative;
    background-color: #ffffffc4;
    margin-bottom: 50px;
    padding-bottom: 30px;
    padding-top: 30px;
    margin-bottom: 20px;
}

body {
    overflow: hidden;
    transition: all 300ms;
    transform: scale3d(1,1,1);
    top: 0px;
    left: 0px;
    height: 100%;
    width: 100%;
    position: fixed;
    margin: unset;
}

.transaction, .customer-card .document {
    height: 50px;
    margin-top: 15px;
    width: 100%;
    position: relative;
    background-color: #ffffff;
    color: #3b3b3b;
    cursor: pointer;
    white-space: nowrap;
    display: flex;
    align-items: center;
    box-shadow: 0 0 5px #00000040;
    border-radius: 6px;
    font-size: 13px;
    font-weight: lighter;
}

.transaction .item,.document .item,.log .item {
    position: relative;
    margin-left: 10px;
    display: flex;
    align-items: center;
    color: #3b3b3b;
    max-width: 215px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    padding-right: 10px;
}

.transaction>i.fa, .open-documents .document>i.fa, .open-documents .document>i.fas {
    position: relative;
    margin-left: 20px;
}

.transactions .fa-clock-o {
    margin-right: 6px;
}

.customer-card .new {
    position: absolute;
    margin-top: 20px;
    margin-left: 20px;
    color: #313131;
    cursor: pointer;
    user-select: none; -webkit-user-select: none;
}

.customer-card .transactions .header {
    margin-bottom: 33px;
}

.new-transaction, .new-document, .add-manual-history-items {
    width: 550px;
    height: 400px;
    top: 47%;
    transform: translate(-50%,-50%);
    left: 50%;
    position: absolute;
    background-color: white;
    z-index: 4;
    border-radius: 3px;
    overflow: hidden;
}

.new-transaction .header {
    position: relative;
    width: 100%;
}

.transaction-types {
    left: 50%;
    transform: translateX(-50%);
    margin-top: 60px;
    position: relative;
    width: 250px;
    justify-content: center;
    display: flex;
    flex-wrap: wrap;
}

.transaction-type {
    width: 100%;
    text-align: center;
    padding-top: 5px;
    padding-bottom: 5px;
    padding-left: 20px;
    padding-right: 20px;
    background-color: white;
    color: #3b3b3b;
    cursor: pointer;
    margin-top: 10px;
    border-radius: 5px;
    box-shadow: 0 0 6px #00000040;
}

.payment-info {
    position: relative;
    left: 60px;
    width: fit-content;
    height: 22px;
    display: flex;
    align-items: center;
}

.payment-info select.payment-type {margin-right: 20px;}

.payment-info input {
    margin-right: 10px;
    width: 90px;
}

.payment-info input:last-of-type {
    margin-right: unset;
    width: 100px;
}

.section {
    padding-left: 36px;
    font-size: 15px;
    font-weight: bold;
    color: #656565;
    margin-top: 11px;
    margin-bottom: 10px;
}

.section:first-of-type {
    margin-top: 52px;
}

.campaign-data {
    left: 60px;
    position: relative;
}

.shipping-note {
    height: 48px;
    width: 320px;
    background-color: white;
    box-shadow: 0 0 6px #00000036;
    padding: 10px;
    padding-top: 10px;
    overflow-y: scroll;
    text-align: left;
    border-radius: 7px;
}

.gift-giver {
    font-size: 13px;
    color: #545454;
    left: 60px;
    position: relative;
}

.next {
    position: absolute;
    width: 40px;
    height: 40px;
    background-color: #2c88f0;
    border-radius: 100%;
    color: white !important;
    bottom: 20px;
    left: 50%;
    transform: translateX(-50%);
    cursor: pointer;
    user-select: none; -webkit-user-select: none;
    transition: background-color 200ms;
}

.next i {
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%,-50%);
}

input.error,.error {background-color: #e83c3c2b !important;}

.new-transaction i.back {
    top: 19px !important;
    left: 23px !important;
}

.finish-list {
    left: 50%;
    transform: translateX(-50%);
    position: relative;
    transition: height 200ms;
    overflow-y: hidden;
    height: fit-content;
    height: -moz-fit-content;
    padding: 1px;
}

.finish-item {
    padding-left: 30px;
    padding-right: 30px;
    position: relative;
    padding-top: .8em;
    padding-bottom: .8em;
    border-bottom: 1px solid #ececec8f;
    display: flex;
    align-items: center;
    justify-content: space-between;
    font-weight: lighter;
}

.switch {
    transition: background-color 200ms;
    width: 40px;
    height: 22px;
    border-radius: 27px;
    background-color: lightgrey;
    display: inline-block;
    position: relative;
    user-select: none; -webkit-user-select: none;
}

.switch:not(.true)::after {transform: translateY(-48%);left: 3px;}

.switch::after {
    content: "";
    height: 17px;
    width: 17px;
    background-color: white;
    position: absolute;
    border-radius: 100%;
    transition: all 200ms;
    top: 50%;
}

.switch.true::after {transform: translateY(-48%);left: calc(100% - 20px);}

.switch.true {
    background-color: #63c363;
}

.finish-item>* {
    display: inline-block;
}

.finish-item>.switch, .finish-item>input, .finish-item>.assignment, .finish-item>.value, .finish-item>select, .finish-item>.button {
    cursor: pointer;
    text-align: right;
    display: flex;
    align-items: center;
}

li>.switch, li>input, li>.assignment, li>.value,li>select, li>.button {
    display: flex;
    align-items: center;
    margin-left: auto;
}

.new-transaction .button.create {
    bottom: 30px;
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
}
.pii-container .customer-info i.fa.fa-pencil-alt {
    position: absolute;
    top: 12px;
    right: 14px;
    cursor: pointer;
}

.pii-container.customer-container {
    left: 50%;
    transform: translate(-50%,-50%);
    position: absolute;
    top: 54%;
    z-index: 1;
}

.customer-container .card-names {
    color: white;
    width: 50%;
    left: 50%;
    transform: translateX(-50%);
    position: relative;
    margin-bottom: 20px;
    z-index: 1;
}

.customer-container .customer-info.pii .fa-pencil-alt {
    display: none;
}

.customer-container .button.create {
    left: 50%;
    position: relative;
    transform: translateX(-50%);
    margin-top: 37px;
}

i.fa.fa-arrow-left.back.body {
    top: 80px;
}

.card-names i {
    color: #585858;
    cursor: pointer;
    padding-right: 5px;
    padding-left: 5px;
    margin-left: auto;
}

*:not(.pii-container)>.card-names>.card-name[contenteditable] {
    background-color: #416bffb8;
}

.customer-card .content.settings .finish-list {
    width: 56%;
    min-width: 450px;
}

.confirm {
    background-color: white;
    width: 483px;
    height: 221px;
    position: absolute;
    top: 46%;
    transform: translateY(-50%) translateX(-50%);
    left: 50%;
    border-radius: 3px;
    z-index: 15 !important;
    padding: 10px 20px;
}

.confirm .description {
    text-align: center;
    margin-top: 30px;
}

.confirm .button.confirm-button {
    bottom: 30px;
    position: absolute;
}

.confirm .button.confirm-button.cancel {
    left: 50px;
}

.button.confirm-button.continue {
    right: 50px;
}

.not-found {
    position: absolute;
    width: 300px;
    height: auto;
    top: 40%;
    left: 50%;
    transform: translateX(-50%) translateY(-50%);
    background-color: white;
}

.not-found i {
    font-size: 70px;
    text-align:  center;
    width: 100%;
    color: #b83b3b;
}

.recent-series-item-large,.new-series-item-large {
    position: relative;
    width: 500px;
    height: 200px;
    margin-top: 25px;
    box-shadow: 0 0 9px #0000002b;
    border-radius: 3px;
    left: 50%;
    transform: translateX(-50%);
}

.recent-series-item-large.first {
    margin-top: 50px;
}

.series-item-image img,.series-item-image {
    height: 175px;
    max-width: 125px;
    object-fit: contain;
}

.series-item-image {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    margin-left: 14px;
    border-radius: 3px;
    overflow: hidden;
    height: 175px;
    max-width: 165px;
}

.right-container {
    width: calc(100% - 125px);
    left: 125px;
    position: absolute;
    height: 100%;
}

.recent-series-item-large .actions {
    position: absolute;
    bottom: 10px;
    right: 10px;
}

.customer-list .actions>* {
    cursor: pointer;
    margin-top: 20px;
}

.recent-series-item-large .container-item,.new-series-item-large .container-item {
    margin-top: 20px;
    left: 50%;
    transform: translateX(-50%);
    white-space: nowrap;
    position: relative;
    width: fit-content;
    display: block;
    width: -moz-fit-content;
}

.right-container .container-item>* {
    display: inline-block;
    margin-right: 13px;
}

.right-container input {
    display: inline-block;
}

.container-item.link {
    color: #005ccf;
    cursor: pointer;
}

.recent-series-item-large.first .actions {
    bottom: unset;
    right: unset;
    width: 100%;
}

.recent-series-item-large .finish-item {
    margin-top: 15px;
}

.button.makeactive {
    left: 50%;
    transform: translateX(-50%);
    position: relative;
    margin-top: 20px;
}

.recent-series-item-large.first .container-item {
    margin-top: 10px;
}

.recent-series-item-large:last-of-type {
    margin-bottom: 50px;
}


.sidebar.orders .item {
    font-size: 12px;
}

.order-fill {
    position: absolute;
    left: 250px;
    top: 50px;
    width: calc(100% - 250px);
    height: calc(100% - 50px);
    overflow: hidden;
}


.settings-group {
    left: 50%;
    transform: translateX(-50%);
    position: relative;
    width: fit-content;
    margin-top: 45px;
    box-shadow: 0 0 4px #0000004a;
    width: -moz-fit-content;
}

.settings-item {
    width: 492px;
    height: 40px;
    padding-left: 75px;
    line-height: 40px;
    background-color: #ffffff;
    border-bottom: 1px solid #dedede;
    cursor: pointer;
}

.settings-group .title {
    font-weight: bold;
    color: #464646;
    padding-left: 20px;
    margin-bottom: 10px;
    position: absolute;
    top: -25px;
}

.settings-item:last-of-type {
    border-bottom:unset;
}

.settings-item::after {content: "\f105";position: absolute;font-family: "Font Awesome 5 Free", "Font Awesome 5 Pro";font-weight: 900;right: 25px;color: #3a3a3a;}

.setting-page .finish-list {
    width: 60%;
}

.new-mailmerge .letter {
    cursor:pointer;
}

.new-mailmerge .letter.upload {
    position: absolute;
    left: 50px;
    bottom: 30px;
    height: 150px;
}

.new-mailmerge .letter.create {
    right: 50px;
    position: absolute;
    bottom: 30px;
    height: 150px;
}

.new-mailmerge .letter .desc {
    position: absolute;
    width: 100%;
    text-align: center;
    color: #3b3b3b;
    top: 65%;
    font-size: 10px;
}

.html-upload input[type="file"] {width: 200px;display: inline-block;}

.content.html-upload .button.upload {
    position: absolute;
    bottom: 30px;
    left: 50%;
    transform: translateX(-50%);
}

.new-mailmerge .letter-name {
}

.letter-viewer {
    position: relative;
    background-color: #f0f0f0;
    width: fit-content;
    max-width: 9in;
    height: calc(100% - 40px);
    overflow: scroll;
    border-radius: 3px;
    display: flex;
    padding-top: 20px;
    padding-bottom: 20px;
    box-shadow: 0 0 5px #00000042;
}

.letter-viewer .letter {
    width: fit-content;
    position: relative;
    margin-top: 30px;
}

.letter-viewer .cmd-bar {
    width: 100%;
    height: 38px;
    box-shadow: 0px 0px 4px black;
    position: absolute;
    top: -12px;
}

.letter-viewer-modal .cmd-bar {
    position: relative;
    padding-top: 6px;
    padding-bottom: 16px;
    right: 0px;
    height: fit-content;
	height: -moz-fit-content;
    background-color: white;
    color: #3b3b3b;
    width: 50px;
    border-radius: 4px;
    display: flex;
    vertical-align: top;
    margin-left: 15px;
    white-space: normal;
    box-shadow: 0 0 6px #00000057;
    flex-direction: column;
    align-items: center;
}

.cmd-bar {}

.letter-viewer-modal .cmd-bar .fa {
    margin-top: 16px;
    margin-bottom: 6px;
}

.user-id-desc {
    text-align: center;
    font-size: 9px;
    width: fit-content;
    padding-top: 0px;
    padding-bottom: 5px;
    padding-left: 3px;
    padding-right: 3px;
}

.cmd-bar .switch {font-size: 11px;margin-top: -4px;margin-bottom: 10px;}

.letter-viewer-modal {
    top: 0px;
    width: fit-content;
    position: absolute;
    height: 86%;
    top: 53%;
    left: 50%;
    transform: translate(-50%,-50%);
    white-space: nowrap;
    z-index: 4;
    display: flex;
    justify-content: space-between;
    transition: all 300ms cubic-bezier(0.55, 0.09, 0.68, 0.53);
}

.letter-small {
    transform: scale(0.42) translateX(-50%) translateY(-50%);
    width: 7.5in;
    height: 10in;
    position: relative;
    margin: unset;
    top: 0px;
    overflow: hidden;
    overflow-y: scroll;
    transform-origin: 0 0;
    left: 50%;
    top: 48%;
    padding-left: 1in;
    padding-right: 1in;
    padding-top: .5in;
    box-shadow: 0 0 11px #0000003b;
}

.new-document {
}

.new-document .title, .campaign-email-send .send .title, .section-title {
    padding-left: 30px;
    font-weight: bold;
    color: #3b3b3b;
    font-size: 15px;
    margin-top: 30px;
}

.new-document .main-item,.section-item {
    padding-left: 60px;
    margin-top: 10px;
    font-size: 12px;
    display: inline-block;
}

.new-document .change {
    display: inline-block;
    font-size: 10px;
    padding-left: 11px;
    color: #2930d4;
    font-weight: bold;
    cursor: pointer;
}

.new-document .finish-list {
    max-width: 85%;
    margin-top: 10px;
}

.finish-item input {
    padding-right: 10px;
    cursor: text;
}

.new-document .button.create {
    position: absolute;
    bottom: 30px;
    left: 50%;
    transform: translateX(-50%);
}

.document .fa-clock-o {
    padding-right: 5px;
}

.documents .header {
    margin-bottom: 33px;
}

.revision, .sidebar-object {
    height: 40px;
    background-color: #f5f5f5;
    width: 100%;
    position: relative;
    color: #3b3b3b;
    cursor: pointer;
    padding: 2px 0px;
    transition: all 200ms;
    border-bottom: 4px solid white;
}

.history-sidebar .primary-info {
    margin-top: 15px;
}

.revision-date {
    transform: translateY(-50%);
    font-size: 12px;
    position: absolute;
    top: 50%;
    padding-left: 19px;
}

.revision-number {
    position: absolute;
    font-size: 12px;
}

.click {
    font-size: 14px;
    position: absolute;
    right: 18px;
    top: 50%;
    transform: translateY(-50%);
    cursor: context-menu;
}

.history-sidebar i.fa.fa-arrow-left {
    position: absolute;
    top: 20px;
    left: 14px;
}

.revision.open, .sidebar-object.open {
    background-color: #487ef8;
    color: white;
}

.revision:not(.open):hover, .sidebar-object:not(.open):hover {background-color: #487ef8b5;color: white;}

.log-list-bottombar {
    position: fixed;
    width: 100%;
    bottom: 0px;
    height: 55px;
    background-color: #5836ff;
    left: 0px;
}

.log-list-bottombar>.fa {
    color: white;
    font-size: 28px;
    top: 50%;
    transform: translateY(-50%);
    padding-right: 44px;
    padding-left: 44px;
    position: absolute;
    cursor: pointer;
}

.log-list-bottombar i.fa.fa-angle-right {
    right: 0;
}

.display-block {
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    width: 300px;
    height: 100%;
}

.log-list-bottombar .display-block * {
    color: white;
}

.log-list-bottombar .desc {
    width: 100%;
    text-align: center;
    font-size: 10px;
    margin-top: 5px;
}

.desc .goback {
    display: inline-block;
    color: #b7bdff;
}

.display-block-items>* {
    position: relative;
    display: inline-block;
    width: 50px;
    height: 50px;
}

.display-block .display-block-items {
    display: flex;
    justify-content: center;
    margin-top: 5px;
}

.display-block-items .fa {
    left: 50%;
    transform: translateX(-50%);
    position: relative;
}

.display-block-items .text {
    text-align: center;
    font-size: 10px;
}

.mid-modal {
    width: 300px;
    top: 40%;
    position: absolute;
    left: 50%;
    transform: translate(-50%,-50%);
    box-shadow: 0 0 12px #00000021;
}

.mid-modal .header {
    font-size: 15px;
}

.mid-modal div#flag-viewer {
    margin-top: 40px;
    margin-bottom: 25px;
    left: 50%;
    position: relative;
    transform: translateX(-50%);
}

.log {
    width: 80%;
    height: 45px;
    max-width: 900px;
    background-color: white;
    color: #3b3b3b;
    box-shadow: 0 0 7px #0000004a;
    position: relative;
    left: 50%;
    transform: translateX(-50%);
    margin-bottom: 14px;
    display: flex;
    border-radius: 6px;
    align-items: center;
}

.log:nth-child(2) {
    margin-top: 30px;
}

.log>i.fa.fa {
    padding-left: 17px;
    font-size: 12px;
}

.customer-card .item .fa, .item .fas {
    margin-right: 5px;
    margin-left: 5px;
    font-size: 8px;
}

.log .item:first-of-type {
    cursor: pointer;
    min-width: 279px;
}

.itemlist {
    position: relative;
    height: 200px;
    width: calc(100% - 20px);
    display: block;
    padding-left: 20px;
    padding-right: 20px;
    padding-top: 20px;
    padding-bottom: 14px;
    overflow: hidden;
    border-radius: 6px;
    border: 1px solid #00000014;
    box-shadow: inset 0 0 12px #0000001f;
    background-color: #fbfbfb;
}

.itemlist .item, .product-container .item {
    height: 160px;
    user-select: none; -webkit-user-select: none;
    min-width: 115px;
    width: 120px;
    border-radius: 3px;
    overflow: hidden;
    padding: 5px;
    padding-right: 10px;
    position: relative;
    transition: all 200ms;
}

.itemlist .item img, .itemlist .item .outline, .product-container .item img, .product-container .item .outline {
    border-radius: 5px;
    transition: 200ms filter;
    height: 100%;
    max-width: 85%;
    object-fit: contain;
    transition: all 200ms;
}

.itemlist .item>.fa, .product-container .item>.fa {
    position: absolute;
    color: white;
    z-index: 1;
    top: 40%;
    left: 50%;
    margin: unset;
    cursor: pointer;
    transform: translate(-50%,-50%);
    display: none;
}

.itemlist .item .modify, .product-container .item .modify  {
    position: absolute;
    top: 84%;
    left: 50%;
    transform: translateX(-50%);
    white-space: nowrap;
}

.itemlist .item .modify>*, .product-container .item .modify>* {
    display: inline-block;
}

.itemlist .item .modify>.fa, .product-container .item .modify>.fa {
    cursor: pointer;
}

.itemlist .item:hover>.fa, .product-container .item:hover>.fa {
    display: block;
}

.itemlist .order-item input {
    width: calc(70px - 25px);
}

.itemlist .order-item {
    width: 100%;
}

.itemlist .order-item .title, .product-container .order-item .title {
    width: 100%;
    text-align: center;
    font-size: 15px;
    font-weight: bold;
    margin-bottom: 5px;
    color: #4e4e4e;
}

.itemlist .order-item, .product-container .itemlist .order-item{
    top: 50%;
    transform: translateY(-50%) translateX(-50%);
    position: relative;
    height: 50px;
    left: 50%;
    width: fit-content;
}

.itemlist .order-item .fa-plus, .product-container .order-item .fa-plus  {
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    margin: unset;
    top: 54%;
    color: #2d2d2d;
    font-size: 20px;
    cursor: pointer;
}

.itemlist .new {
    position: fixed;
    z-index: 1;
    background-color: white;
    margin-left: -10px;
    padding-left: 7px;
    padding-right: 7px;
    width: fit-content;
}

.itemlist .new select.item-select {
    left: 50%;
    transform: translateX(-50%);
    position: relative;
}

.item[pos="1"] {
    margin-left: 156px;
}

.itemlist .item.new .desc {
    width: 100%;
    text-align: center;
    font-size: 10px;
}

.itemlist .item.new .desc.sel {
    margin-top: 5px;
}

.itemlist .item.new .desc.sel.success {
    color: green;
}

.order-pack {
    width: 60%;
    max-width: 1000px;
    height: 68%;
    background-color: white;
    z-index: 3;
    position: absolute;
    top: 53%;
    left: 50%;
    transform: translate(-50%,-50%);
    overflow: hidden;
}

.order-pack .itemlist {
    width: calc(80% - 20px);
    left: 10%;
    position: absolute;
    top: 43%;
    transform: translateY(-50%);
    padding-top: 22px;
    padding-bottom: 0px;
}

.order-pack .content.letters .letters, .order-pack .content.emails .letters {
    margin-bottom: 20px;
    left: 50%;
    transform: translateX(-50%);
    position: relative;
    width: calc(8.5in * .4);
    margin-top: 50px;
    margin-bottom: 100px;
}

.order-pack .letters .letter-small {
    top: 0px !important;
    transform: translateY(0px) scale(0.42) translateX(-50%);
    position: absolute;
}

.order-pack .title {
    position: absolute;
    top: 23%;
    transform: translateY(-50%);
    padding-left: 65px;
    font-weight: bold;
    color: #353535;
    font-size: 12px;
}

.itemlist .item .name {
    position: absolute;
    z-index: 1;
    color: white;
    font-size: 10px;
    width: auto;
    text-align: center;
    top: 19%;
    display: none;
    left: 50%;
    width: auto;
    transform: translateX(-50%);
}

.itemlist .item:hover .name {
    display: block;
}

.item.added {
}

.itemlist .item>.fa-check {
    color: green;
    display: block;
}

.itemlist .item.added img {
    filter: brightness(.25);
}


.itemlist .item:not(.added)>.fa-check {
    display: none;
}

.order-pack .letters embed {
    width: calc(8.5in * .4);
    height: calc(11in * .4);
    transform-origin: 0 0;
    margin-bottom: 30px;
    box-shadow: 0 0 13px #00000036;
}



.order-pack .content.letters .button {
    left: 50%;
    transform: translateX(-50%);
    position: relative;
}

.order-pack .content.main .finish {
    position: absolute;
    bottom: 30px;
    left: 50%;
    transform: translateX(-50%);
}

.new-transaction .itemlist, .add-manual-history-items .itemlist {
    margin-left:20px;
    width: calc(100% - 80px);
}

.donor-list {
    position: fixed;
    width: 500px;
    height: 600px;
    left: 50%;
    transform: translateX(-50%) translateY(-50%);
    top: 54%;
    background-color: white;
    z-index: 4;
    padding-left: 40px;
    padding-right: 40px;
    padding-top: 30px;
    overflow: scroll;
    padding-bottom: 20px;
}

.create-series-item {
    position: fixed;
    left: 50%;
    transform: translate(-50%,-50%);
    top: 50%;
    width: 600px;
    height: 432px;
    background-color: white;
    z-index: 4;
}

.create-series-item .button.finish {
    bottom: 30px;
    left: 50%;
    transform: translateX(-50%);
    position: absolute;
}

.create-series-item .title {
    padding-left: 60px;
    font-weight: bold;
    color: #444444;
    margin-top: 20px;
    font-size: 15px;
}

.create-series-item>input {
    margin-left: 49px;
    margin-top: 10px;
    width: 300px;
}

.create-series-item .container-item {
    margin-top: 0px;
    right: 0px;
}

.create-series-item .header[contenteditable] {
    color: #ca2311;
}

.campaign-card {width: 100%;left: 0;height: 100%;overflow: scroll;}

.campaign-setup {
    height: 479px;
    width: 620px;
    position: fixed;
    z-index: 4;
    left: 50%;
    top: calc(25px + 50%);
    transform: translateX(-50%) translateY(-50%);
    background-color: white;
    box-shadow: 0 0 9px #00000038;
    overflow: hidden;
    border-radius: 5px;
}

.campaign-setup .finish-list {
    margin-top: 10px;
    width: 100%;
}

.campaign .campaign-setup .main>.title {
    font-weight: bold;
    padding-left: 30px;
    margin-top: 20px;
    color: #2e2e2e;
}

select.populationsort, input.autoinclude,input.campaign-code {
    margin-left: 30px;
}

.campaign-setup .autoinclude .title {
    display: inline-block;
    margin-right: 20px;
}

.campaign-setup .main>.switch {
    margin-top: 10px;
}

.campaign-setup .population {
    display: flex;
    margin-top: 10px;
    margin-left: 40px;
}

.campaign-setup .modifications {
    position: relative;
    width: 90%;
    left: 5%;
    margin-top: 25px;
    max-height: 400px;
    height: 265px;
}

.campaign-setup .mod {
    width: 100%;
    height: 44px;
    background-color: #3ba7ff;
    color: white;
    margin-bottom: 10px;
    position: relative;
}

.campaign-setup .mod>* {
    position: relative;
    top: 50%;
    transform: translateY(-50%);
    margin-left: 20px;
    display: inline-block;
}

.campaign-setup .mod .fa-trash {
    position: absolute;
    right: 20px;
    cursor: pointer;
}

.campaign-setup .automod .fa-plus {
    position: absolute;
    top: 20px;
    right: 30px;
    cursor: pointer;
}

.new-automod {
    position: fixed;
    width: 500px;
    height: 231px;
    background-color: white;
    z-index: 4;
    top: 47%;
    left: 50%;
    transform: translate(-50%,-50%);
    border-radius: 5px;
}

.new-automod .title {
    padding-left: 30px;
    font-weight: bold;
    color: #454545;
    margin-top: 12px;
}

.new-automod select.order-type {
    margin-left: 31px;
    margin-top: 10px;
}

.new-automod select.clarification {
    margin-left: 20px;
}

input.price-change {
    margin-top: 10px;
    margin-left: 32px !important;
}

.new-automod input {
    width: 109px;
    margin-left: 10px;
}

.new-automod .button.finish {
    bottom: 22px;
    left: 50%;
    transform: translateX(-50%);
    position: absolute;
}

.campaign-setup .mod-item {
    height: 100%;
}

.campaign-setup .mod-item .mod-desc {position: absolute;text-align: center;font-size: 10px;margin-top: 2px;white-space: nowrap;left: 50%;transform: translateX(-50%);}

.campaign-setup .automod .mod input {
    top: 50%;
    position: relative;
    transform: translateY(-25%);
    width: 53px;
}

.campaign-setup .button.finish {
    position: absolute;
    bottom: 30px;
    left: 50%;
    transform: translateX(-50%);
}

.sidebar .fa-plus {
    position: absolute;
    right: 30px;
    top: 22px;
    cursor: pointer;
}

.sidebar .header {
    margin-bottom: 20px;
}

.campaign-setup .title-item {
    position: absolute;
    left: 257px;
    top: 85px;
}

input.autoinclude, input.campaign-code {
    margin-top: 17px;
}

.campaign-basic-info,.campaign-actions {
    display: inline-block;
    height: 100px;
    background-color: white;
    color: #3b3b3b;
    width: 300px;
    box-shadow: 0 0 10px #00000026;
    position: relative;
    margin-bottom: 14px;
    border-radius: 4px;
}

.code {
    text-align: center;
    font-weight: bold;
    color: #2a2a2a;
    top: 38%;
    position: absolute;
    width: 100%;
}

.campaign-desc {
    font-size: 10px;
    text-align: center;
    padding-top: 10px;
}

.campaign-card .campaign-basic-info .desc-container {
    bottom: 10px;
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
}

.campaign-basic-info .desc-container .desc-item * {
    display: inline-block;
}

.campaign-basic-info .desc-container .desc-item *:first-of-type {
    margin-right: 2px;
}

.campaign-basic-info .desc-container .desc-item {
    display: inline-block;
    margin-left: 5px;
    margin-right: 5px;
}

.campaign-basic-info i.fa.fa-cog {
    position: absolute;
    margin-left: 10px;
    margin-top: 10px;
    cursor: pointer;
}

.report-tiles {
    margin-left: 20px;
    margin-right: 20px;
    width: -webkit-fill-available;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
}

.report-tiles>.tile {margin-bottom: 20px;margin-right: 20px;}

.report-tiles>.tile.large {
    width: 100%;
    height: 100px;
    margin-bottom: 20px;
}

.report-tiles>.tile.small {
    width: auto;
    height: auto;
}

.campaign-card .actions {
    position: fixed;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    right: 50px;
    top: 20px;
    color: #3b3b3b;
    font-size: 17px;
    z-index: 2;
}

.email-send-dialog {
    width: 500px;
    left: 50%;
    position: absolute;
    top: 50%;
    transform: translate(-50%,-50%);
    height: 300px;
    background-color: white;
    z-index: 3;
    box-shadow: 0 0 9px #0000002e;
}

.load-throbber .fa {
    color: green;
    font-size: 18px;
    position: absolute;
    left: 50%;
    transform: translate(-50%,-12%);
    top: 50%;
}

.throbber.stop {
    animation: unset;
    opacity: 0;
}

.email-send-dialog .check-list .load-throbber {
    transform-origin: 0 0;
    transform: scale(.5,.5) translateY(-50%);
    left: unset;
    position: relative;
}

.check-list {
    width: 80%;
    height: auto;
    position: relative;
    left: 50%;
    transform: translateX(-50%);
    margin-top: 20px;
}

.check-list .check {
    height: 50px;
    position: relative;
    display: flex;
    justify-content: left;
    border-bottom: 1px solid #dfdfdf;
}

.action-text {
    line-height: 50px;
    font-size: 16px;
    text-align: right;
    width: -webkit-fill-available;
    white-space: nowrap;
    padding-right: 10px;
}

.load-throbber .fa-clock-o {
    color: #282828;
}

.email-send-dialog .check-list {
    top: 37%;
    transform: translate(-50%, -50%);
    position: absolute;
}

.email-send-dialog .button.close {
    position: absolute;
    bottom: 30px;
    left: 50%;
    transform: translateX(-50%);
}

.load-throbber .fa-times {
    color: red;
}

.email-send-dialog .button.error-manage,.email-send-dialog .button.error-close {
    position: absolute;
    bottom: 30px;
}

.email-send-dialog .button.error-close {
    left: 50px;
}

.email-send-dialog .error-manage {
    right: 50px;
}

.email-send-dialog .error-container .title {
    text-align: center;
    top: 46px;
    position: absolute;
    color: #800f0f;
    width: calc(100% - 20px);
    font-size: 10px;
    padding-left: 10px;
}

.tag-extra {
    position: absolute;
    color: white;
    border-radius: 3px;
    margin-left: 30px;
    top: 71px;
    font-size: 10px;
    display:flex;
    flex-wrap: wrap;
    max-width: 40%;
    justify-content: left;
}

.tag-extra .tag {
    background-color: #28952c;
    box-shadow: 0 0 3px #00000085;
    padding-top: 6px;
    padding-bottom: 6px;
    padding-left: 10px;
    padding-right: 10px;
    border-radius:3px;
    margin-bottom: 5px;
    margin-right: 10px;
    margin-right: 6px;
}


.content.open-settings .finish-list {
    width: 69%;
}

.campaign-card .actions>* {
    cursor: pointer;
    margin-left: 0px;
    margin-right: 20px;
}

.campaign-bar {
    width: 100%;
    height: 38px;
    left: 50%;
    transform: translateX(-50%);
    position: relative;
    background-color: #ffffff;
    color: #3b3b3b;
    box-shadow: 0px -2px 5px #00000033;
    display: flex;
    justify-content: center;
    margin-bottom: 50px;
    border-bottom: 1px solid #00000024;
}

.campaign-card .actions>*:last-of-type {
    margin-right: unset;
}

.campaign-bar .bar-item {
    position: relative;
    top: 50%;
    transform: translateY(-50%);
    display: inline-block;
    padding: 5px 20px;
    cursor: pointer;
    line-height: 29px;
    min-width: 100px;
    text-align: center;
    border-right: 1px solid #d6d6d6;
}


.campaign-tab {
    width: -webkit-fill-available;
    position: relative;
}

.campaign-tab.population .campaign-pop {
    width: 80%;
    left: 10%;
    position: relative;
    padding-top: 20px;
}

.campaign-pop .customer .name {
    cursor: pointer;
}

.campaign-pop .customer {
    cursor: default;
}

.campaign-actions .button {
    left: 50%;
    position: relative;
    transform: translateX(-50%);
    margin-top: 13px;
}

.campaign-email-send {
    position: fixed;
    width: 762px;
    height: 500px;
    left: 50%;
    top: 50%;
    transform: translate(-50%,-50%);
    background-color: white;
    z-index: 4;
    border-radius: 3px;
    overflow: hidden;
}

.campaign-email-send input.subject-line {
    margin-top: 20px;
    width: 300px;
    margin-left: 30px;
}

.campaign-email-send>.header {
    position: absolute;
    width: 100%;
}

.campaign-email-send .subhead {
    width: 100%;
    text-align: center;
    margin-top: 42px;
}

.campaign-email-send .invalid-emails {
    margin-top: 30px;
    width: 80%;
    left: 10%;
    height: 283px;
    position: relative;
    overflow: scroll;
    overflow-x: hidden;
    padding-right: 20px;
}

.campaign-email-send .finish-list {
    width: 80%;
    margin-top: 11px;
}

.campaign-email-send .list-container {
    overflow: hidden;
    overflow-y: scroll;
    max-height: 251px;
    margin-top: 10px;
}

.campaign-email-send .content:not(.send) .title {
    margin-top: 20px;
    text-align: center;
    font-weight: lighter;
}

.content.attachments .list-container {
    max-height: 303px;
}

.campaign-email-send .email-preview-address {
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    width: 250px;
    top: 27%;
}

.campaign-email-send .preview-address {
    margin-top: 10px;
    width: calc(100% - 20px);
}

.campaign-email-send .email-preview-address .button {
    left: 50%;
    position: relative;
    transform: translateX(-50%);
    margin-top: 22px;
    padding-left: 20px;
    padding-right: 20px;
}

.campaign-email-send .finish {
    left: 50%;
    position: absolute;
    transform: translateX(-50%);
    bottom: 30px;
}

input.schedule-send {
    margin-left: 20px;
}

.campaign-email-send .campaign-email-schedule {
    display: flex;
    position: relative;
    margin-top: 20px;
    margin-left: 40px;
}

.campaign-email-schedule .switch {margin-top: 2px;}

.campaign-email-send .letter.selected {
    background-color: #43a143;
}

.campaign-email-send .letter {
    cursor: pointer;
}

.order-pack .letters {
}

.letter-small.print {
    background-color: gray;
}

.letter-item {
    position: relative;
    width: calc(8.5in * .42);
    height: calc(11in * .42);
    margin-bottom: 20px;
}

.order-pack .button.finish {
    left: 50%;
    transform: translateX(-50%);
    position: relative;
    bottom: 20px;
}

.order-pack .letters .next {
    position: relative;
}

.new-document .preview .letter-item,.new-document .preview-email .letter-item {
    left: 50%;
    transform: translateX(-50%);
    margin-top: 30px;
}

.letter {
    white-space: normal;
}

.settings .print-backings, .choose-backing .print-backings {
    width: 80%;
    left: 10%;
    position: absolute;
    margin-top: 30px;
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
}

.print-backings .backing {
    width: 170px;
    height: 220px;
    box-shadow: 0 0 6px #00000047;
    margin-right: 20px;
    margin-left: 20px;
    margin-bottom: 40px;
    position: relative;
    transition: all 200ms;
    border-radius: 14px;
    overflow: hidden;
}

.print-backings .backing img {
    width: 100%;
    height: 100%;
    overflow: hidden;
    object-fit: cover;
}

.print-backings .backing .title {
    font-size: 11px;
    text-align: center;
    margin-top: 18px;
    position: absolute;
    width: 100%;
    color: white;
    z-index: 2;
}

.print-backings .actions {
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    display: flex;
    z-index: 2;
    color: white;
    top: 45%;
}

.print-backings .actions>* {
    margin-right: 20px;
    margin-left: 20px;
    font-size: 20px;
    cursor: pointer;
}

.print-backings .backing:hover {
}

.print-backings .backing:hover img {
    filter: brightness(0.3);
}

.print-backings .backing:not(:hover) .title {
    display: none;
}

.print-backings .backing:not(:hover) .actions {
    display: none;
}

.setting-page .content>i.fa.fa-plus {
    position: absolute;
    left: 40%;
}

.setting-page .add {
    top: 33px;
}

.new-backing .button {
    position: absolute;
    bottom: 30px;
    left: 50%;
    transform: translateX(-50%);
}

.new-backing input[type='file'] {
    top: 44%;
    width: 200px;
    left: 50%;
    position: absolute;
    transform: translateX(-50%);
}

.new-backing input.backing-name {
    position: relative;
    left: 50%;
    transform: translateX(-50%);
    margin-top: 50px;
    width: 200px;
}

.gift-search>* {
    display: inline-block;
    color: #2c6bdf;
    cursor: pointer;
}

.gift-search {
    padding-left: 5px;
    padding-right: 5px;
    position: relative;
    padding-top: 5px;
    padding-bottom: 5px;
    margin-top: 1px;
    font-size: 15px;
    margin-left: 55px;
    display: inline-block;
}

.gift-search .fa {
    margin-right: 5px;
    font-size: 12px;
    transform: translateY(-6%);
}

.assocview {
}

.assocview>* {
}

.search-sidebar .subtext {
    font-size: 11px;
    text-align: center;
    position: absolute;
    width: 100%;
}

.customer-card .associate {
    right: -30px;
    z-index: 2;
    position: absolute;
    transform: translateX(100%) translateY(-50%);
    top: 50%;
    white-space: nowrap;
}

.gift-giver .fa-trash {
    margin-left: 10px;
    cursor:pointer;
}

.merge-editor-body {
    position: fixed;
    top: 50px;
    width: 100%;
    left: 0px;
    height: calc(100% - 50px);
    background-color: #dadada;
    overflow-y: scroll;
    z-index: 1;
    overflow-x: hidden;
}

.letter-error {
    left: 50%;
    transform: translateX(-50%);
    position: absolute;
    top: 30%;
}

.letter-error i.fa.fa-exclamation-triangle {
    font-size: 50px;
    color: #ba1616;
    left: 50%;
    transform: translateX(-50%);
    position: relative;
}

.letter-error .text {
    margin-top: 20px;
}

.merge-letter-content {
    left: 50%;
    width: fit-content;
    position: relative;
    transform: translateX(-50%);
    margin-top: 60px;
    margin-bottom: 50px;
    outline: unset;
    transform-origin: 0 0;
}

.merge-letter-content.print{
    overflow: unset;
}

.merge-letter-content {}

.merge-letter-content .content {
    background-color: white;
    outline: unset;
    box-shadow: 0 0 9px #00000036;
}

.merge-letter-content .content {
    position: relative;
    overflow-y: scroll;
    overflow-x: hidden;
    margin-bottom: 70px;
}

.merge-editor-body .gbar {
    width: 100%;
    height: 50px;
    background-color: white;
    z-index: 2;
    transition: all 400ms;
    display: flex;
    position: relative;
}

.gbar {}

.merge-editor-body .gbar.shadow {
}

.gbar .action {
    position: relative;
    top: 50%;
    transform: translateY(-50%);
    display: inline-block;
    height: 20px;
    margin-right: 13px;
    padding: 3px;
    border-radius: 3px;
    cursor: pointer;
    color: #383838;
}

.gbar .action:first-of-type {
    margin-left: 20px;
}

.action>* {
    vertical-align: middle;
}

.gbar .action:hover {
    background-color: #e9e9e9;
}

.separator {
    border-radius: 3px;
    width: 1px;
    margin-left: 5px;
    margin-right: 13px;
    height: 24px;
    top: 50%;
    transform: translateY(-50%);
    position: relative;
    background-color: #d0d0d0;
}

.gbar .action.active {
    color: #3f8bff;
}

.ruler-top {
    z-index: auto;
    width: 100%;
    height: 15px;
    top: 100px;
    border-top: 1px solid #bdbdbd;
    border-bottom: 1px solid #bdbdbd;
}

.ruler-side {
    height: 100%;
    position: absolute;
    width: 15px;
    top: calc(50px + 17px);
    border-right: 1px solid #bdbdbd;
    border-left: 1px solid #bdbdbd;
    z-index: 0 !important;
}

.ruler {
    z-index: 2;
    background-color: white;
}

.merge-topbar {
    position: fixed;
    width: 100%;
    box-shadow: 0 0 7px #00000069;
    z-index: 3;
}

.insert-variable, .insert-text,.insert-link {
    width: 400px;
    height: 200px;
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
    background-color: white;
    box-shadow: 0 0 12px #00000047;
    z-index: 4;
    border-radius: 3px;
}

select {}

.insert-variable .button, .insert-text .button,.insert-link .button {
    left: 50%;
    transform: translateX(-50%);
    position: absolute;
    bottom: 30px;
}

.insert-variable input {
    left: 50%;
    transform: translateX(-50%);
    position: relative;
    margin-top: 29px;
}

.insert-text .code, .insert-text .text, .insert-link .code,.insert-link .text {
    width: 200px;
    left: 50%;
    top: 27%;
    transform: translateX(-50%);
    position: absolute;
    text-align: left;
    font-weight: normal;
}

.insert-text .text,.insert-link .text {
    top: 45%;
    width: 84%;
}

.gbar .action#settings {position: absolute;right: 10px;}

.page {
    width: -webkit-fill-available;
    height: -webkit-fill-available;
    outline: unset;
    position: absolute;
    -webkit-margin-collapse: discard;
}

.merge-editor-body .settings {
    height: calc(100% - 117px);
    width: 250px;
    position: fixed;
    top: 117px;
    right: 0px;
    background-color: #507fff;
    box-shadow: 0 0 7px #00000075;
    transition: all 300ms ease-in-out;
}

.merge-editor-body .settings.right {
    transform: translateX(100%);
}

.merge-editor-body .settings .header {
    color: white;
    margin-bottom: 10px;
}

.merge-editor-body .setting-item>* {
    display: inline-block;
    color: white;
    margin-top: 8px;
    vertical-align: middle;
    line-height: 20px;
}

.merge-editor-body .setting-item {
    padding-left: 15px;
    padding-right: 15px;
    display: flex;
    justify-content: space-between;
    margin-top: 8px;
    align-items: center;
}

.merge-editor-body .setting-item select {
    color: black;
}

.merge-editor-body .setting-item .button {
    font-size: 10px;
    width: 45px;
    height: 11px;
    line-height: 11px;
    color: black;
    background-color: white;
    min-width: unset;
}

.merge-editor-body div.setting-item#backing {
}

.merge-editor-body .settings .button.close {
    color: black;
    background-color: white;
    bottom: 30px;
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    font-size: 14px;
}

.merge-letter-content.landscape .content {
    width: 11in;
    height: calc(8.5in - 2in);
}

.choose-backing {
    width: 600px;
    height: 400px;
    left: 50%;
    transform: translate(-50%,-50%);
    position: fixed;
    top: 48%;
    z-index: 4;
    background-color: white;
    border-radius: 3px;
    overflow: scroll;
}

.choose-backing .print-backings {
    margin-top: 30px;
}


.choose-backing .backing {
    cursor: pointer;
}

.merge-letter-content.print .content {height: 11in;}

.merge-editor-body .settings input.letter-name {
    left: 50%;
    transform: translateX(-50%);
    position: relative;
    margin-top: 10px;
    margin-bottom: 20px;
}

.letter-viewer-modal .cmd-bar .fa-download, .letter-viewer-modal .cmd-bar .fa-print {
    color: #5151ff;
    cursor:pointer;
}

input[type="number"] {}

div#font-size input {
    width: 30px;
    text-align: left;
    padding-left: 10px;
    z-index: 3;
}

div#font-size:hover {
    background-color: unset;
}

#font-color .fa-font,#background-color .fa-highlighter {
    transform: translateY(-1px) scale(.88);
    transform-origin: 0 0;
}

#font-color .color-sample,#background-color .color-sample {
    width: 90%;
    height: 2px;
    background-color: #3ecde3;
    transform: translateY(-1.6px) translateX(-57%);
    left: 50%;
    position: relative;
}

.content.preview .fa-download {
    position: absolute;
    top: 20px;
    right: 44px;
    cursor: pointer;
    color: #3a3aff;
}

.user-access-settings {
    position: fixed;
    width: 800px;
    height: 600px;
    left: 50%;
    transform: translate(-50%,-50%);
    background-color: white;
    top: calc(25px + 50%);
    z-index: 4;
    border-radius: 6px;
    padding-bottom: 23px;
    box-shadow: 0 0 6px #0000003d;
    overflow-y: scroll;
}

.user-access-settings .finish-list {
    margin-top: 18px;
    width: 80%;
}

.campaign-tab.population i.fa.fa-download {
    position: absolute;
    right: 12%;
    top: 20px;
    color: #3578f4;
    cursor: pointer;
}

.log .item:nth-of-type(2) {
}

.welcome-dialog {
    width: 100%;
    height: 100%;
    position: fixed;
    top: 0;
    left: 50%;
    transform: translate(-50%,0px);
    background-color: #4892ff;
    box-shadow: 0 0 9px #00000061;
    border-radius: 3px;
    z-index: 3;
}

.welcome-dialog .header {
    color: white;
    font-size: 30px;
    top: 20%;
    position: relative;
}

.welcome-dialog .subhead {
    width: 100%;
    text-align: center;
    color: white;
    margin-top: 10px;
    position: absolute;
    top: calc(20% + 60px);
}

.welcome-dialog .content.main {
}

.welcome-dialog .next {
    background-color: white;
    bottom: 100px;
}

.field-export .main .header {
    padding-bottom: 20px;
    box-shadow: 1px 5px 5px #0000000f;
}

.welcome-dialog .content:not(.main) .header {
    top: 10%;
}

.welcome-dialog .content:not(.main) .subhead {
    top: calc(10% + 50px);
    width: 86%;
    left: 50%;
    transform: translateX(-50%);
}

.welcome-dialog .welcome-content {
    top: 25%;
    height: 75%;
    position: absolute;
    width: 100%;
}

.skip-onboard {
    color: white;
    text-decoration: underline;
    cursor: pointer;
    position: absolute;
    bottom: 50px;
    right: 100px;
    z-index: 1;
}

.welcome-dialog .back {
    color: white;
}

.qr {
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    width: 300px;
    height: 300px;
    background-color: white;
    border-radius: 3px;
    margin-top: 27px;
}

.welcome-dialog .button {
    color: black;
    background-color: white;
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    top: 14%;
}

.contact .welcome-content input {
    display: block;
    margin-bottom: 10px;
    width: 200px;
    padding: 10px;
    left: 50%;
    transform: translateX(-50%);
    position: relative;
}

.contact .welcome-content input:first-of-type {
    margin-top: 100px;
}

.welcome-dialog .button.finish {
    bottom: 100px;
    position: absolute;
    top: unset;
}

.attempt-twofactor-enable {
    background-color: white;
    width: 500px;
    height: 500px;
    z-index: 4;
    position: fixed;
    left: 50%;
    transform: translate(-50%,-50%);
    top: 50%;
    border-radius: 6px;
}

.attempt-twofactor-enable .subhead {
    font-size: 10px;
    text-align: center;
    margin-top: 2px;
    color: #4e4e4e;
    left: 50%;
    width: -webkit-fill-available;
    padding-left: 50px;
    padding-right: 50px;
}

.attempt-twofactor-enable canvas {
    width: 250px;
    height: 250px;
    left: 50%;
    transform: translateX(-50%);
    position: relative;
    margin-top: 41px;
    margin-bottom: 34px;
}

.attempt-twofactor-enable input[type="text"] {
    position: relative;
    left: 20%;
}

.attempt-twofactor-enable input {
    width: 231px;
    margin-top: 30px;
    margin-left: 30px;
}

.attempt-twofactor-enable .button {
    display: inline-block;
    margin-left: 20px;
}

.twofactor-enabled {
    width: 300px;
    left: 50%;
    position: absolute;
    transform: translateX(-50%);
    height: 50px;
    margin-top: 77px;
}

.subhead.twofa-sub {
    white-space: normal;
    max-width: 550px;
    left: 50%;
    transform: translateX(-50%);
}

.key-list .key-item {
    width: 200px;
    height: 64px;
    position: relative;
    color: #3b3b3b;
    padding-left: 20px;
    padding-right: 20px;
    padding-top: 10px;
    padding-bottom: 10px;
    display: flex;
    flex-direction: row;
    margin-bottom: 10px;
    padding: 16px 16px;
    margin: 10px;
    border-radius: 5px;
    box-shadow: 0 0 7px #0000004a;
    align-items: center;
    justify-content: center;
}

.key-list .key-item * {
    font-size: 12px;
}

.api-access .key-list {
    margin-top: 30px;
    flex-direction: row;
    display: flex;
    width: 100%;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
}

.key-list .key-item .private-key {
    min-width: 360px;
    filter: blur(3px);
    cursor: pointer;
    transition: all 200ms;
}

.key-list .key-item .fa-trash {
    cursor: pointer;
}

.key-list .key-item .public-key {
    min-width: 110px;
}

.pager {
    width: 175px;
    left: 0px;
    top: 117px;
    position: fixed;
    height: calc(100% - 117px);
    background-color: white;
    box-shadow: 0 0 4px #00000061;
    overflow: scroll;
    overflow-x: hidden;
    scroll-behavior: unset;
    -ms-overflow-style: none;
    z-index: 2;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: center;
}

.pager__page-item {
    width: 130px;
    margin-top: 11.46px;
    margin-bottom: 11.46px;
    height: 173px;
    background-color: white;
    position: relative;
    box-shadow: 0 0 4px #00000059;
    border-radius: 0px;
    flex-shrink: 0;
    flex-grow: 0;
}

.pager__page-item .title {
    text-align: center;
    padding-top: 10px;
    font-size: 12px;
}

.pager__page-item:last-of-type {
    margin-bottom: 500px;
}

.pager__page-item::-webkit-scrollbar {
    display: none;
}

.pager::-webkit-scrollbar {
    display: none;
}

.pager__page-item.new-page i.fa.fa-plus {
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%,-50%);
    font-size: 22px;
}

.pager__page-item.new-page {
    cursor: pointer;
}

.letter-viewer .pagebreak {
    width: 200%;
    height: 40px;
    left: 50%;
    transform: translateX(-50%);
    position: relative;
    background-color: gray;
}

.letter-viewer .merge-letter-content {
    left: 50%;
    margin-top: unset;
}

.letter-small .merge-letter-content {
    left: 50%;
    margin-top: unset;
}

.pager__page-item .fa-trash {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
    font-size: 20px;
    cursor: pointer !important;
}

.pager__page-item:not(.new-page) {cursor: grab;}

.letter-viewer .letter:not(.print) {
    width: 8in;
    background-color: white;
    padding-left: 1in;
    padding-right: 1in;
    padding-top: 1in;
    padding-bottom: 1in;
    margin-bottom: .5in;
    display: inline-block;
    height: fit-content;
	height: -moz-fit-content;
}

.letter-viewer .letter:not(.print) .pagebreak {
    background-color: unset;
    height: unset;
}

.insert-link .text {
    top: 35%;
}

.color-grid>*:not(.color-indicator) {
    background: linear-gradient(to right, #fff 0%,transparent 100%);
}

.color-grid>*:not(.color-indicator) {
	height: 100%;
	width: 100%;
	position: absolute;
	border-radius: 2px;
}

.to-white {
    background: linear-gradient(to bottom, transparent 0%, #000 100%) !important;
}

.insert-color {
	user-select:none;
	top: 50%;
	width: 200px;
	height: 310px;
	background-color: white;
	position: absolute;
	z-index: 4;
	left: 50%;
	transform: translate(-50%,-50%);
	border-radius: 5px;
}

.insert-color .output-color {
    width: 16px;
    height: 16px;
    background-color: green;
    border-radius: 100%;
}

.insert-color .label {
    padding-left: 12px;
    font-size: 12px;
    font-weight: lighter;
    color: #272727;
    margin-top: 12px;
}

.insert-color .color-output {
    height: 20px;
    margin-bottom: 28px;
    margin-top: 28px;
    display: flex;
    padding-left: 11px;
    position: relative;
}

.insert-color .color-output .label {
    margin-top: unset;
    line-height: 18px;
    padding-right: 10px;
    margin-left: unset;
    margin-right: unset;
    width: unset !important;
    margin-left: 20px;
}

.insert-color input {
    width: 50px;
}

.insert-color .color-grid {
    width: 90%;
    left: 5%;
    position: relative;
    height: 120px;
    border-radius: 4px;
    overflow: hidden;
    background-color: #ff0000;
}

.color-grid .color-indicator {
    position: absolute;
    z-index: 2;
}

.color-indicator {
	transform: translateY(-50%) translateX(-50%);
    height: 16px;
    position: relative;
    width: 16px;
    background-color: white;
    box-shadow: 0 0 7px #00000047;
    border-radius: 100%;
}

.color-grid .color-indicator{
	top:100%;
	left:0px;
}

.color-indicator .indicator {
    width: 12px;
    height: 12px;
	top:50%;
    background-color: #e91e1e;
    border-radius: 100%;
    left: 50%;
    transform: translate(-50%,-50%);
    position: absolute;
}

.insert-color .color-main {
    position: absolute;
    width: 89%;
    height: 12px;
    background-color: blue;
    border-radius: 11px;
    margin-top: 9px;
    left: 50%;
    transform: translateX(-50%);
    background: linear-gradient(to right, red 0%, #ff0 17%, lime 33%, cyan 50%, blue 66%, #f0f 83%, red 100%);
}

.insert-color .button {
    width: 50px;
    bottom: 17px;
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
}

.color-main .color-indicator {
    top: 50%;
}

.account-info:not(.item) {
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    width: 60%;
    margin-top: 18px;
    background-color: #ffffff47;
    box-shadow: 0 0 0px #0000000d;
    margin-bottom: 50px;
}

.account-info .info-item {
    padding-left: 65px;
    margin-top: 14px;
    box-shadow: 0px -1px 7px #00000040;
    border-radius: 4px;
    padding-top: 20px;
    padding-bottom: 30px;
}

.account-info .title {
    font-weight: bold;
    color: #464646;
    margin-bottom: 20px;
}

.account-info .item-block {}

.account-info .text-item {
    margin-top: 10px;
    margin-left: 10px;
}

.account-info .item-block .button {
    margin-top: 10px;
    margin-right: 40px;
}

.item-block.twofa {
}

.item-block.twofa .button.change {
    display: inline-block;
}

.account-info .header {
    font-size: 21px;
    margin-bottom: 51px;
}

.info-item.password .item-block {
    display: flex;
    justify-content: space-between;
}

.disabled-alert {
    color: #700000;
    font-size: 12px;
    margin-top: -10px;
}

.item-block.twofa {}

.item-line-item {
    display: flex;
    justify-content: space-between;
    width: 100%;
    margin-right: 48px;
    margin-bottom: 20px;
}

.info-item.contact .item-block {
    margin-right: 40px;
}

.search-sidebar.widen {
    width: 400px;
}

.advanced-more {
    position: absolute;
    bottom: 0px;
    height: 50px;
    width: 100%;
    background-color: white;
    box-shadow: 1px -4px 4px #00000012;
    overflow: hidden;
}

.advanced-info .advanced-item {
    display: flex;
    justify-content: space-between;
    padding-left: 25px;
    padding-right: 25px;
    margin-top: 11px;
}

.advanced-info .advanced-item .text {
    line-height: 21px;
}

.advanced-info {
    margin-top: 25px;
}

.notifications {
    position: fixed;
    bottom: 30px;
    right: 30px;
    width: 240px;
    height: auto;
    transition: all 200ms;
    z-index: 1301;
}

.notification {
    float: right;
    width: fit-content;
    padding-right: 30px;
    min-width: 100%;
    height: 50px;
    right: 0px;
    position: relative;
    background-color: #703af7;
    background: linear-gradient(45deg, #703af7, #187cd9);
    border-radius: 10px;
    display: flex;
    color: white;
    margin-top: 10px;
    transition: all 200ms;
    justify-content: left;
    align-items: center;
    box-shadow: 0 0 6px #0000003d;
}



.notifications .notification i.fa {
    margin-left: 20px;
    margin-right: 20px;
    font-size: 15px;
}

.notification>* {
    line-height: 49px !important;
    font-size: 12px;
    white-space: nowrap;
}

p {
    margin: unset;
}

.button.change-inv {
    width: 90px;
}

.change-dialog {
    height: 300px;
    width: 500px;
    position: fixed;
    left: 50%;
    transform: translate(-50%,-50%);
    top: 50%;
    background-color: white;
    box-shadow: 0 0 9px #00000033;
    border-radius: 3px;
    z-index: 4;
}

.change-dialog .button {
    position: absolute;
    bottom: 25px;
    left: 50%;
    transform: translateX(-50%);
}

.inventory-change .finish-list {
    margin-top: unset;
    bottom: 65px;
    position: absolute;
    width: 90%;
}

.padding-left {
    margin-top: 10px;
    margin-left: 40px;
}

.padding-left .text {
    margin-bottom: 6px;
}

.button {}

.button.finance-change {
    position: absolute;
    top: 17px;
    right: 30px;
}

.finance .report-tiles {
    margin-top: 30px;
}

.finance-change .padding-left {
    margin-top: 29px;
}

.commerce-items {
    width: 86%;
    left: 7%;
    height: auto;
    position: relative;
    display: flex;
    justify-content: space-evenly;
    margin-top: 30px;
    margin-top: 40px;
    flex-wrap: wrap;
}

.commerce-item {
    width: 125px;
    height: 200px;
    box-shadow: 0 0 6px #0000003b;
    border-radius: 5px;
    overflow: hidden;
    margin-bottom: 20px;
}

.commerce-item img {
    width: 100%;
    height: 100%;
    border: unset;
}

[point-set='installation-topbar'] .options {
    display: flex;
    justify-content: space-around;
    margin-top: 40px;
    flex-wrap: wrap;
    left: 50%;
    transform: translateX(-50%);
    position: relative;
    min-width: 450px;
    width: 500px;
}

[point-set='installation-topbar'] .options .option {
    position: relative;
    width: 200px;
    height: 80px;
    box-shadow: 0 0 7px #0000002e;
    border-radius: 6px;
    text-align: center;
    background-color: white;
    color: #3b3b3b;
    margin-bottom: 30px;
    cursor: pointer;
}

[point-set='installation-topbar'] .options .option i.fa {
    left: 50%;
    transform: translateX(-50%);
    position: absolute;
    margin-top: 16px;
}

[point-set='installation-topbar'] .option .name {
    position: absolute;
    bottom: 20px;
    width: 100%;
}

.payment-list {
    position: relative;
    left: 50%;
    transform: translateX(-50%);
    width: fit-content;
    margin-top: 30px;
}

.payment-item {
    width: 400px;
    height: 50px;
    padding-left: 20px;
    padding-right: 20px;
    background-color: white;
    color: #3b3b3b;
    margin-bottom: 10px;
    border-radius: 6px;
    box-shadow: 0 0 7px #0000004a;
}

.payment-item .exp {float: right;margin-right: 20px;}

.payment-item>* {
    display: inline-block;
    top: 50%;
    transform: translateY(-50%);
    position: relative;
}

.payment-item i.fa.fa-trash {
    float: right;
    cursor: pointer;
}

.payment-item .last-4 {
    margin-left: 20px;
}

.payment-item .new {
    float: right;
}

.payment-item.new {
    cursor: pointer;
}


/* */

form#payment-form {
    position: relative;
    top: 30%;
    width: 80%;
    transform: translate(-50%,-50%);
    left: 50%;
    padding: 20px;
    box-shadow: 0 0 4px #0000003b;
    border-radius: 6px;
}

#payment-form .button {
    position: relative;
    margin-top: 30px;
    left: 50%;
    transform: translateX(-50%);
    width: 200px;
}

div#card-errors {
    color: gray;
    margin-top: 10px;
    position: relative;
}

.StripeElement {
  box-sizing: border-box;

  height: 40px;

  padding: 10px 12px;

  border: 1px solid transparent;
  border-radius: 4px;
  background-color: white;

  box-shadow: 0 1px 3px 0 #e6ebf1;
  -webkit-transition: box-shadow 150ms ease;
  transition: box-shadow 150ms ease;
}

.StripeElement--focus {
  box-shadow: 0 1px 3px 0 #cfd7df;
}

.StripeElement--invalid {
  border-color: #fa755a;
}

.StripeElement--webkit-autofill {
  background-color: #fefde5 !important;
}


/* */

.key-list .key-item .private-key:hover {
    filter: unset;
}

.sub-status-modal {
    position: absolute;
    width: 500px;
    top: 43%;
    transform: translate(-50%,-50%);
    left: 50%;
    height: 300px;
    box-shadow: 0 0 7px #0000004a;
    overflow: hidden;
    border-radius: 6px;
}

.sub-status-modal .subhead {
    text-align: center;
    margin-top: 10px;
    color: #680000;
}

.sub-status-modal .desc-text {
    width: 90%;
    left: 5%;
    position: relative;
    margin-top: 20px;
    color: #3b3b3b;
    text-align: center;
}

.org-settings input {
    width: 170px;
    position: relative;
    left: 50%;
    transform: translateX(-50%);
    display: block;
    margin-bottom: 6px;
}

.org-settings input:first-of-type {
    margin-top: 20px;
}

.org-settings .desc-text {
    color: #232323;
    margin-top: 9px;
}

.legal {
    width: 90%;
    left: 5%;
    position: relative;
    margin-top: 10px;
    font-size: 11px;
}

.agree {
    display: flex;
    line-height: 22px;
    width: 120px;
    justify-content: space-evenly;
    left: 50%;
    transform: translateX(-50%);
    position: relative;
    margin-top: 20px;
}

.button.finish {
    position: absolute;
    bottom: 30px;
    left: 50%;
    transform: translateX(-50%);
}

.start-sub table {
    width: 90%;
    left: 5%;
    position: relative;
    margin-top: 20px;
}

.start-sub table th {padding-bottom: 8px;border-bottom: 1px solid #c3c3c3;color: #5c5c5c;}

.start-sub td {
    padding-top: 5px;
}

.start-sub td:nth-child(2) {
    text-align: right;
}

.button.advanced {
    position: absolute;
    bottom: 30px;
    left: 50%;
    transform: translateX(-50%);
}

.advanced-search {
    width: 75%;
    max-width: 1700px;
    min-width: 1000px;
    height: 80%;
    max-height: 1000px;
    min-height: 700px;
    position: fixed;
    left: 50%;
    top: calc(50% + 25px);
    transform: translate(-50%,-50%);
    background-color: white;
    box-shadow: 0 0 11px #0000004d;
    border-radius: 9px;
    z-index: 4;
    overflow: hidden;
}

.advanced-search .primary-info {
    width: 200px;
    top: calc(50% - 17px);
    transform: translateY(-50%);
    position: absolute;
}

.primary-info {}

.button.apply {
    position: absolute;
    bottom: 30px;
    left: 50%;
    transform: translateX(-50%);
}

.tags:not(.object-container) {
    width: 43%;
    margin-top: 65px;
    margin-left: 20px;
}

.extra-tags {
    width: 43%;
    margin-left: 20px;
    margin-top: 17px;
}

.sort {
    position: absolute;
    top: 65px;
    right: 20px;
    width: 43%;
}

.recent-series-item-large.nonactive {
    background-color: #21c2ff14;
}

.sort select {
    position: relative;
    left: 50%;
    transform: translateX(-50%);
    width: 50%;
}

.sort .header {
    margin-top: unset;
    padding-top: unset;
    margin-bottom: 10px;
}

.billing-settings {
    width: fit-content;
    width: -moz-fit-content;
    left: 50%;
    transform: translateX(-50%);
    position: relative;
    margin-top: 40px;
    padding: 20px;
    box-shadow: 0 0 4px #00000024;
    border-radius: 4px;
}

.billing-settings .info-item {
    margin-top: 10px;
    left: 50%;
    transform: translateX(-50%);
    position: relative;
    width: fit-content;
    width: -moz-fit-content;
}

.billing-settings .button.save {
    margin-top: 20px;
}

.next-bill {
    text-align: center;
    margin-top: 18%;
    width: 70%;
    left: 50%;
    transform: translateX(-50%);
    position: relative;
}

.payment-partner img {
    width: 83px;
}

.payment-partner {
    position: absolute;
    top: 20px;
    left: 26px;
    font-size: 20px;
}

.notification.error {
    /* background-color: red; */
    background: linear-gradient(45deg, rgb(129, 38, 38), #a64c4c);
}

.notification::after {content: " ";width: 100%;height: 2px;position: absolute;bottom: 0px;}

.transaction .fa-flag {
    color: #ffffff;
}

.transaction-view {
    position: fixed;
    width: 600px;
    height: 400px;
    background-color: white;
    left: 50%;
    transform: translate(-50%,-50%);
    z-index: 2;
    top: 50%;
    box-shadow: 0 0 9px #00000061;
    border-radius: 3px;
}

.transaction-view .timestamp {
    position: absolute;
    right: 20px;
    top: 10px;
    color: #2e2e2e;
}

.transaction-view .transaction-type {
    position: absolute;
    top: 10px;
    left: 20px;
    color: #2e2e2e;
}

.transaction:hover .fa-flag {
    display: none;
}

.transaction:not(:hover) .fa-flag{
    display: block;
    color: #e7a11f;
}

.transaction:not(:hover) .fa-check {
    display: none;
}

.transaction:hover .fa-check{
    display:inline-block;
}



.transaction .fa-check {color: #1dd71a;}

.logo {
    cursor: pointer;
    margin-right: 25px;
    margin-left: 25px;
    padding: 5px;
}

.topbar .logo img {
    height: 20px;
}
.sidebar-page.series-items>.main>.header {
    margin-bottom: 50px;
}

.recent-series-item-large i.fa.fa-clock {
    position: absolute;
    left: 50%;
    transform: translate(-50%,-50%);
    top: 50%;
    color: #ffffff94;
    mix-blend-mode: hard-light;
}

i.fa.fa-4x.fa-clock {}

.account-logo {
    width: 125px;
    cursor: pointer;
    height: 125px;
    left: 50%;
    transform: translateX(-50%);
    position: relative;
    margin-top: 25px;
    border-radius: 100%;
    margin-bottom: 10px;
}

.account-logo i.fa.fa-user {
    position: absolute;
    left: 50%;
    transform: translate(-50%,-50%);
    top: 50%;
    color: #2a2a2a;
}

.account-logo i.fa.fa-2x.fa-edit {
    position: absolute;
    color: white;
    left: 50%;
    transform: translate(-50%,-50%);
    top: 50%;
    width: 28px;
}

.account-logo i.fa.fa-2x.fa-edit {
    display: none;
}

.account-logo:hover .account-logo-circle {
    filter: blur(2px) brightness(0.5);
}

.account-logo-circle {
    width: 100%;
    height: 100%;
    background-color: white;
    border-radius: 100%;
    box-shadow: 0 0 7px #00000073;
}

.account-logo:hover i.fa.fa-2x.fa-edit {
    display: block;
}

div.warning {
    width: 80%;
    margin-top: 20px;
    height: 100px;
    margin: auto;
    margin-top: 30px;
    box-shadow: 0 0 6px #00000075;
    border-radius: 10px;
    background-color: #cf4545;
    position: relative;
    display: flex;
    justify-content: left;
    align-items: center;
}

.warning>i.fa {
    margin-left: 20px;
    color: white;
    margin-right: 20px;
}

.warning-body {
    margin-left: 26px;
    width: 64%;
    height: fit-content;
	height: -moz-fit-content;
    position: relative;
    color: white;
    font-size: 13px;
    text-align: initial;
}

.next.white {
    background-color: white;
    color: #2c88f0 !important;
}

.warning .next {
    position: absolute;
    right: 30px;
    left: unset;
    bottom: 50%;
    transform: translateY(50%);
}

.warning .next i {
    color: #cf4545;
}

.user-detail i.fa.fa-exclamation {
    position: relative;
    padding-right: 7px;
    padding-left: 10px;
    color: #cf4545;
}

.content-block {
    width: 500px;
    position: relative;
    margin: auto;
    margin-top: 50px;
    box-shadow: 0 0 6px #00000057;
    border-radius: 4px;
    padding-bottom: 25px;
    margin-bottom: 50px;
}

.content-block .header {
    text-align: left;
    margin-left: 30px;
}

.content-block p {
    margin-left: 31px;
    font-size: 12px;
    margin-top: 10px;
}

.content-block .button {
    margin-top: 17px;
    margin-left: 30px;
    display: inline-block;
}

.content-block.twofa {
}

.content-block .button.disable {
    background-color: #b32b2b;
}

.content-block.twofa .desc {
    display: inline-block;
    margin-left: 20px;
}

.sidebar.accounts {
    z-index: 1;
}

.access-item {
    height: 20px;
    position: relative;
    display: flex;
    margin-top: 5px;
    font-size: 14px;
    align-items: center;
    justify-content: left;
}

.content-block.access p {margin-bottom: 20px;}

.content-block.access .access, .dot {
    height: 10px;
    width: 10px;
    margin-left: 30px;
    background-color: #9e0000;
    border-radius: 100%;
}

.access-item>* {margin-left: 20px;}

.access.none {
    background-color: #b91111 !important;
}



.content-block.editable p {
    margin-bottom: 28px;
    text-align: center;
}

.label {
    display: inline-block;
    margin-left: 30px;
    width: 122px;
}

.content-block.editable i.fa.fa-pencil-alt, .content-block.editable i.fa.fa-check {
    position: absolute;
    right: 20px;
    top: 20px;
    cursor: pointer;
}

.content-block.editable i.fa.fa-check {
    color: green;
}

.content-block.notification-settings .finish-list {
    margin-top: 30px;
}

.content[page='assignments'] .finish-item .button {
    width: 110px;
    height: 17px;
    font-size: 13px;
    position: absolute;
    right: 16px;
    transform: translateY(-50%);
    top: 50%;
}

.letter-selector {
    position: absolute;
    width: 730px;
    height: 519px;
    left: 50%;
    top: 50%;
    transform: translate(-50%,-50%);
    background-color: white;
    box-shadow: 0 0 6px #00000075;
    z-index: 9;
    overflow: scroll;
    border-radius: 5px;
}

.letter-selector .header {margin-bottom: 20px;}

.letter-selector .letter {
    cursor: pointer;
}

.push-enable {
    width: 400px;
    height: 400px;
    background-color: white;
    z-index: 5;
    position: fixed;
    left: 50%;
    top: 50%;
    transform: translate(-50%,-50%);
    box-shadow: 0 0 8px #0000005e;
    border-radius: 6px;
}

.push-enable i.fa.fa-bell {
    position: relative;
    left: 50%;
    transform: translate(-50%,-50%);
    margin-top: 31%;
    font-size: 100px;
    color: #4892ff;
    text-shadow: 0px 2px 4px #00000057;
}

.push-enable .header {
    font-size: 19px;
    margin-top: -20px;
}

.button {
}

.push-enable .button.cancel {
    background-color: #b63e3e;
}

.push-enable .next {
    bottom: 40px;
}

.push-enable i.fa.fa-times {
    position: absolute;
    right: 30px;
    top: 19px;
    font-size: 21px;
    cursor: pointer;
}

.subscriptions, .settings .documents, .product-management .products, .donor-management .acknowledgement-tiers, .customer-settings .setting-types {
    margin-top: 30px;
    display: flex;
    flex-direction: column;
    justify-content: start;
    align-items: center;
    width: 90%;
    position: relative;
    flex-wrap: wrap;
    justify-content: center;
}

.subscription, .settings .document-type {
    width: 410px;
    height: 210px;
    background-color: white;
    box-shadow: 0 0 7px #0000004a;
    border-radius: 6px;
    position: relative;
    padding: 3px 21px;
    margin: 20px;
}

.subscriptions .subscription>.header,.document-type.header {
    font-size: 14px;
    margin-bottom: 2px;
    margin-top: 10px;
}

.subscription i.fa.fa-edit, .document-type i.fa.fa-edit {
}

div#subscription-series-items {}

div.subscription-list-item {
    font-size: 13px;
    font-weight: lighter;
}

.subhead {
    width: 100%;
    text-align: center;
    margin-top: 0;
    font-size: 13px;
}

.subscription .subhead,.document-type .subhead {
    margin-bottom: 10px;
}


.subscription .descriptor, .document-type .descriptor {
    font-size: 10px;
    margin-top: 7px;
    margin-left: 0px;
    position: absolute;
}

.subscription .finish-list, .document-type .finish-list {
    margin-top: 20px;
    font-size: 13px;
}

.edit-subscription .basic-info {
    padding-bottom: 30px;
    position: relative;
    width: 337px;
    height: fit-content;
	height: -moz-fit-content;
    display: inline-block;
}

.info-item {
    width: fit-content;
    left: 50%;
    position: relative;
    transform: translateX(-50%);
    margin-top: 10px;
}

.edit-subscription .header {
    margin-bottom: 20px;
}

input.sub-name, input.document-name {
}

.edit-subscription .series-info {
    height: fit-content;
	height: -moz-fit-content;
    width: 341px;
}

.topline {
    display: flex;
    align-items: baseline;
    margin-top: 40px;
    width: 90%;
    left: 50%;
    transform: translateX(-50%);
    position: relative;
    justify-content: space-around;
    border-bottom: 2px solid #ececec;
    flex-wrap: wrap;
}

.series-info .finish-list {
    margin-bottom: 15px;
}

.letter-list {
    width: 70%;
    height: fit-content;
	height: -moz-fit-content;
    padding-bottom: 40px;
    font-size: 14px;
    font-weight: lighter;
}

.assignment .assignment-data {margin-right: 6px;}

.assignment .button {
    width: 69px;
    padding: 5px;
    font-size: 10px;
    height: 14px;
    margin-left:20px;
}

.finish-item .assignment {
    display: flex;
    align-items: center;
    cursor: inherit;
}

.assignment .fa-search {
    cursor: pointer;
    color: #2d2d2d;
}

.edit-subscription .next {
}

.edit-subscription .button.save, .edit-document .button.save {
    position: fixed;
    right: 40px;
    top: 75px;
    z-index: 1;
}

.assignment i.fa.fa-times {
    margin-left: 15px;
    cursor: pointer;
}

.finish-item>.value .fa {margin-left: 20px;}

.edit-document .button.new {
    left: 50%;
    transform: translateX(-50%);
    position: relative;
    margin-top: 21px;
}

.field-editor {
    width: 500px;
    height: 300px;
    z-index: 4;
    background-color: white;
    position: absolute;
    left: 50%;
    transform: translate(-50%,-50%);
    top: 47%;
    border-radius: 6px;
}

.field-editor .finish-list {
    width: 90%;
    margin-top: 15px;
}

.field-editor .button {
    bottom: 30px;
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
}

.new-transaction .mini-subscription, .new-document .mini-document {
    width: 230px;
    padding-bottom: 20px;
    box-shadow: 0 0 7px #0000004a;
    border-radius: 6px;
    position: relative;
    margin: 10px;
    cursor: pointer;
    transition: all 200ms;
}

.new-transaction .mini-subscription .grouping {
    position: absolute;
    right: 10px;
    font-size: 9px;
    top: 5px;
}

.new-transaction .subscription-selection .container, .new-document .document-selection .container {
    display: flex;
    justify-content: center;
    margin-top: 16px;
    flex-wrap: wrap;
    width: 100%;
    left: 50%;
    transform: translateX(-50%);
    position: relative;
    padding-bottom: 30px;

}



.new-transaction .mini-subscription .header {
    margin-top: 3px;
}

.new-transaction .subscription-selection .title {
    text-align: center;
    margin-top: 13px;
    font-size: 13px;
    font-weight: lighter;
}

.new-transaction .mini-subscription:hover, .new-document .mini-document:hover {background-color: #3d84ff;color: white !important;}

.new-transaction .mini-subscription:hover *, .new-document .mini-document:hover * {
    color: white;
}

.new-transaction .subscription-selection .container:not(:last-of-type) {
    border-bottom: 1px solid #00000021;
}

.new-document .document-selection .container {
    width: 80%;
    max-height: 300px;
    top: 45%;
    transform: translate(-50%,-50%);
    position: absolute;
}

.new-document .main .finish-list.last {
    margin-bottom: 80px;
}

.new-document .next {
    position: fixed;
}

.new-document .mini-document:last-of-type {
    margin-bottom: 40px;
}

.product, .flow {
    margin: 21px;
    width: 330px;
    border-radius: 7px;
    position: relative;
    overflow: hidden;
    display: flex;
    align-items: center;
    flex-direction: column;
    justify-content: space-between;
    box-shadow: 0 0 4px #0000003d;
    padding: 20px 20px;
    height: 330px;
}

.products .product .header, .flows .flow .header {
    font-size: 10px;
    margin-left: 9px;
    margin-right: 10px;
    width: unset;
    height: 15px;
}

.product .product-image {
    width: fit-content;
    height: 180px;
    z-index: 0;
    display: flex;
    justify-content: center;
    border-radius: 4px;
    flex-shrink: 0;
    width: 230px;
    margin-right: unset;
    margin-top: 20px;
}



.product-image img, .system-image img {
    border-radius: 5px;
    overflow: hidden;
    object-fit: cover;
    height: 100%;
    /* box-shadow: 0 0 7px #0000003b; */
}

.product .price {
    font-size: 12px;
    bottom: 15px;
    position: absolute;
    margin-left: 15px;
}

.products .product .actions {
    bottom: 15px;
    position: absolute;
    right: 15px;
    display: flex;
    align-items: center;
}

.product .actions .fa {
    color: #323232;
}

.product .prod-id {
    position: absolute;
    left: 10px;
    top: 6px;
    font-size: 9px;
    font-weight: lighter;
}

.bottom-bar {
    height: 41px;
    position: absolute;
    width: 100%;
    left: 0px;
    bottom: 0px;
    background-color: white;
    display: flex;
    align-items: center;
}

.create-product, .edit-donor-tier, .edit-customer-setting, .create-series-item {
    width: 600px;
    height: 400px;
    background-color: white;
    z-index: 3;
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%,-50%);
    border-radius: 7px;
    overflow: hidden;
}

.create-product .product-image{
    width: 140px;
    margin-left: 40px;
}

.create-product .upload-bottom {
    margin-left: 30px;
    width: 150px;
}

.create-product .upload-bottom input {
    width: calc(100% - 20px);
    margin-top: 18px;
}

.create-product i.fa.fa-times {
    position: absolute;
    right: 25px;
    font-size: 19px;
    top: 15px;
    cursor: pointer;
}

.create-product .product-image::-webkit-scrollbar, .edit-series-item .product-image::-webkit-scrollbar {
  display: none;
}


.create-product .combine {
    top: 50%;
    transform: translateY(-50%);
    position: absolute;
}

.settings-group:last-of-type {
    margin-bottom: 100px;
}

.series-list {margin-top: 30px;display: flex;align-items: center;justify-content: center;flex-wrap: wrap;}





.descriptor {
    position: absolute;
    font-size: 10px;
    margin-top: 5px;
    margin-left: 11px;
}

.series .actions {
    width: fit-content;
    display: flex;
    position: absolute;
    top: 10px;
    right: 9px;
    flex-direction: column;
    font-size: 13px;
}

.series i.fa.fa-edit {
    cursor: pointer;
}

.subscription:last-of-type, .settings .document-type:last-of-type {
    margin-bottom: 100px;
}

.series-settings .finish-list {
    width: 80%;
    margin-top: 30px;
}

.edit-donor-tier .finish-list {
    margin-top: 30px;
}

.donor-management .acknowledge-tier, .customer-settings .setting-type {
    flex-direction: row;
    width: 400px;
    height: 40px;
    background-color: white;
    box-shadow: 0 0 7px #0000004a;
    border-radius: 4px;
    align-items: center;
    margin-bottom: 12px;
    display: flex;
    position: relative;
}

.acknowledge-tier>* {
    position: relative;
    margin-left: 30px;
}

.acknowledge-tier .acknowledge-amount {
    float: right;
    right: 87px;
    position: absolute;
}

.action-list {
    position: absolute;
    right: 0px;
    margin-right: 14px;
}

.action-list>* {
    margin-right: 5px;
    cursor: pointer;
}

.ack-generator {
    width: 500px;
    height: 300px;
    left: 50%;
    top: 50%;
    transform: translate(-50%,-50%);
    position: fixed;
    box-shadow: 0 0 5px #00000045;
    border-radius: 5px;
    z-index: 4;
    background-color: white;
}

.ack-generator .header {
    font-size: 14px;
    font-weight: normal;
}

.ack-generator .finish-list {
    margin-top: 20px;
}

.donor-management .container-item.link {
    margin: auto;
    text-align: center;
    margin-top: 30px;
    width: 200px;
}

.open-settings .finish-list {
    margin-top: 29px;
}

.open-settings .title {
    text-align: center;
    margin-top: 43px;
    font-weight: bold;
    color: #2e2e2e;
}

.content.open-settings .finish-list.sorting {
    margin-top: 24px;
}

.customer-settings .setting-type {
    width: 500px;
    display: flex;
    align-items: center;
    position: relative;
}

.setting-type>* {
    margin-left: 30px;
}

.setting-type .switch, .setting-type input {
    position: absolute;
    right: 90px;
}

.setting-type {}

.setting-type:first-of-type {
    margin-top: 40px;
}

.ack-generator input {
    width: 140px;
}

.edit-customer-setting .finish-list {
    margin-top: 30px;
}

.advanced-search .filters.finish-list {
    margin-top: 10px;
    width: 100%;
}

.advanced-search .title, .category-header .title {
    text-align: center;
    font-weight: lighter;
    display: flex;
    justify-content: space-around;
    width: 100%;
    margin: auto;
    border-bottom: 1px dotted #3f3f3f;
    padding-bottom: 5px;
}

.advanced-search .filter-block:first-of-type {
    margin-top: 64px;
}

.title {}

.advanced-search .title .fa-plus, .category-header .title .fa-plus {
    cursor: pointer;
}

.advanced-search .title>div, .category-header .title>div {
    min-width: 200px;
    text-align: left;
}

.advanced-search .content.main {
}

.advanced-search .filter-block, .category-header {
    box-shadow: 0 0 5px #00000030;
    padding: 5px 4px;
    width: 70%;
    margin: auto;
    margin-top: 2px;
    margin-bottom: 0px;
    border-radius: 6px;
}

.advanced-search .main .header {
    margin-bottom: 40px;
}

.white-back {
    width: 100%;
    height: 12%;
    bottom: 0px;
    position: fixed;
    background-color: white;
    left: 0px;
    z-index: 2;
    box-shadow: 0 0 8px #0000001a;
    display: flex;
    flex-direction: row;
    align-items: center;
    padding-bottom: 0px;
}

.advanced-search .main .container {
    height: 84%;
    overflow-y: scroll;
    position: relative;
    width: 100%;
    z-index: 4;
}

.advanced-search .subhead {
    font-weight: lighter;
}

.advanced-search .content:not(.main) .finish-list, .new-mailing .segment-filter-list .finish-list {
    margin-top: 22px;
    width: 82%;
    user-select: none; -webkit-user-select: none;
}

.advanced-search .content:not(.main) .finish-item:hover, .new-mailing .segment-filter-list .finish-item:hover {
    cursor: pointer;
    border-radius: 5px;
}

.advanced-search i.fa.fa-check, .new-mailing .segment-filter-list i.fa.fa-check {
    color: #009c0d;
}

.advanced-search .content:not(.main) .finish-item:hover .fa, .new-mailing .segment-filter-list .finish-item:hover .fa {
}

.advanced-search .search, .new-mailing .search {
    position: absolute;
    display: flex;
    align-items: center;
    width: 200px;
    justify-content: space-evenly;
    right: 20px;
    top: 72px;
}

.advanced-filter-info {
    position: absolute;
    bottom: 73px;
    text-align: center;
    width: 100%;
    font-size: 12px;
    font-weight: lighter;
}

.customer-list i.fa.fa-file-export {
    position: relative;
}

.customer-list .action-list {
    right: 40px;
    top: 19px;
}

.customer-list .action-list .fa {
    font-size: 20px;
    cursor: pointer;
    color: #2260eb;
}

.search-sidebar .action-block {
    position: absolute;
    font-size: 14px;
    right: 10px;
    top: 10px;
    cursor: pointer;
    display: flex;
    width: 46px;
    justify-content: space-around;
}

.search-sidebar .header {
    margin-top: 10px;
}

.customer-list .subhead {
    position: absolute;
    font-size: 10px;
    margin-top: 3px;
}

.transaction-preview {
    width: 80%;
    height: 250px;
    position: fixed;
    left: 50%;
    transform: translateX(-50%);
    border-radius: 4px;
    background-color: white;
}

.transaction-preview .transaction-desc {
    font-size: 12px;
    margin-top: 6px;
    margin-left: 8px;
    position: absolute;
}

.transaction-preview .absolute-typing {
    position: absolute;
    right: 10px;
    font-size: 12px;
}

.transaction-preview .transaction-type-desc {
    width: fit-content;
    text-align: center;
    margin-top: 25px;
    position: relative;
    left: 50%;
    transform: translateX(-50%);
}

.transaction-preview .subhead {
    font-size: 10px;
    font-weight: lighter;
    margin-top: 2px;
}

.transaction-amount {
    position: absolute;
    font-size: 12px;
    font-weight: lighter;
    left: 8px;
    top: 22px;
    display: flex;
    color: #232323;
    align-items: center;
}

.transaction-tag-data {
    position: absolute;
    right: 9px;
    display: flex;
    top: 7px;
    font-size: 12px;
}

.transaction-tag-data>* {
    color: #0054bc;
    cursor: pointer;
    margin-left: 9px;
}

.transaction-amount .fa {
    font-size: 10px;
    margin-left: 5px;
}

.transaction-preview .finish-list {
    font-size: 12px;
    font-weight: lighter;
    width: 78%;
}

.transaction-preview .finish-item .fa {
    color: #0054bc;
}

.transaction-preview .finish-item {
    padding: 3px 6px 3px 6px;
}

.transaction-preview .custom-data {
    position: absolute;
    display: flex;
    flex-direction: column;
    width: 100%;
    left: 50%;
    transform: translateX(-50%);
    height: 78px;
    border-top: 1px solid #e5e5e5;
    padding-top: 7px;
    padding-bottom: 7px;
    bottom: 0px;
    overflow-x: scroll;
}

.transaction-preview .custom-data .data {
    font-weight: lighter;
    margin-top: 20px;
}

.finish-content .transaction-preview {
    margin-top: 40px;
}

.donation-data .finish-list {
    width: 90%;
    margin-top: 30px;
}


.series-info .period-series-items {
    width: 50px;
}

.transaction .item.amount {
    margin-left: 10px;
    font-weight: lighter;
    min-width: 80px;
}

.item.transaction-time {
    right: 10px;
    position: absolute;
    padding-right: 10px;
}

.item.receipt {
    margin-left: calc(10% - 75px);
    height: 100%;
    white-space: pre-wrap;
    max-width: 34%;
    font-size: 11px;
}

.item.type {
    min-width: 180px;
}

.transaction .transaction-tag-data {
    transform: scale(.7);
    transform-origin: right;
    right: 20px;
    top: 4px;
}

.customer.last {
    margin-bottom: 50px;
}

.advanced-search li .value input {
    width: 140px;
    text-align: left;
    padding-right: 19px;
}

.edit-document .basic-info {
    width: 300px;
}

.log .item.time {
    position: absolute;
    right: 0px;
    padding-right: 25px;
}

.log .item.action {
    min-width: 105px;
}

.campaign-bar .bar-item:hover {
    background-color: #dfdfdf;
}

.campaign-bar .bar-item:first-of-type {
    border-left: 1px solid #d6d6d6;
}

.campaign-bar .bar-item.open {
    background-color: #2c88f0;
    color: white;
}

.campaign-topbar i.fa.fa-cog {
    position: absolute;
    right: 25px;
    cursor: pointer;
}

.topbar .display-item {
    cursor: inherit;
}

.campaign-card .topbar, .white.topbar {
    position: relative;
    background-color: white;
    z-index: 3;
}

.campaign-card .topbar>*, .topbar.white>* {
    color: #383838;
}

.campaign-topbar .campaign-name {
    margin-left: 57px;
    font-weight: 500;
    text-overflow: ellipsis;
    overflow: hidden;
}

.campaign-settings {}

.campaign-topbar i.fa.fa-cog {
    position: absolute;
    right: 25px;
    cursor: pointer;
}

.topbar .display-item {
    cursor: inherit;
    padding-right: 30px;
    margin-right: 33px;
    margin-left: 15px;
    border-right: 1px solid #00000021;
}

.campaign-page {
    position: absolute;
    width: 100%;
    height: calc(100% - 50px);
    background-color: #f6f6f6;
    overflow: scroll;
    overflow-x: hidden;
}

.campaign-page.settings .finish-list {
    width: 450px;
    margin-top: 20px;
}

.finish-item>.button {
    text-align: center;
    display: block;
}

.campaign-page.settings .button.save {
    position: relative;
    margin: auto;
    margin-top: 40px;
}

.campaign-page .items, .items.campaign-wide-items.items, .demon-wide-items.items {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    margin-top: 33px;
}

.campaign-page .items>.item, .campaign-wide-items.items>.item, .demon-wide-items>.item {
    width: 300px;
    height: 200px;
    background-color: white;
    box-shadow: 0 0 7px #0000002e;
    border-radius: 5px;
}

.campaign-page .line-item, .campaign-wide-items.items .line-item, .demon-wide-items.items .line-item {
    height: 70px !important;
    display: flex;
    align-items: center;
    padding: 0px 22px;
    color: #3b3b3b;
    position: relative;
    margin-bottom: 20px;
    cursor: pointer;
}

.items .item.line-item>.fa {
    font-size: 22px;
}

.items .line-item>* {
    margin-right: 10px;
}

.line-item>.continue, .campaign-wide-items.items .line-item>.continue,.demon-wide-items.items .line-item>.continue  {
    position: absolute;
    right: 20px;
    display: flex;
    align-items: center;
}

.items .line-item>.continue>.fa {
    cursor: pointer;
}

.items .line-item>.continue>* {
    margin-left: 12px;
}

.campaign-page .item .button {
    width: 90px;
    margin-right: unset;
    right: 22px;
    position: absolute;
    padding: 5px;
}

.log i.fa {
    margin-right: 10px;
}

.log .fa-link {
    margin-left: 10px;
}

.product-selection .itemlist, .add-manual-history-items .itemlist {
    position: absolute;
    top: 75px;
}

.itemlist .item>.item-display, .product-container .item>.item-display {
    box-shadow: 0 0 5px #00000047;
    width: 100%;
    height: 100%;
    border-radius: 4px;
    background-color: white;
    position: relative;
    display: flex;
    flex-direction: row;
    justify-content: center;
    transition: all 200ms;
    overflow: hidden;
}

.itemlist .item:last-of-type,.product-container .item:last-of-type {padding-right: 40px;}

.itemlist .logo {
    position: fixed;
    top: 12px;
    left: 12px;
    color: #3b3b3b;
    font-size: 12px;
    margin: unset;
}

.itemlist .contents {
    display: flex;
    height: calc(100% - 20px);
    align-items: start;
    justify-content: left;
    overflow-y: hidden;
    overflow-x: scroll;
    position: absolute;
    top: 0;
    left: 0;
    width: -webkit-fill-available;
    padding-left: 40px;
    padding-top: 0px;
    padding-right: 40px;
    width: -moz-available;
}

.itemlist i.icon.fa.fa-shopping-cart {
    color: #3b3b3b63;
    position: absolute;
    top: 11px;
    left: 13px;
    font-size: 10px;
}

.itemlist .contents .item-image-container:hover .item-name, .product-container .item-image-container:hover .item-name {
    position: absolute;
    z-index: 2;
    color: white;
    text-align: center;
    margin-top: 5px;
    left: 50%;
    transform: translateX(-50%);
    font-size: 11px;
    width: 95%;
}

.itemlist .item:hover .item-display {
}

.itemlist .contents .item-image-container:not(:hover) .item-name,.product-container .item .item-image-container:not(:hover) .item-name {
    display: none;
}

.mod-transaction .main>.actions {
    position: absolute;
    font-size: 11px;
    top: 25px;
    right: 30px;
}

.itemlist .item .actions, .product-container .item .actions {
    position: absolute;
    width: 100%;
    height: calc(100% - (63% + 20px));
    justify-content: space-evenly;
    align-items: center;
    display: flex;
    bottom: 0;
    color: #3b3b3b;
    z-index: 2;
    background-color: white;
}

.itemlist .item .actions>*, .product-container .item .actions>* {
    margin: unset;
}

.itemlist .actions .fa-plus,.itemlist .actions .fa-minus {
    cursor: pointer;
    color: inherit;
}

.itemlist .item:hover .actions {
}

.itemlist .item .item-display .item-image-container, .product-container .item .item-display .item-image-container {
    height: 63%;
    width: 100%;
    transition: 200ms;
    position: relative;
    display: flex;
    justify-content: center;
    padding-top: 10px;
    padding-bottom: 10px;
    overflow: hidden;
}

.itemlist .item-image-container:hover, .product-container .item-image-container:hover {
    background-color: #545454;
    z-index: 2;
    box-shadow: inset 0 0 20px #00000054;
}

.itemlist .item-image-container:hover img, .product-container .item-image-container:hover img {
    filter: brightness(0.4);
    transform: scale(1.25) translate(0,0%);
}

.itemlist .actions .count, .product-container .actions .count {
    cursor: default;
    user-select: text;
}

.itemlist .item-image-container:hover i.fa.fa-trash {
    position: absolute;
    bottom: 10px;
    color: white;
    z-index: 2;
    font-size: 14px;
    cursor: pointer;
    display: block;
}

.itemlist>.actions {
    display: flex;
    position: absolute;
    right: 13px;
    top: 11px;
    flex-direction: row-reverse;
    color: #3b3b3b;
    font-size: 12px;
    z-index: 2;
}

.itemlist>.actions>* {margin-left: 13px;}

.itemlist .item-image-container i.fa.fa-trash {
    display: none;
}

.category-header {
    box-shadow: unset;
    cursor: pointer;
    width: 90%;
}

.new-transaction .category-header:first-of-type {
    margin-top: 30px;
}

.new-transaction .product-listings .subhead, .add-manual-history-items .product-listings .subhead {
    margin-bottom: 15px;
}

.category-header .category {
    margin-top: 15px;
    display: flex;
    justify-content: top;
    flex-wrap: nowrap;
    flex-direction: column;
    align-items: center;
}

.product-item {
    width: auto;
    max-width: 130px;
    height: 150px;
    box-shadow: 0 0 5px #0000004f;
    border-radius: 6px;
    overflow: hidden;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-right: 15px;
    margin-bottom: 15px;
    margin-left: 15px;
}

.product-item img {
    height: 100%;
    position: relative;
    transition: all 200ms;
    border-radius: 6px;
}

.product-item .product-name {
    position: absolute;
    z-index: 2;
    color: white;
    text-align: center;
    transform: translateY(-50%);
    display: none;
    transition: all 200ms;
}

.product-item:hover .product-name {
    display: block;
}

.product-item:hover img {
    filter: brightness(0.5);
}

.category-header:last-of-type {
    margin-bottom: 50px;
}

.product-item i.fa.fa-check {
    position: absolute;
    color: #50ff50;
    z-index: 2;
    font-size: 34px;
}

.product-item:hover  i.fa.fa-check {
    margin-top: 26px;
}

.item.receipt .product-item {
    height: 80%;
    margin: unset;
    border-radius: 3px;
    margin-right: 9px;
}

.item.receipt .product-item img {
    border-radius: 3px;
}

.advanced-search .filter-block {
    margin-top: 20px;
    margin-bottom: 20px;
}

.transaction-preview .product-item {
    height: 100%;
    width: fit-content;
    flex-shrink: 0;
    margin: unset;
    padding-left: 10px;
    padding-right: 10px;
    box-shadow: unset;
}

.series .actions>* {
    margin-bottom: 10px;
}

.transaction-tag-data .fas {
    transform: translateY(10%);
}

.recent-series-item-large .actions>* {
    margin-left: 5px;
    color: #3b3b3b;
}

.recent-series-item-large .actions>* {
    color: #3b3b3b;
    margin-left: 15px;
}

.recent-series-item-large .ordered-number {
    position: absolute;
    right: 10px;
    top: 6px;
    color: #3b3b3b;
}

left {
}

.series-settings .naming-scheme {
    padding: 10px;
    width: 300px;
    height: 35px;
    box-shadow: 0 0 7px #00000045;
    border-radius: 4px;
    text-align: left;
    font-size: 10px;
    overflow-y: scroll;
}

.series-settings .finish-item.large {
    height: 57px;
}

.button.save {
    position: relative;
    margin: auto;
    margin-top: 20px;
}

.series-exports .finish-list {
    width: 70%;
    margin-top: 30px;
}

.order-fill .itemlist {
    width: 500px;
    margin: unset;
    z-index: 0;
    position: relative;
    margin: auto;
}

.pager-position {
    position: absolute;
    display: flex;
    top: 20px;
    left: 50%;
    transform: translateX(-50%);
}

.pager-position>div {
    width: 10px;
    height: 10px;
    border-radius: 10px;
    background-color: white;
    margin-right: 5px;
    margin-left: 5px;
    cursor: pointer;
    box-shadow: 0 0 3px 1px #0000005e;
    transition: all 200ms;
}

.active {}

.pager-position>div.active {
    background-color: #008c00;
}

.order-fill .transaction-preview {
    left: unset;
    width: 450px;
    transform: scale(.35);
    right: 0px;
    transform-origin: top right;
    margin-top: 15px;
    margin-right: 15px;
    transition: all 200ms;
    border-radius: 10px;
    z-index: 2;
}

.order-fill .transaction-preview:hover {
    transform: scale(.8);
    border-radius: 5px;
}

.order-fill .content .subhead {
    margin-bottom: 60px;
}

.order-fill .itemlist-title {
    width: 500px;
    margin: auto;
    margin-bottom: 7px;
    font-weight: lighter;
    font-size: 11px;
}

.order-fill .letters .letter-list {
    margin: auto;
    border-top: 1px solid #00000026;
}

.letter-fill-item {
    width: -webkit-fill-available;
    height: 50px;
    padding: 0px 13px;
    display: flex;
    align-items: center;
    box-shadow: 0 0 5px #0000004d;
    border-radius: 5px;
}

.order-fill .letter-fill-item>* {
    margin-left: 6px;
}

.order-fill .letter-fill-item>i {margin-left: 16px;}

.order-fill .letter-list table {
    width: 100%;
    padding-top: 10px;
}

.order-fill table tr i {
    margin-right: 7px;
}

.order-fill .letters table tr:not(:first-of-type) {height: 30px;background-color: #0000000a;}

.order-fill .letters table tr:first-of-type {
    height: 26px;
    text-align: left;
}

.order-fill .letter-list .header {
    text-align: center;
}

.order-fill .letters table tr:not(:first-of-type) td {
    padding: 0px 10px;
    position: relative;
}

.order-fill .letters .letter-list .throbber {
}

.order-fill .letter-list .load-throbber {
    transform: scale(.4) translate(-50%,-50%);
    transform-origin: 0 0;
    position: absolute;
    top: 50%;
    left: 50%;
}

.order-fill .note {
    width: 500px;
    margin: auto;
    margin-top: 40px;
}

.order-fill .note .subhead {
    margin-bottom: 20px;
}

.order-fill .customer-tag {
    display: flex;
    position: absolute;
    top: 20px;
    left: 20px;
    cursor: pointer;
    align-items: center;
}

.order-fill .customer-tag>* {
    margin-right: 9px;
}

.section-title i.fa.fa-plus {
    position: absolute;
    right: 40px;
    cursor: pointer;
}

.section-title.line-title {
    position: relative;
    border-bottom: 1px solid #0000002e;
    padding-bottom: 4px;
}

.letter-list .finish-item .text .fa-trash {
    margin-right: 5px;
    color: #3b3b3b;
    font-size: 10px;
    cursor: pointer;
}

.edit-subscription .letter-list .finish-item .text {
    min-width: 200px;
}

.edit-subscription .letter-list {
    width: 90%;
}

.mailing-labels .letter-list {
    margin: auto;
    margin-top: 46px;
}

div#print-letter-list-header {}

.product-listings .series {
    margin-bottom: 25px;
}

.merge-letter-content>.content {
    width: 8.5in;
    height: 11in;
    margin: auto;
    margin-bottom: 70px;
    margin-right: 20px;
    margin-left: 20px;
    overflow-wrap: break-word;
}

.setting-item .size-container {
    display: flex;
}

.setting-item .size-container input {
    width: 33px;
    padding-right: 10px;
    margin-right: 8px;
}

.merge-content-main {
    position: absolute;
    top: 66px;
    left: 175px;
    width: calc(100% - 175px);
    overflow-x: scroll;
}

.letter-viewer .letter:after {
    content: '';
    position: absolute;
}

.product-container {width: -webkit-fill-available;}

.product-container, .add-manual-history-items .product-container {
    margin-left: 20px;
    margin-right: 20px;
    display: flex;
    flex-direction: row;
    justify-content: center;
    flex-wrap: wrap;
    margin-top: 30px;
    margin-bottom: 30px;
}

.new-transaction .product-container .item, .add-manual-history-items .product-container .item {
    padding: 10px;
}

.product-container i.fa.fa-times {
    color: #902323;
    font-size: 20px;
}

.product-container i.fa.fa-plus {
    color: #3b3b3b;
    font-size: 20px;
}

.open-product-history .product-container {
    display: flex;
    justify-content: center;
    transform-origin: 0 0;
    width: 500px;
    margin: auto;
    margin-top: 50px;
    flex-wrap: wrap;
}

.open-product-history .product-container .item {
    padding: 15px;
}

.completion-frame iframe {
    width: 100%;
    height: 100%;
    border: unset;
}

.add-manual-history-items {
    /* display: none; */
}

.add-manual-history-items .button.complete {
    position: absolute;
    bottom: 25px;
    left: 50%;
    transform: translateX(-50%);
}

.series .header {
    margin: 0px 34px;
    padding-top: 25px;
    left: 50%;
    font-size: 12px;
    transform: translateX(-50%);
    margin-left: 0px;
    position: relative;
}

.new-mailing {
    position: fixed;
    width: 520px;
    height: 420px;
    background-color: white;
    border-radius: 3px;
    box-shadow: 0 0 7px #00000042;
    z-index: 3;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
    overflow: hidden;
    transition: all 400ms;
}

.new-mailing .finish-list {
    margin-top: 25px;
}

.new-mailing .email-setup .campaign-wide-items.items {
    margin-top: 35px;
    flex-direction: column;
}

.new-mailing .campaign-wide-items.items {
    margin: auto;
    margin-top: 10px;
    flex-direction: column;
    align-items:center;
    justify-content:center;
    width:fit-content;
}


.next.disabled {
    background-color: #bdbdbd;
}

.button.disabled {
    background-color: #bdbdbd;
}

.new-mailing .population-descriptor {
    font-size: 10px;
    margin-right: 16px;
}

.new-mailing .complete.true {
    margin-right: 20px;
    color: #00b400;
}

.new-mailing .complete {
    margin-right: 20px;
    color: #8e0e0e;
    transition: all 100ms;
}

.new-mailing .complete.true .fa-check {display: block;}

.new-mailing .complete:not(.true) .fa-check {
    display: none;
}

.new-mailing .complete.true .fa-exclamation {
    display: none;
}

.new-mailing .complete:not(.true) .fa-exclamation {
    display: block;
}

.variables {
    position: relative;
    width: 420px;
    height: 400px;
    margin-right: 30px;
    margin-left: 90px;
    background-color: white;
    z-index: 4;
    box-shadow: 0 0 10px 0px #0000004d;
    border-radius: 6px;
    overflow: scroll;
}

.letter-viewer-modal .variables .finish-list {
    font-size: 11px;
}

.letter-viewer-modal .cover {
    width: 100%;
    height: 100%;
    position: absolute;
    background-color: #00000052;
    z-index: 3;
    box-shadow: 0 0 15px transparent;
    border-radius: 3px;
}

.letter-viewer-modal .cmd-bar .fa-bug {
    color: #3b3b3b;
    cursor: pointer;
}

.letter-viewer-modal.debug {
    position: absolute;
    height: 400px;
}

.new-mailing .email-setup .campaign-wide-items.items {
    margin-top: 35px;
}

.email-setup .letter-descriptor {
    margin-right: 20px;
}

.new-mailing .section-title {
    width: 100%;
    padding: unset;
    text-align: center;
    margin-left: 30px;
}

.new-mailing .segment i.fa.fa-plus {
    position: absolute;
    top: 26px;
    right: 35px;
    cursor: pointer;
}

.new-mailing .segment-filters .campaign-wide-items {
    margin-top: 40px;
}

.segment-filters .item .continue .selected {
    margin-right: 12px;
    font-size: 10px;
    transform: translateY(-1px);
}

.new-mailing .finish-list[aggregate], .new-mailing .finish-list[email],.new-mailing .finish-list[export] {
    margin-top: 0px;
    border-top: 1px solid #ececec8f;
    padding-top: unset;
}

.new-mailing .search {
    top: 56px;
}

.new-mailing .mailing-desc {
    font-size: 10px;
}

.new-mailing .segment .finish-list {
    width: 93%;
    margin-bottom: 30px;
}

.new-mailing .segment-filter-list .finish-list {
    width: 90%;
}

.new-mailing .letter:hover {
    color: #3b3b3b;
    background-color: #f9f9f9;
    cursor: pointer;
}

.new-mailing .letter.selected {
    background-color: #2e78ff;
    color: white;
}

.new-mailing .letter.selected:hover {
    background-color: #2e78ff;
    color: white;
}

span.brace {
    color: #3876ff;
    padding-left: 0px;
    padding-right: 0px;
    font-size: inherit;
    background-color: #e6e6e6;
    border-radius: 2px;
}

[scheduled-time] input {
    width: 88px;
    margin-left: 10px;
}

.content.mailings .mailing-stats {
    position: absolute;
    font-size: 8px;
    top: 11px;
    left: 23px;
    display: flex;
    color: #3b3b3b;
}

.content.mailings .mailing-stats>* {
    margin-right: 6px;
}

.mailings .mailing-stats .fa {
    margin-right: 4px;
}

.customer-list>.actions {
    display: flex;
    flex-direction: column;
    position: fixed;
    right: 35px;
    margin-top: 5px;
    z-index: 5;
    font-size: 20px;
}

.field-export {
    position: fixed;
    width: 600px;
    height: 500px;
    background-color: white;
    z-index: 3;
    top: 50%;
    transform: translate(-50%,-50%);
    left: 50%;
    border-radius: 6px;
    box-shadow: 0 0 6px #00000057;
    overflow: hidden;
}

.field-export .field-list {
    width: 90%;
    padding: 0px 30px;
    margin-top: 20px;
    height: calc(100% - 155px);
    overflow: scroll;
}

.field-export .fa-list, .field-export .fa-plus {
    margin-right: 15px;
}

.field-export .model-desc {
    position: absolute;
    top: 10px;
    right: 18px;
    font-size: 10px;
}

.field-export .finish-item:not([new]) .text {
    cursor: grab;
}

.field-export [new] {
    cursor: pointer;
    justify-content: center;
}

.field-export .finish-item:last-of-type {
    margin-bottom: 30px;
}

.field-export .finish-item {
    user-select: none; -webkit-user-select: none;
}

.field-export .continue-export {
    width: 100%;
    height: 79px;
    box-shadow: 0 0 5px #00000054;
}

.field-export .finish .button {
    position: absolute;
    bottom: 35px;
    left: 50%;
    transform: translateX(-50%);
}

.field-export .finish .finish-list {
    margin-top: 20px;
}

.edit-product .left-content {}

.dual-content {
    display: flex;
    justify-content: space-around;
}

.field-editor {
    position: absolute;
    z-index: 3;
    width: 400px;
    height: 300px;
    left: 50%;
}

.custom-field-editor {
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%,-50%);
    width: 500px;
    height: 343px;
    background-color: white;
    box-shadow: 0 0 6px #0000004d;
    z-index: 3;
    border-radius: 5px;
    overflow: hidden;
}

.custom-field-editor .finish-list {
    margin-top: 25px;
}

.custom-field-editor .custom-field-preview {
    width: 100%;
}

.finish-list.select-options .finish-item {
    justify-content: space-between;
    width: 65%;
    left: 50%;
    transform: translateX(-50%);
}

.custom-field-editor .select-options {
    margin-top: 10px;
}

.dropdown {
}

.finish-list.select-options {
    height: 135px;
    overflow: scroll;
}

.section-title {
    display: flex;
}

.preview .finish-list .finish-item {
    background-color: #ffffff;
    border-radius: 5px;
    border: 1px solid #0000003b;
    width: 61%;
    top: 40%;
    left: 50%;
    transform: translateX(-50%);
}

.preview .finish-list {
    margin-top: 85px;
}


.product-management .products {
    flex-direction: row;
    margin: auto;
    margin-bottom: 30px;
    margin-top: 30px;
    flex-wrap: wrap;
}

.product .content.secondary {
}


.product .finish-list, .flow .finish-list, .document .finish-list {
    margin-top: 10px;
    font-size: 11px;
}

.finish-item input {}

.finish-item select {
    font-size: inherit;
}

.product .fa.fa-arrow-left.back {
    font-size: 15px;
    top: 14px;
    left: 16px;
}


.product-detail .finish-list {
    width: 80%;
    margin-top: 171px;
    font-size: 12px;
}

.product-detail .product-image {}

.products-small-list {
    transform: scale(.6) translateX(-50%);
    transform-origin: 0 0;
    position: absolute;
    left: 50%;
    margin-top: 17px;
}

.edit-api-key .scopes .finish-list {
    margin-bottom: 30px;
}

.button.add {}

.itemlist .contents .item-image-container:hover .item-name {
    width: 95%;
}

.create-series {
    width: 500px;
    height: 330px;
    background-color: white;
    position: fixed;
    top: calc(50%);
    left: 50%;
    transform: translate(-50%,-50%);
    box-shadow: 0 0 9px #00000040;
    border-radius: 6px;
    z-index: 3;
    overflow: hidden;
}

.create-series .main .finish-list {
    margin-top: 20px;
}

.item.receipt .product-item:first-of-type {
    margin-left: 5px;
}

/* */

.subscription-editor {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
    width: 600px;
    height: 460px;
    background-color: white;
    z-index: 3;
    box-shadow: 0 0 9px #00000030;
    border-radius: 5px;
    overflow: hidden;
}

.subscription-editor .finish-list.basic {
    margin-top: 15px;
}

.subscription-editor .export-definition {
    margin-top: 15px;
}

.export-definition.series-definition {}

.subscription-editor .export-definition .finish-list {
    margin-top: 0px;
}

.subscription-editor .finish-list.series-select {
}

.subscription-editor .finish-list.series-options {
    width: 80%;
}

.subscription-editor .title {
    text-align: center;
}

.subscription-editor .series-options .finish-item {
    padding-top: 8px;
    padding-bottom: 8px;
}

.subscription-editor .letter-list {
    width: 95%;
    margin-top: 30px;
    left: 50%;
    transform: translateX(-50%);
    position: relative;
}

.subscription-editor .letter-list .finish-item .text {
    min-width: 145px;
}

.subscription-editor .series-list {
    border-bottom: unset;
    margin-top: 40px;
}

.edit-subscription .letter-list {
    padding: 0px 2.5%;
    height: 67%;
    overflow: scroll;
    box-shadow: inset 0 0 4px #00000045;
}

.activate-series-item .ordered-number {
    position: absolute;
    z-index: 2;
    color: #3b3b3b;
    right: 14px;
    top: 10px;
    display: flex;
}

.ordered-number .ord {
    margin-right: 5px;
}

.demondms-pref .demon-wide-items.items {
    margin-top: 10px;
}

.demon-large-item {
    width: auto;
    max-width: 770px;
    min-height: 200px;
    margin: 0px 65px;
    margin-left: auto;
    margin-right: auto;
    background-color: white;
    box-shadow: 0 0 6px #00000029;
    border-radius: 5px;
    position: relative;
    margin-bottom: 30px;
    overflow: hidden;
}

h2 {
    font-size: 20px;
    font-weight: lighter;
    color: #3b3b3b;
    margin-left: 30px;
    margin-top: 20;
    margin-top: 20px;
}

h1,h2,h3,h4,h5,h6 {
    font-weight: lighter;
    color: #3b3b3b;
    margin-left: 30px;
}

.demon-large-item h1 {
    top: 80px;
    margin-right: 50px;
}

p {
    font-weight: lighter;
}

p.explanation {
    margin-left: 30px;
    color: #7b7b7b;
    max-width: 90%;
}

.demon-large-item:first-of-type {
    margin-top: 0px;
}

.demon-large-item.credits {
    margin-top: 0px;
}

.charge-table {
    left: 50%;
    transform: translateX(-50%);
    position: relative;
    color: #3b3b3b;
    margin-top: 20px;
    margin-bottom: 10px;
}

.charge-table .finish-item.category .value {
    font-weight: bold;
}

.text {}

.charge-table .finish-item:not(.category), .charge-final .finish-item:not(.category) {
    margin-left: 8px;
    color: #4c4c4c;
}

.charge-final {
    width: 51%;
    position: relative;
    float: right;
    min-height: 30px;
    margin-bottom: 25px;
    margin-right: 2.5%;
    min-width: 360px;
}

.demon-large-item h2 {
}

.star-content {
    float: right;
}

.charge-final .finish-item:not(.category) {
    margin: unset;
}

.demon-large-item.credits i.fa.fa-plus {
    float: right;
    margin-right: 30px;
    cursor: pointer;
}

.add-credit {
    position: fixed;
    height: 350px;
    width: 560px;
    left: 50%;
    top: 50%;
    transform: translate(-50%,-50%);
    background-color: white;
    box-shadow: 0 0 7px #00000047;
    z-index: 3;
    border-radius: 3px;
    overflow: hidden;
}

.add-credit {}

.add-credit .select {
    display: flex;
    float: right;
    width: 237px;
    justify-content: flex-end;
    cursor: pointer;
}

.add-credit .select * {
    margin-left: 20px;
}

.add-credit center {
    margin-top: 30px;
}

.left-header {
    margin-left: 60px;
    margin-top: 19px;
}

.add-credit .content.cards .payment-item {
    position: relative;
    left: 50%;
    transform: translateX(-50%);
    margin-top: 5px;
    transition: 100ms ease-in;
}

.add-credit .payment-methods {
    height: 255px;
    overflow: scroll;
    box-shadow: inset 0px 3px 3px #00000017;
}

.add-credit .payment-item:first-of-type {
    margin-top: 20px !important;
}

.add-credit .payment-item:last-of-type {
    margin-bottom: 20px !important;
}

.add-credit .content.cards .payment-item:hover {
    background-color: #2a89ff;
    color: white;
    cursor: pointer;
}

iframe.three_d_secure {
    position: fixed;
    z-index: 4;
    border: unset;
    width: 530px;
    height: 610px;
    top: calc(50% + 25px);
    left: 50%;
    transform: translate(-50%,-50%);
    box-shadow: 0 0 4px #0000002e;
}

.edit-api-key {
    position: fixed;
    width: 500px;
    height: 300px;
    background-color: white;
    left: 50%;
    top: 50%;
    transform: translate(-50%,-50%);
    z-index: 3;
    border-radius: 4px;
    box-shadow: 0 0 9px #0000004d;
    overflow: hidden;
}

.edit-api-key .whitelist i.fa.fa-plus {
    top: 50%;
    float: right;
    float: right;
    margin-right: 30px;
	cursor:pointer;
}

.key-item .key-data {
    position: relative;
    width: 91%;
    padding-bottom: 7px;
    padding-top: 8px;
}

.key-item .key-data {
    display: flex;
    justify-content: space-between;
}

.key-list .key-item i.fa.fa-edit {
    cursor: pointer;
}

.key-item .actions {
    position: absolute;
    right: 13px;
    top: 10px;
}

.key-item .actions>* {
    margin-left: 10px;
}

.donor-list p {
    margin-left: 60px;
}

.edit-document {
    position: fixed;
    width: 900px;
    height: 600px;
    left: 50%;
    top: 50%;
    transform: translate(-50%,-50%);
    z-index: 3;
    background-color: white;
    box-shadow: 0 0 5px #0000003b;
    border-radius: 5px;
    overflow: hidden;
}

.content.assignment .finish-list.document-letters {
    width: 90%;
    margin-top: 20px;
}

.edit-document .content.fields i.fa.fa-plus {
    font-size: 16px;
    top: 50%;
    transform: translateY(-50%);
    position: absolute;
    right: 40px;
}

.edit-document .fields h2 {
    position: relative;
}

.edit-document .fields .finish-list {
    width: 90%;
}

.customer-settings .finish-list.settings {
    width: 500px;
    margin-top: 50px;
}

center>h6,center>h5, center>h4, center>h3, center>h2, center>h1 {
    margin-left: unset;
}

.transaction-preview .custom-data .fa {
    font-size: 10px;
    line-height: 16px;
    margin-left: 10px;
    margin-right: 10px;
    color: #3b3b3b;
}

.itemlist>h4 {
    text-align: center;
    position: absolute;
    width: 100%;
    margin: unset;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-100%);
    color: #b7b7b7;
}

.search-sidebar .primary-info input:not(:placeholder-shown) {
    background-color: #def0ff;
}

.card-names i.fa.fa-pencil-alt.editing {
    color: red;
}

.pii-container i.fa.fa-backspace {
    position: absolute;
    top: 50%;
    color: #3b3b3b;
    right: -40px;
    transform: translateY(-50%);
    cursor: pointer;
}

.customer-info.pii i.fa.fa-backspace {
    position: absolute;
    right: 15px;
    top: 18px;
    font-size: 12px;
    cursor: pointer;
}

.customer[noclick].selection-addition {
    cursor: copy;
}

.customer.highlight-selected .customer-header {
    background-color: #802ef0;
}

.customer.population-selected .customer-header, .transaction-item.population-selected .object-header {
    background-color: #2c71f0;
    color: white;
}

.population-list-export {
    position: fixed;
    width: calc(100% - 250px);
    left: 250px;
    height: 70px;
    padding-bottom: 3px;
    bottom: 0px;
    background-color: white;
    z-index: 1;
    box-shadow: 0 0 7px #989898;
    display: flex;
    justify-content: left;
    align-items: center;
}

.campaign-population-view .next {}

.population-list-export .next {
    position: relative;
    margin-right: 20px;
    left: unset;
    bottom: unset;
}

.population-list-export .next.cancel {
    background-color: #c93b3b;
    margin-left: auto;
    margin-right: 20px;
}

.subscription-editor .finish-list.letter-data {
    height: 270px;
    overflow: scroll;
    border-bottom: 1px solid #d5d5d5;
    margin-top:0px;
    padding-top:10px;
}

.order-fill .recipient-block h3 {
    border-bottom: 1px solid #e5e5e5;
    display: flex;
    align-items: flex-end;
}

.order-fill .recipient-block {
    margin-right: 30px;
}

.order-fill .recipient-block small {
    font-size: 12px;
    margin-left: 10px;
    margin-right: 20px;
}

.order-fill .letter-item {
    width: auto;
    height: 40px;
    display: flex;
    background-color: #ffffff;
    margin-left: 30px;
    box-shadow: 0 0 7px #00000042;
    border-radius: 5px;
    align-items: center;
    padding-left: 20px;
    padding-right: 20px;
    margin-bottom: 10px;
}

.order-fill .letter-item p {
    margin-left: 15px;
}

.order-fill .letter-item .actions {
    position: absolute;
    right: 20px;
}

.mod-transaction {
    width: 630px;
    height: 450px;
    background-color: white;
    position: fixed;
    left: 50%;
    top: 50%;
    transform: translate(-50%,-50%);
    box-shadow: 0 0 8px #00000059;
    border-radius: 6px;
    z-index: 3;
    overflow: hidden;
    transition: all 200ms ease-in;
}

.mod-transaction small {
    font-size: 10px;
    margin-right: 20px;
    margin-left: 20px;
    transform: translateY(-10%);
}

.mod-transaction .mod-column {
    display: inline-flex;
    flex-direction: column;
    position: relative;
    margin-left: 31px;
    text-align: right;
}

.view-transaction .main h2 {
    margin-bottom: 6px;
    display: flex;
    align-items: center;
}

.mod-transaction .warning p {color: white;}

.mod-transaction .sidebar {
    top: 0px;
    height: 100%;
    width: 225px;
    border-radius: 0;
}

.mod-transaction .sidebar h3 {
    margin-right: 30px;
    text-align: center;
}

.mod-transaction .content.main.shortened {
    left: 225px;
    width: calc(100% - 225px);
}

.mod-transaction h5 {
    margin-bottom: 14px;
}

.mod-transaction .itemlist {
    width: 70%;
    left: 50%;
    transform: translateX(-50%) scale(.9);
    margin-top: -20px;
    margin-bottom: 27px;
}

.mod-transaction h6 {
    margin-top: unset;
    margin-left: 33px;
}

.mod-transaction .finish-list {
    width: 80%;
    font-size: 14px;
    padding-bottom: 30px;
}

.transaction-preview .custom-data p {width: 85%;padding-left: 6px;left: 50%;transform: translateX(-50%);position: relative;color: black;text-align: left;}

.item.receipt.product-list {
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: flex-start;
    overflow: scroll;
    height: fit-content;
    height: -moz-fit-content;
    max-height: 100%;
    width: 300px;
    font-size: 10px;
    flex-shrink: 0;
}

.item.receipt.product-list p {
    padding-top: 1px;
    padding-bottom: 1px;
}

.mod-transaction .fa-pencil-alt, .mod-transaction .fa-plus {
    margin-left: 10px;
}

.mod-transaction .warning {
    width: 70%;
    height: 45px;
    font-size: 12px !important;
    margin-top: 15px;
    color: white !important;
    align-items: center;
    margin-bottom: 20px;
}

.mod-transaction .warning .fa {
    font-size: 12px;
}

.mod-transaction .fa-arrow-right {
    font-size: 8px;
    margin: 0px 10px;
}

.mod-transaction center p {
    display: flex;
    justify-content: center;
    align-items: center;
}

.new-transaction .manual {
    position: absolute;
    font-size: 10px;
    color: #3b3b3b;
    top: 20px;
    right: 30px;
    cursor: pointer;
}

.new-transaction .manual-subscription .finish-list {
    width: 90%;
    margin-top: 30px;
}

input[type="date"] {
    min-width: 150px;
}

.new-transaction .manual-subscription input {
    width: 200px;
}

.mod-transaction p.transaction-note {
    width: 70%;
    left: 15%;
    position: relative;
    margin-bottom: 40px;
    border-top: 1px solid #e4e4e4;
    padding-top: 8px;
    padding: 8px 10px;
}

.transaction-note {
    width: 70%;
    left: 50%;
    transform: translateX(-50%);
    position: relative;
    padding: 10px 30px;
    padding-left: 20px;
    box-shadow: 0 0 1px black;
    display: flex;
    margin-bottom: 10px;
    margin-top: 20px;
}

.mod-transaction .main .fa-sticky-note {
    margin-right: 20px;
    color: #3b3b3b;
    align-self: center;
}

.mod-transaction .transaction-note i.fa.fa-edit {
    position: absolute;
    right: 10px;
    font-size: 10px;
    cursor: pointer;
    top: 5px;
}

.mod-transaction .edit-option-list {
    display: flex;
    width: 86%;
    margin: auto;
    margin-top: 40px;
    flex-wrap: wrap;
    justify-content: center;
}

.mod-transaction .edit-option, .block-option {
    width: 150px;
    height: 70px;
    padding-bottom: 7px;
    color: #3b3b3b;
    box-shadow: 0 0 6px #0000002e;
    border-radius: 5px;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    margin: 15px;
    cursor: pointer;
}

.mod-transaction .edit-option p, .block-option p {
    text-align: center;
    font-size: 11px;
    margin-top: 15px;
}

.mod-transaction .edit-transaction-note .note-editing {
    width: 80%;
    left: 50%;
    min-height: 200px;
    transform: translateX(-50%);
    margin-top: 30px;
    position: relative;
    box-shadow: 0 0 3px #00000059;
    padding: 10px 10px;
}

.mod-transaction .edit-acknowledgement .finish-list,.mod-transaction .edit-campaigns .finish-list {
    margin-top: 40px;
}

.mod-transaction .edit-desc {
    width: 84%;
    margin: auto;
    margin-top: 50px;
}

.account-info-block i.fa.fa-exclamation-triangle {
    margin-left: 40px;
    font-size: 35px;
}

.sidebar-page {
    width: 100%;
    height: 100%;
    position: absolute;
    overflow-y: scroll;
}

.mod-transaction.right {
    left: calc(50% + (250px / 2));
}

.transaction-sidebar.history-sidebar {
    z-index: 4;
    height: 100%;
    top: 0px;
}

.customer .name-container {
    margin-left: 30px;
    display: flex;
    flex-direction: column;
    width: 45%;
}

.customer .item.company {
    font-size: 10px;
}

.paragraph-input {
    padding: 10px;
    border-radius: 3px;
    border: none;
    box-shadow: 0 0 2px #00000073;
    border-radius: 4px;
    text-align: left;
    font-size: 10px;
    overflow-y: scroll;
    background-color: white;
    min-width: 200px;
    height: fit-content;
	height: -moz-fit-content;
    max-width: 210px;
    color: #3b3b3b !important;
    min-height: 12px;
}

.campaign .content>p {
    margin-left: 30px;
}

.open-campaigns .finish-list {
    width: 90%;
}


.subscriptions .actions {
    position: absolute;
    margin-top: 6px;
    right: 16px;
}

.sidebar.orders .item:last-of-type {
    margin-bottom: 40px;
}

.log .name, .log .company {
    display: block;
}

.item {}

.log .item.company {
    font-size: 10px;
}

.log .name-container * {
}

.log .item.name {
    height: 18px;
}

body.scaled {
    transform: translateX(250px);
    box-shadow: 0 0 8px black;
    box-shadow: 0 0 8px #0000006e;
}

.dms-overlay-left {
    position: fixed;
    left: 0px;
    width: 250px;
    transform: translateX(-100%);
    background-color: #ffffff;
    height: 100%;
    z-index: 8;
    top: 0px;
    box-shadow: inset 0 0 10px #00000059;
}

.dms-overlay-top {
    position: fixed;
    width: 100%;
    background-color: white;
    height: 25%;
    top: -25%;
    z-index: 9;
    box-shadow: 4px 2px 5px #00000047;
}

.darken.scaled {
    z-index: 8;
}

.scaled .darken {
    z-index: 8;
}

.dms-overlay-left .item {
    width: 60%;
    padding-left: 30px;
    padding-right: 30px;
    position: relative;
    display: flex;
    justify-content: center;
    flex-direction: column;
    align-items: center;
    box-shadow: 0 0 6px #00000033;
    border-radius: 9px;
    margin: auto;
    margin-bottom: 15px;
    cursor: pointer;
    color: #3b3b3b;
}

.dms-overlay-left .item>* {
    padding-bottom: 13px;
    text-align: center;
}

.dms-overlay-left .item>*:first-child {
    padding-top: 13px;
}

.dms-overlay-left center {
    margin-bottom: 40px;
}

a {
    text-decoration: none;
}

.topic-sidebar {
    font-size: 15px;
}

.topbar .open {
    outline: 1px solid #ffffff75;
}

.help-main {
    position: absolute;
    overflow: scroll;
    left: 250px;
    width: calc(100% - 250px);
    height: calc(100% - 50px);
    top: 50px;
}

.content .article {
    width: 360px;
    height: 100px;
    background-color: white;
    box-shadow: 0 0 4px #00000075;
    margin: 10px;
    position: relative;
    cursor: pointer;
    border-radius: 6px;
    display: flex;
    flex-wrap: nowrap;
    justify-content: flex-start;
    align-items: center;
}

.help-main .content {
    justify-content: space-between;
    c(100% - 0px);
}

.help-main .help-articles {
    padding: 0px;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    flex-direction: row;
    align-items: center;
}

.help-articles .article p {margin-right: 20px;text-align: left;}

.help-articles .article p>i {
    margin-right: 12px;
    font-size: 17px;
    vertical-align: middle;
    transform: translateY(-2px);
}

.article>i {margin-left: 40px;margin-right: 40px;}

.help-articles .construction {
    position: absolute;
    font-size: 10px;
    top: 8px;
    right: 10px;
    color: #5d0606;
}

.help-main .content[articleid] p {
    padding: 0px 60px;
    margin-top: 39px;
}

.submission {
    width: 500px;
    height: 400px;
}

.modal {
    background-color: white;
    z-index: 8;
    box-shadow: 0 0 9px #0000002e;
    position: fixed;
    border-radius: 4px;
    left: 50%;
    top: 50%;
    transform: translate(-50%,-50%);
    overflow: hidden;
    overflow-y: scroll;
}

.submission input[type="text"] {
    width: 400px;
    margin-top: 20px;
}

.submission .paragraph-input {
    margin-top: 14px;
    width: 400px;
    max-width: unset;
    min-height: 100px;
    max-height: 140px;
}

.modal>p {
    margin-left: 40px;
    margin-top: 15px;
}

.plain .search-sidebar {
    height: 100%;
    top: 0px;
}

.plain .customer-list {
    height: 100%;
    top: 0px;
}

iframe.population {
    width: 100%;
    height: 100%;
    top: 0px;
    position: absolute;
    border: unset;
}

.plain .actions {
    display:none;
}

.customer.population-selected i.fa {color: white;}
.customer.highlight-selected i.fa {color: white;}

.customer[noclick].last {
    margin-bottom: 100px;
}

.inventory {
    width: 700px;
    height: 450px;
}

.inventory .main .finish-list {
    width: 90%;
}

h6 {
    margin-top: 7px;
    margin-bottom: 7px;
}

.inventory .main h2 {
    margin-bottom: 5px;
}

.inventory .product-description, .statistics .product-description {
    position: absolute;
    right: 15px;
    font-size: 10px;
    top: 10px;
    max-height: 16px;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: 240px;
    overflow:hidden;
    text-align: right;
}

.inventory .options {
    justify-content: center;
}

.inventory .content.all .sidebar {
    top: 0;
    height: 100%;
    width: 200px;
    z-index: 1;
}

h4 {
    margin-top: 15px;
    margin-bottom: 15px;
}

.inventory .all .sidebar .item {
    font-size: 12px;
}

.inventory .all .sidebar h4 {
    margin-top: 22px;
    margin-left: 27px;
}

.inventory .sku .finish-list {
    width: 75%;
}

.inventory .manage-sku .finish-list {
    margin-top: 40px;
    width: 70%;
}

.inventory .manage-sku .finish-item i {
    width: 29px;
    text-align: center;
    margin-right: 5px;
    margin-left: 5px;
}

.inventory .manage-sku .finish-item {
    cursor: pointer;
}

.inventory .manage-sku h2 {
    max-width: 82%;
    margin-top: 30px;
}

.manage-sku-inventory .finish-item {
    cursor: pointer;
    width: 80%;
    margin: auto;
}

.advanced-search .content li[index] {
    font-size: 14px;
}

.advanced-search .content .finish-item[index] p {
    max-width: 79%;
}

.sidebar .item p {
    margin-left: 0px;
    max-width: 88%;
}

.flip-card-body, .flip-card-face{
    height: 100%;
    top: 0px;
    position: absolute;
    width: 100%;
}

.flip-card-face.front {
}

.flip-card-body {
    transition: transform 0.8s;
    transform-style: preserve-3d;
}

.flipped .flip-card-body {
    transform: rotateX(180deg);
}

.flip-card-face{
    position: absolute;
    width: 100%;
    height: 100%;
    -webkit-backface-visibility: visible;
    -webkit-backface-visibility: hidden; /* Safari */
    backface-visibility: hidden;
    background-color: white;
    -webkit-transform-style: preserve-3d;
    box-shadow: 0 0 9px #0000002e;
    border-radius: 5px;
}

.flip-card-face.back{
    transform: rotateX(180deg);
}

.flip-card {
    perspective: 1000px;
}

.hover-flip-card:hover .flip-card-body{
    transform:rotateX(180deg)
}

.new-user .finish-list {
    width: 80%;
}

.user-list {}

.user-access-settings.modal center h2 {
    margin-bottom: 5px;
}

.user-access-settings.modal center p {
    font-size: 13px;
}

.add p {
    display: inline-block;
}

.new-document .finish-list .finish-item {
    cursor: pointer;
}

.notification .load-throbber {
    position: absolute;
    width: 20px;
    height: 20px;
    top: unset;
    transform: unset;
    right: 20px;
    left: unset;
}

.notification.task {
    background: unset;
    background-color: white;
    color: inherit !important;
    padding-right: 60px;
    min-width: calc(100% - 30px);
}

.notification.task i.fa.fa-check {
    position: absolute;
    right: 23px;
    margin: unset;
    color: #44aa44;
}

.notification.task i.fa.fa-times {
    position: absolute;
    right: 23px;
    margin: unset;
    color: #7c0000;
}


.notifications {
    perspective: 984px;
}

.notification {
    cursor: pointer;
}

.advanced-search .add {
    position: absolute;
    right: 40px;
    width: fit-content;
    width: -moz-fit-content;
    left: unset;
    transform: translateY(6px);
}

.advanced-search hr {
}

.advanced-search .main center {
    padding-bottom: 10px;
    padding-top: 20px;
}

.advanced-search .main center h2 {
    margin-top: unset;
}

.advanced-search .main .finish-list {
    margin-top: unset;
    height: 71%;
    overflow: scroll;
}

.advanced-search .operator {
}

.advanced-search .finish-item .value {
    cursor: default;
}

.advanced-search .main .finish-item[or] {
    padding-left: 30px;
}

.advanced-search .main .finish-item {user-select: none; -webkit-user-select: none;}

.advanced-search .white-back .option-button, .advanced-search .white-back .interact-button {
    position: absolute;
    right: 30px;
    width: -moz-fit-content;
    margin-top: unset;
    top: 50%;
    transform: translateY(-50%);
    right: 100px;
    left: unset;
    cursor: pointer;
    font-size: 21px;
}

.advanced-search [handler] li i.fa.fa-plus {
    padding: 0px 5px;
    cursor: pointer;
}

.advanced-search .white-back .interact-button {
    right: unset;
    left: 100px;
}

.advanced-search .content[handler] .value {
    padding-left: 30px;
}

.advanced-search .content[handler] .finish-list {
    padding-bottom: 40px;
}

[relate='product-management'] .sidebar {
    top: 0px;
    z-index: 2;
    height: 100%;
}

.sidebar-page {
    width: calc(100% - 250px) !important;
    left: 250px;
    height: 100%;
    position: absolute;
    transition: all 300ms;
    z-index: 1;
    overflow-x: hidden;
}

.sidebar-retractable.sidebar-retracted {
    transform: translateX(-80%);
}

.sidebar-page.sidebar-retracted-page {
    left: calc(250px * .2);
    width: calc(100% - (250px * .2)) !important;
}

.sidebar.sidebar-retractable.sidebar-retracted i.fa.fa-mouse {
    position: absolute;
    right: calc(50px / 2 - 7px);
    top: 15px;
}

.sidebar:not(.sidebar-retracted) i.fa.fa-mouse {
    display:none;
}

.sidebar.sidebar-retracted i[lock] {
    display:none;
}

.sidebar.sidebar-retracted i[lock] {
    display:none;
}

.modal.modal-presentation {
    width: 100%;
    height: 100%;
    background-color: #0000005e;
    border-radius: 0;
    box-shadow: unset;
    outline: 10px solid #0000005e;
    z-index: 1300;
    overflow: hidden;
}

.confirm.modal p {
    margin-top: 40px;
}

.popover {
    position: absolute;
    background-color: white;
    z-index: 5;
    box-shadow: 0 0 7px #00000059;
    padding: 15px 15px;
    border-radius: 5px;
    width: fit-content !important;
    width: -moz-fit-content !important;
}

.popover:after {
    content: "";
    position: absolute;
    width: 10px;
    height: 20px;
    top: 50%;
    left: 0px;
    background-color: white;
    transform: translateY(-50%);
}
.popover:before {
    content: "";
    position: absolute;
    width: 12px;
    height: 12px;
    top: 50%;
    left: -6px;
    background-color: white;
    transform: translateY(-50%) rotate(45deg);
    box-shadow: 0 0 3px #00000052;
}

ul {
    list-style: none;
    padding-left: unset;
    margin-top: unset;
    margin-bottom: unset;
}

.popover ul li {
    padding: 7px 11px;
}

.popover ul li:last-of-type {
    border-bottom: unset;
}

.popover ul {
    margin-bottom: 0px;
    margin-top: 0px;
}

.popover ul li {
    cursor: pointer;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.popover.top-center-arrow:after {
    left: 50%;
    transform: translate(-50%, 0%);
    top: 0;
    width: 20px;
    height: 13px;
}

.popover.top-center-arrow:before {
    top: 2px;
    right: 50%;
    transform: translateY(-50%) translateX(50%) rotate(45deg);
    left: unset;
    border-radius: 3px;
}

.popover.bottom-center-arrow:after {
    left: 50%;
    transform: translate(-50%, 0%);
    bottom: 0px;
    width: 20px;
    height: 10px;
    top: unset;
}

.popover.bottom-center-arrow:before {
    top: 100%;
    right: 50%;
    transform: translateY(-50%) translateX(50%) rotate(45deg);
    left: unset;
}

.popover.right-center-arrow:after {
    right: 0px;
    left: unset;
}

.popover.right-center-arrow:before {
    left: unset;
    right: 0px;
    transform: translate(50%, -50%) rotate(45deg);
}

.series-menu {
    padding: 46px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
}

.dashboard .tile h2 i.fa {
    margin-right: 14px;
    width: 26px;
}

.dashboard .tile {
    padding-top: 10px;
    padding-bottom: 61px;
    box-shadow: 0 0 6px #00000052;
    border-radius: 5px;
    width: 250px;
    position: relative;
    margin: 20px;
}

.dashboard .tile center>i {
    position: absolute;
    right: 18px;
    top: 12px;
}

.button i {
    margin-left: 8px;
    vertical-align: middle;
}

.subscription-editor .settings .finish-item p {
    min-width: 151px;
    display: flex;
    justify-content: space-between;
}

.series-popup {
    width: 250px;
    height: 100px;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    color: #3b3b3b !important;
}

.series-popup>div {
    height: 100%;
    position: relative;
}

.series-popup .next {
    bottom: 0;
    transform: translateX(-50%) scale(.8);
    transform-origin: center;
}

.series-popup img {
    width: 100px;
    height: 100%;
    object-fit: contain;
}

.series-popup p {
    margin-top: 7px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    width: 112px;
}

.sidebar-full-height{
    top:0px;
    height: 100%;
}

.statistics.modal {
    width: 90%;
    height: 90%;
}

.statistics .product-description {
    width: 400px;
}

.sidebar.sidebar-retractable i[lock]{
    position: absolute;
    right: calc(50px / 2 - 7px);
    top: 15px;
    cursor:pointer;
    color: #5c5c5c;
}

.tile {
    box-shadow: 0 0 4px #00000061;
    border-radius: 6px;
    margin: 20px;
    padding: 20px 20px 80px 20px;
    position: relative;
}

.tile.no-next {
    padding-bottom: 30px;
}

.statistics .report-tiles {
    margin-top: 38px;
}

.advanced-search .finish-list.fields{
    margin-top:200px !important;
}

i.fa.fa-angle-left {
    left: 10px;
    position: fixed;
    top: 22px;
    cursor: pointer;
    z-index: 1;
}


.advanced-search.modal.large {
    width: 95%;
    height: 95%;
}

.advanced-search .main.content .finish-item {
    background-color: white;
}

.advanced-search .main.content .finish-item:first-of-type {
    margin-top:5px;
}

.advanced-search .main.content .finish-item:last-of-type {
    margin-bottom:5px;
}

.create-transaction {
    width: 1000px;
    height: 650px;
}

input#amount, input#extra, select#payment_type {
    margin-right: 22px;
}

input#amount, input#extra {
    width: 90px;
    margin-right: 9px;
}

.create-transaction .main .finish-list {
    margin-top: 25px;
}

.create-transaction .main .advanced {
    position: absolute;
    right: 35px;
    top: 20px;
    font-size: 19px;
    cursor: pointer;
}

.create-transaction input#date, .create-transaction input#time {}

input#create_time, input#create_date {
    margin-left: 15px;
}

.create-transaction .finish-list#types {
    width: 80%;
    margin-top: 50px;
    cursor: pointer;
}

.create-transaction .transaction-preview {
    width: 450px;
    margin-top: 50px;
}

.create-transaction .create-options-list.finish-list {
    width: 80%;
    margin-top: 25px;
}

.create-transaction div#sale-items {
    width: 75%;
    margin: auto;
    margin-top: 55px;
}

.create-transaction .assign-gift {
    padding: 5px 20px;
    margin-left: 20px;
}

.merge-block {
    padding: 5px 10px;
    width: fit-content;
    width: -moz-fit-content;
    box-shadow: 0 0 5px #0000004a;
    margin-bottom: 8px;
    border-radius: 5px;
    padding-top: 5px;
    margin-top: 11px;
    margin-left: 15px;
    height: fit-content;
    display: flex;
    align-items: center;
}

.view-code-structure {
    width: 80%;
    height: 520px;
    padding: 20px;
}



.merge-block>span.merge-display {
    margin-right: 20px;
    font-weight: lighter;
    color: #5959ff;
    padding-top: 5px;
    padding-bottom: 5px;
}

.merge-block.conditional-data,.merge-block.body {
    flex-direction: column;
    align-items: flex-start;
}

.finish-list[disabled] * {
    color: #a6a6a6;
    cursor: default !important;
}


.secondary-list {
    height: calc(83% - 70px);
    overflow: scroll;
    box-shadow: inset 0 0 6px #0000003d;
}

.create-series-item input.ord {
    margin-right: 20px;
}

center>h2 i.fa.fa-plus {
    position: absolute;
    right: 50px;
    font-size: 15px;
    top: 50%;
    transform: translateY(-50%);
    cursor: pointer;
}

center {position: static;}

.custom-field-editor .dropdown-page .finish-item {
    background-color: white;
    cursor: grab;
}

.custom-field-editor .dropdown-page>center {
    position: relative;
}


.custom-field-editor .preview h2 {margin-bottom: 0px;}

.content.secondary center {
    position: relative;
}

.change-margin {
    width: 600px;
    height: 400px;
}

.change-margin input.margin-input {
    width: 62px;
    text-align: center;
}

.margin-page {
    width: 100px;
    height: 132px;
    margin: 16px 37px;
    box-shadow: 0 0 9px #00000052;
}

.mailings .next.create-mailing {
    right: 20px;
    bottom: 0;
    top: 0;
    margin: auto;
    left:unset;
    transform:unset;
}

.csv-export.modal {
    width: 600px;
    height: 400px;
}

.items.campaign-wide-items {}

.item.line-item {}

.new-mailing div#sub-population {
    margin-top: 50px;
}

.new-mailing iframe {
    top: 0;
    position: absolute;
    width: 100%;
    height: 100%;
    border: unset;
}

.new-mailing.modal.expand {
    width: 93%;
    height: 90%;
}

.key-item i.fa.fa-fingerprint {
    position: absolute;
    top: 12px;
    left: 12px;
}

.modal.view-credential {
    width: 1000px;
    height: 700px;
}

.dot.true {
    background-color: green !important;
}

article {
    margin-bottom: 90px;
}

code.replaceable {
    color: #1f8000;
}

.transaction:first-of-type {
    margin-top: 40px;
}

.customer-card .main .add:not(button) {
    left: unset;
}

.customer-card .campaigns, .customer-card .transactions {
    margin-bottom: 0px;
    padding-bottom: 10px;
    padding-top: unset;
}


.demon-large-item.history, .demon-large-item.credit-changes {
    min-height: 62px;
    cursor: pointer;
}

.demon-large-item.history i.fa.fa-arrow-right, .demon-large-item.credit-changes i.fa-arrow-right {
    position: absolute;
    font-size: 23px;
    right: 60px;
    top: 50%;
    transform: translateY(-50%);
}


.invoice.invoice-year {
    width: 500px;
    padding: 20px;
    border-radius: 5px;
    box-shadow: 0 0 4px #0000004f;
    display: flex;
    flex-direction: column;
    margin-bottom: 30px;
}

.invoices:not(.content) {
    display: flex;
    align-items: center;
    flex-direction: column;
    margin-top: 50px;
}

.invoice .finish-item {
    cursor: pointer;
}

.finish-item.selectable:hover, li[selectable]:hover {
    background-color: #f3f3f3;
    cursor: pointer;
}

.invoice.invoice-year.minified {
    height: 50px;
    overflow: hidden;
    padding-bottom: 30px;
}

.invoice h2 {
    cursor: pointer;
}

.invoice.minified .finish-list {
    margin-top: 40px;
}

.invoice.content .demon-large-item {
    margin-top: 65px !important;
}

.credit-changes .finish-list {
    margin-top: 50px;
    width: 80%;
}

.credit-changes .finish-item.ui-list-item:last-of-type {
    margin-bottom: 50px;
}

.series-options-page .finish-list {
    width: 80%;
    min-width: 200px;
    max-width: 600px;
    margin-top: 50px;
}

.series-options.modal {
    width: 600px;
    height: 400px;
}

.add-to-campaign.modal {
    width: 700px;
    height: 500px;
}

body.left-bias {
    width: calc(100% - 320px);
}

.left-bias .topbar {
    width: calc(100% + 320px);
}

.remote-entry-data {
    position: absolute;
    width: 275px;
    left: unset;
    right: -270px;
    height: 400px;
    transform: translate(0,-50%);
}

.left-bias-data {
    width: 320px;
    right: -320px;
    height: calc(100% - 50px);
    top: 50px;
    position: fixed;
    z-index: 1;
    overflow: hidden;
    border-left: 1px solid #00000036;
}

.left-bias-data .order-data {
    width: 300px;
    height: 468px;
    position: relative;
    transform: translate(-50%,0%);
    top: 3%;
}

i.fa.fa-times {}

i.fa.fa-times.close {
    position: absolute;
    margin-top: 14px;
    margin-left: 12px;
    font-size: 19px;
    right: 0px;
    cursor: pointer;
}

.left-bias-data .transaction-preview {
    left: unset;
    width: 450px;
    transform: scale(.6666);
    right: 10px;
    transform-origin: top right;
    margin-top: 44px;
    transition: all 200ms;
    border-radius: 10px;
    z-index: 2;
    position: absolute;
    box-shadow: 0 0 9px #0000002e;
}

.controls {
    position: absolute;
    bottom: 30px;
    width: calc(100% - 80px);
    height: 48px;
    background-color: #f6f6f6;
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
    padding: 0px 20px;
    margin-left: 20px;
}

.left-bias-data .controls i {
    cursor: pointer;
}

.content.overflow {
    overflow: visible;
}

.left-bias .modal.modal-presentation {
    width: calc(100% + 320px);
    transform: translate(0,-50%);
    left: unset;
}

.left-bias-data center.empty {
    position: relative;
    top: 36%;
}


.finish-list.tab .finish-item {padding-left: 50px;}

.finish-list.collapse {
    height: 0;
}

.embedded.finish-list {
    margin-top: unset;
    margin-left: 10px;
}

.data-item {
    margin-top: 20px;
    width: 90%;
    margin: auto;
    margin-top: 20px;
    margin-bottom: 20px;
    height: 125px;
    box-shadow: 0 0 6px #00000030;
    border-radius: 5px;
    position: relative;
    overflow: hidden;
    display: flex;
    justify-content: space-between;
    align-items: center;
    cursor: grab;
}

.customer-card .personal-info .add {
    position: relative;
}

.data-item .data-label {
    font-weight: lighter;
    margin-left: 7px;
    margin-top: 5px;
    font-size: 12px;
}

.address .address-line {
    position: relative;
    margin-left: 15px;
    font-weight: lighter;
    max-width: 65%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.data-item .modify {
    margin-right: 12px;
    font-size: 11px;
    white-space: nowrap;
    transform: translateY(-5%);
}

.data-item .modify>* {
    margin-left: 6px;
    cursor: pointer;
    padding: 0 5px;
}

.pii-container .notes {
    width: 500px;
    min-height: 250px;
    margin-bottom: 20px;
    margin: auto;
    margin-top: 20px;
    overflow: hidden;
    box-shadow: 0 0 8px #00000029;
    border-radius: 5px;
    padding: unset;
}

.customer-info {
    position: relative;
    width: 400px;
    padding-bottom: 29px;
    margin-left: 20px;
    margin-right: 20px;
    z-index: 1;
    height: fit-content;
    margin-top: 20px;
    height: -moz-fit-content;
    padding: 0px 20px 0px;
}

.personal-data {
    width: 500px;
    padding-bottom: 33px;
    margin-left: auto;
    margin-right: auto;
    box-shadow: 0 0 8px #00000029;
    border-radius: 5px;
    overflow: hidden;
}

.personal-data input {
    width: 150px;
    text-align: left;
}

.account-data-container {
    margin-left: auto;
    margin-right: auto;
}

.personal-info {
    margin-top: 60px;
    display: flex;
    justify-content: center;
    align-items: center;
    margin-bottom: 60px;
    flex-wrap: wrap;
    padding: 0px 0px;
}

.personal-info .telephones, .personal-info .emails, .personal-info .addresses, .personal-info .tags, .personal-info .attributes {
    width: 440px;
    height: 275px;
    padding: 0px 0px;
    overflow-y: scroll;
    overflow-x: hidden;
    position: relative;
    align-self: baseline;
    margin: 10px;
    box-shadow: 0 0 8px #00000029;
    border-radius: 5px;
}

.data-item.phone, .data-item.email {
    height: 50px;
}

.phone-line, .email-line {padding-left: 13px;max-width: 64%;overflow: hidden;text-overflow: ellipsis;}

.modify {
    font-size: 12px;
}

.modify>* {
    margin-left: 10px;
    cursor: pointer;
}

.personal-info .finish-list p {
    max-width: 87%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.edit-email, .edit-phone, .edit-address, .add-tag, .edit-note, .edit-attribute {
    width: 600px;
    height: 400px;
}

.edit-email .finish-list {
}

.personal-info .finish-list small {
    font-size: 12px;
    text-align: center;
}

.personal-info .flex-v.special>i, .object-container .flex-v.special>i {
    font-size: 10px;
    color: black;
}

.edit-address.modal {
    height: 560px;
    width: 740px;
}

.lookup-result {
    display: inline-block;
    margin-right: 20px;
    font-size: 11px;
    max-width: 190px;
    overflow: hidden;
    text-align: right;
    text-overflow: ellipsis;
}

.lookup-result-container{
	align-items: center;
  display: flex;
}

.partial-address {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 160px;
    position: absolute;
    transform: scale(.75);
    transform-origin: center right;
    right: 55px;
    top: 21px;
}

.personal-info .finish-list {
    padding-bottom: 20px;
    margin-top: unset;
}

[handler] li .value * {
    margin-left: 20px;
}

.label-item {
    text-align: center;
    margin-top: 30px;
    font-weight: 100;
    font-size: 17px;
    margin-bottom: 7px;
    border-bottom: 1px solid #eaeaea;
    padding-bottom: 5px;
}

.customer-list center h2 {
    margin-bottom: 6px;
}

div {}

.warnings {
    font-size: 12px;
    position: relative;
    width: fit-content;
    width: -moz-fit-content;
    border: 1px solid gray;
    padding: 5px;
    cursor: pointer;
    transition: all 100ms;
    border-radius: 5px;
    margin-top: 20px;
}

.warnings .fa {
    margin-left: 12px;
    margin-right: 12px;
    font-size: 10px;
}

.warnings:hover {
    background-color: #ab0006;
    color: white;
    border: 1px solid transparent;
}

.modal.warnings-ui {
    width: 700px;
    padding-bottom: 25px;
    min-height: 300px;
}

.customer.ui-list-item .finish-list {
    width: 100%;
    margin-top: unset;
}

.customer.ui-list-item .customer-header, .campaign.ui-list-item .campaign-header, .large-object .object-header {
    width: 100%;
    position: relative;
    height: 40px;
    display: flex;
    left: 0;
    align-items: center;
    padding-top: 4px;
    padding-bottom: 4px;
    z-index: 2;
    border-bottom: 1px solid lightgrey;
    flex-shrink: 0;
    cursor: pointer;
}

.customer.ui-list-item .customer-name {
    margin-left: 15px;
    white-space: nowrap;
    text-overflow: ellipsis;
    max-width: 82%;
    overflow: hidden;
}

.large-object.ui-list-item .finish-list .finish-item {
    padding-left: 10px;
    padding-right: 10px;
}

.customer-body-section, .object-body-section {
    position: relative;
    left: 0;
    padding: 0px 0px;
    height: calc(100% - 49px);
    width: 100%;
    margin: auto;
    max-height: 185px;
    overflow-y: scroll;
    overflow-x: hidden;
    padding-bottom: unset;
}

.customer:not(.empty):hover {
    background-color: #1a62bf03;
}

.customer.new.ui-list-item {
    /*height: 15px;*/
}


.customer.population-selected .customer-header {
    color: white !important;
    border-bottom: 1px solid #ffffffb3;
}
.customer.highlight-selected .customer-header {
    color: white;
    border-bottom: 1px solid #ffffffb3;
}

.customer.population-selected {
    background-color: white;
    box-shadow: 0 0 0px 2px #2c71f0;
}

.customer.highlight-selected {
    background-color: white;
    /*box-shadow: 0 0 0px 2px #802ef0;*/
}

.modal.bulk-customer-actions {
    width: 700px;
    height: 500px;
}


.pii-row-item {
    margin: 10px;
    margin-top: 20px;
}

.edit-address .finish-item i.fa.fa-arrow-right {
    margin-left: 20px;
}

.iso-lookup-tab.modal {
    width: 700px;
    height: 530px;
}

.system-page {
    width: 100%;
    height: calc(100% - 50px);
    margin-top: 50px;
    position: absolute;
}

.campaign-list {
    display: flex;
    margin: auto;
    margin-top: 20px;
    max-width: 900px;
    justify-content: center;
}

.campaign.ui-list-item {
}

.campaign-code {
    margin-top: 0;
    font-weight: lighter;
    font-size: 11px;
}

.campaign-name {}

.system-page .sidebar {
    top: 0;
    height: 100%;
}


.transaction-item {
    width: 500px;
    box-shadow: 0 0 4px #0000003d;
    border-radius: 6px;
    margin: auto;
    position: relative;
    margin-bottom: 20px;
    cursor: pointer;
    overflow: hidden;
    z-index: 2;
}

.transaction-item:first-of-type {
    margin-top: 20px;
}

.transaction-item .object-header {
    height: 45px;
    border-bottom: 1px solid #0000002b;
    display: flex;
    padding: 0px 20px;
    align-items: center;
    justify-content: left;
    font-size: 12px;
    background-color: white;
    width: calc(100% - 40px);
}

.transaction-item .dates {
    text-align: right;
}

.object-body {
    height: fit-content;
    position: relative;
    width: 100%;
    overflow-y: scroll;
    background-color: #fbfbfb;
}

.dates.flex-right {
    margin-left: auto !important;
}

.object-header>*:not(:first-of-type) {
    margin-left: 25px;
}

.transaction-item .object-header .fa {
    font-size: 10px;
    margin-left: 4px;
}

.icon-tags {
    position: absolute;
    bottom: 8px;
    right: 10px;
    display: flex;
    color: #000000cf;
    font-size: 12px;
    align-items: center;
    flex-direction: row-reverse;
}

.icon-tags>i {
    margin-left: 8px !important;
}

.transaction-item.small.campaign-log-item {
    height: 60px;
}

.transaction-item.small .object-header {
    border-bottom: unset;
}

.object-header .icon-tags {
    position: relative;
    bottom: unset;
    right: unset;
    margin-left: 10px;
}

.transaction-item:hover {box-shadow: 0 0 0px 1px #2c71f0;}

.object-header .type {
    min-width: 70px;
    max-width: 70px;
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
}


.object-body div.itemlist {height: 200px;width: 100%;padding: unset;border-radius: unset;box-shadow: unset;border: unset;border-top: 1px solid #ececec8f;}


.object-body i.icon.fa.fa-shopping-cart {
    font-size: 8px;
    top: 7px;
    left: 7px;
}

.transaction-item .object-header i.has-action {
    color: #4d82ef;
    transition: all 200ms;
}

.transaction-item .object-header i.has-action:hover {
    transform-origin: center center;
}

.parallel-customer-container{
	width: 95%;
	margin: auto;
	display: flex;
	flex-wrap: wrap;
	justify-content: space-evenly;
	margin-bottom: 100px;
}

.transaction-item.medium {
}

center {}

.transaction-item .sub-range {
    text-align: center;
    font-size: 15px;
    display: flex;
    align-items: center;
}

.transaction-item .sub-range i {
    margin: 0px 10px;
    font-size: 7px;
}

.remote-order-screen {
    width: 700px;
    height: 500px;
}

.topbar.remote-entry-topbar.main-topbar {
}

.topbar .next.white.exit {
    margin-left: auto;
}

.encapsulation-topbar .next, .topbar .next, .next.right {
    top: unset;
    left: unset;
    margin-right: 20px;
    margin-left: auto;
    transform: unset;
    position: relative;
    bottom: unset;
    transform: translate(8px, 0px) scale(0.8);
}

.topbar div.first {
    margin-left: 30px;
}

.topbar>* {
    position: relative;
}

.next:not(.error):hover {
    box-shadow: 0 0 5px #00000059;
}

.topbar .item {
    margin-left: 5px;
    margin-right: 5px;
}

.item.search {
}

.view-transaction {
	width: 1200px;
	height: 750px;
}

.view-transaction .transaction-item {
    margin: auto;
    margin-top: 80px;
}

.view-transaction .main>.finish-list {
    width: 90%;
    bottom: 20px;
    position: absolute;
}

.view-transaction .content .finish-item>i {
    margin-right: 20px;
}

.view-transaction .content>.finish-list {
    width: 90%;
}

.red {
}

.create-transaction .transaction-item {
    margin-top: 0px !important;
    flex-grow: 0;
    margin-bottom: 0px;
}

.create-transaction .vertical-middle {
    height: 80%;
    position: absolute;
    width: 100%;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.transaction-item .finish-item:last-of-type {
    margin-bottom: 5px;
}

.transaction-item.limited .object-body {
    max-height: calc(244px - 45px);
}

.edit-transaction .finish-item p i {
    margin-right: 20px;
}

.view-transaction i.fa.fa-question-circle {
    margin-right: 13px;
}

.active-indicator {
    width: 4px;
    height: 4px;
    border-radius: 100%;
    position: absolute;
    top: calc(45px / 2);
    left: 9px;
    transform: translate(0,-50%);
    z-index: 2;
}

.green {
}

.active-indicator.active {
    background-color: green;
}

.active-indicator.inactive {
    background-color: red;
}

.live-object.order-item {
    height: fit-content;
    width: auto;
    padding: 35px 20px 10px 20px;
    display: flex;
    justify-content: left;
    border-bottom: 1px solid #00000029;
    position: relative;
    transition: all 200ms;
}

.live-object .monitors {
    height: 100%;
    width: fit-content;
    display: flex;
    flex-direction: column;
    align-items: center;
}

.live-object .monitors>* {
    margin-top: 2px;
    margin-bottom: 2px;
    font-size: 9px;
}

.live-object .monitors>.inactive {
    color: #00000021;
}

.live-object .body {
    width: -webkit-fill-available;
    padding-left: 16px;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.live-object .order-item .type {
    font-weight: 100;
}

.live-object.order-item {
    font-weight: lighter;
    cursor: pointer;
}

.order-item .type {
    font-size: 16px;
    position: absolute;
    top: 10px;
    left: 20px;
}

.order-item .time {
    position: absolute;
    top: 7px;
    right: 12px;
    font-size: 10px;
}

.live-object.order-item:hover {background-color: #fafafa;}

.order-item .person {
    font-size: 12px;
}

.yellow {
    color: #f37916;
}

.queue-item .transaction-item.minimize {
    position: absolute;
    margin: unset;
    top: 20px;
    right: 20px;
    transition: all 200ms;
    transform: scale(.4);
    transform-origin: top right;
}

.queue-item .transaction-item.minimize:hover {
    transform: scale(1);
}

.queue-item .finish-list.order-options {
    width: 580px;
    bottom: 160px;
    position: absolute;
}

.queue-column {
    width: 500px;
}

.note {
    max-width: 270px;
}

.queue-item>.itemlist {
    width: 500px;
    margin: auto;
    margin-top: 170px;
}

.queue-item .transaction-item:not(.minimize) {
    margin-top: 110px;
}

.product .product-info, .flow .flow-info {
    width: -webkit-fill-available;
    margin-right: auto;
    height: 100%;
    margin-top: 20px;
}

.product .product-info h2 {
		margin-top: 0;
		margin-left: 0;
		text-align: center;
		overflow: hidden;
		white-space: nowrap;
		max-width: 100%;
		text-overflow: ellipsis;
		margin: auto !important;
		margin-bottom: 10px;
}


.product .product-info>p {
		margin-left: 0;
		text-align: center;
		overflow: hidden;
		white-space: nowrap;
		max-width: 100%;
		text-overflow: ellipsis;
		margin: auto !important;
		margin-top: 5px !important;
		margin-bottom: -20px;
		font-size: 12px;
		height: 14px;
}

.product.product-small .product-info>p {
		margin-left: 0;
		text-align: center;
		overflow: hidden;
		white-space: nowrap;
		max-width: 100%;
		text-overflow: ellipsis;
		margin: auto !important;
		margin-top: 3px !important;
		margin-bottom: -20px;
		font-size: 8px;
		height: 14px;
}

.product-image {
    width: 200px;
}

.product .product-info i.fa.fa-arrow-right {
}

.product:hover {}

.topbar>i.fa.fa-arrow-left.back {
    z-index: 2;
    font-size: 17px;
    position: relative;
    margin-left: unset;
    top: 0;
    left: 0;
    margin-left: 35px;
    margin-right: -14px;
}

.topbar i.fa.fa-arrow-left.back {
    position: relative;
    top: 0;
    left: 0;
    margin-left: 35px;
    margin-right: 0px;
}

.product-image, .system-image {
    width: 200px;
    height: 200px;
    justify-content: center;
    display: flex;
    margin-right: 40px;
    position: relative;
}

.product-card .product-options .finish-list {
}

.variant .flex, .flex {
    display: flex;
    flex-direction: row;
}

.product-card .flex.product-head {
    padding: 40px;
    justify-content: space-around;
    border-bottom: 1px solid #00000012;
    height: 220px;
}

.product-card .product-options, .product-card .product-tags {
    width: -webkit-fill-available;
    width: 382px;
    position: relative;
}

.product-card .title {
    margin-bottom: -20px;
    margin-left: 40px;
    font-size: 24px;
    color: #4e4e4e;
}

.product-options h3, .product-tags h3 {
    margin-top: 15px;
    margin-bottom: 25px;
}

.product-card .variants-list {
    margin: auto;
    width: 700px;
    margin-top: 40px;
    position: relative;
}

.variant {
    width: 370px;
    height: 350px;
    box-shadow: 0 0 4px #0000003d;
    border-radius: 4px;
    margin: 20px;
    position: relative;
    display: flex;
    flex-direction: column;
    padding-top: 40px;
}

.variant .product-image {
    height: 130px;
    width: 130px;
    justify-content: center;
    display: flex;
    margin-right: 0;
}

.variant .data-body {
    font-family: monospace;
}

.variant .table {
    margin-left: 1px;
    font-size: 10px;
    font-family: monospace;
    width: 160px;
    margin-right: 10px;
}

.variant input {
    width: 95px;
    border-radius: 0;
}

.variant .modify {
    margin-left: auto;
    margin-right: 40px;
    font-size: 20px;
}

.variant .variant-option-data {
    margin-left: 0px;
    font-size: 13px;
    width: fit-content;
    min-width: 100px;
    text-transform: capitalize;
    margin-top: 20px;
    position: absolute;
    top: 0px;
}

.variant .table.sku {
    margin-left: auto;
    margin-right: 20px;
    width: 180px;
}


.product-image.editable:hover img {
    filter: brightness(0.5);
}

.product-image .modify {
    display: none;
    position: absolute;
    z-index: 12;
}

.product-image:hover modify {
    display: block;
}

.product-image.editable:hover .modify {
    display: flex;
    flex-direction: column;
    top: 50%;
    transform: translate(0,-50%);
    font-size: 30px;
    color: white;
}

.product-image .fa {
    padding: 20px;
}

.variant-count .fa-plus {
    font-size: 18px;
    float: right;
    margin-right: 38px;
    cursor: pointer;
}

.variants-list .add {
    position: absolute;
    right: 40px;
    left: unset;
    margin-top: 4px !important;
}

.variant:last-of-type {
}

.edit-variant {
    width: 900px;
    height: 570px;
}

.edit-variant .finish-list.variant-options {
}

.edit-variant .variant-head {
    display: flex;
}

.edit-variant .variant-head {
    margin-top: 35px;
    margin-left: 40px;
    margin-right: 40px;
    justify-content: center;
    align-items: start;
    padding-bottom: 40px;
    border-bottom: 1px solid #0000000d;
}

.edit-variant .other.finish-list {
    margin-top: 30px;
    width: 80%;
}

.topbar.white .item.open {
    outline: 1px solid #00000029;
}

.tab-list {
    height: 50px;
    box-shadow: 0px 2px 4px #0000001a;
    display: flex;
    align-items: center;
}

.tab-list .item {
    width: fit-content;
    padding: 16px 50px;
    overflow: hidden;
    border-right: 1px solid #0000000f;
}

.tab-list .item:hover {
    background-color: #00000005;
    cursor: pointer;
}

.tab-list .item:last-of-type {
    border-right: unset;
}

.tab-page {
    position: relative;
    overflow: hidden;
    width: 100%;
}

.variant .data-body {
    height: 80px;
    display: flex;
    align-items: center;
    text-transform: uppercase;
    flex-wrap: wrap;
}

.variant-option-data {}

.variant .data-body .data {
    margin-right: 40px;
    height: 16px;
}

.variant-sub-data {
    height: 32px;
    margin-top: 20px;
    align-items: start;
    justify-content: center;
    display: flex;
    flex-wrap: wrap;
    flex-direction: column;
}

.variant .data-body .data:first-of-type {
}

.d-label {display: inline-block;width: 40px;}

.edit-variant .product-image {
    width: 280px;
    height: 200px;
    display: flex;
}

.notice {
    text-align: center;
    margin-top: 50px;
    font-weight: lighter;
}

.product-selector, .document-selector {
    width: 710px;
    height: 560px;
}

.product-boxed .product-image {
    width: 200px;
    height: 200px;
    margin-right: unset;
}

.product-boxed {
    width: 250px;
    height: 280px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    padding: 15px;
    position: relative;
    overflow: hidden;
    cursor: pointer;
}

.product-boxed p {
    width: 100%;
    height: 16px;
    overflow: hidden;
    margin-left: unset;
    white-space: nowrap;
    margin-top: 30px;
    text-align: center;
    text-overflow: ellipsis;
}

center {}

.product-boxed:hover .product-image {filter: brightness(0.5);}

.product-selector .products {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    margin: auto;
    margin-top: 40px;
    margin-bottom: 40px;
}

.product-small {
    width: 200px;
    height: 218px;
}

.product-small .product-image {
    width: 180px;
    height: 125px;
    margin-top: 0px;
}

.product-small .product-info h2 {font-size: 11px;}

.product-small .modify {
    margin-right: 10px;
    font-size: 13px;
    flex-shrink: 0;
}

.detail .product-image {
    height: 250px;
    width: 250px;
}

.detail .detail-head {
    margin: 40px;
    display: flex;
    align-items: center;
}

.detail-head .finish-list {
    width: 55%;
    left: unset;
    position: relative;
    transform: unset;
    margin: auto;
}

.next.error {
    background-color: #e83c3cc9 !important;
}

.next.error i.fa {
    top: 49%;
}

.series-card .topbar i.fa.fa-edit {
    margin-left: auto;
}

.series-card .topbar i.fa.fa-trash {
    margin-right: 30px;
}

.series-card .topbar i {
    cursor:pointer;
}

.topbar i.fa.fa-angle-left.back {
    position: relative;
    top: 0;
    left: 0;
    margin-left: 15px;
    margin-right: -30px;
}

.object-list{
    margin-top: 30px;
    display: flex;
    flex-direction: column;
    justify-content: start;
    align-items: center;
    width: 90%;
    position: relative;
    flex-wrap: wrap;
    justify-content: center;
    flex-direction: row;
    margin: auto;
    margin-bottom: 30px;
    margin-top: 30px;
    flex-wrap: wrap;
}

.flow i.fa.fa-project-diagram {font-size: 25px;margin-top: 0;margin-bottom: 60px;}

.flow .flow-info {
    margin-top: 0px;
    margin-bottom: 20px;
}

.block-editor {
    width: 100%;
    height: calc(100% - 50px);
}

.flow.ui-list-item {
    height: 113px;
}

.flow h2 {
    margin: 5px;
}


.page .add:not(button) {
    margin-top: 30px;
}

.modal.edit-flow {
    width: 600px;
    height: 400px;
}

.modal.manage-flow {
    width: 600px;
    height: 400px;
}

.modal.flow-point-select {
    width: 700px;
    height: 500px;
}

.flow-point-select .search {
    margin-right: 30px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 220px;
}

.modal.upload-flow-script {
    width: 570px;
    height: 350px;
}

.upload-flow-script input[type="file"] {
    width: 240px;
}


.modal.customer-select {
    width: 95%;
    height: 85%;
    overflow: hidden;
    background-color: #2196f3;
}

.modal.customer-select iframe {
    width: 100%;
    height: calc(100% - 50px);
    border-radius: 3px;
    overflow: hidden;
    border: unset;
}

.customer-select .topbar .next {
    margin-left: 30px;
}

body.plain > .customer-card {
    top: 0px;
    height: 100%;
}

.search-sidebar h2 {
    margin-bottom: 3px;
    margin-top: 23px;
    margin-left: auto;
}

.create-transaction .customer.ui-list-item {transform-origin: top right;transform: scale(.6);position: absolute;right: 60px;}

.create-transaction .name-container {
    height: 135px;
}


.customer-card.flagged .card-name:not(.add-name) {
}

.customer-card .main>.status {
    right: unset;
    left: 20px;
    top: 25px;
    color: #3d3d3d;
    display: flex;
    flex-direction: column;
    justify-content: start;
    background-color: white;
    border-radius: 6px;
    border: 1px solid #3b3b3b;
}

.customer-card .status>* {
    margin-bottom: 17px;
}

.revision.flagged.open {
    background-color: #ff9720;
    color: white;
}

.revision.flagged {
    background-color: #ff97205c;
}

.customer.flagged .customer-header {
    background-color: #ff8800;
    color: white;
}

.customer.flagged i.fa {
    color: white;
}

.customer.flagged.population-selected {
    box-shadow: 0 0 0px 2px #ff8800;
}

.customer.flagged i.fa-flag {
    margin-left: auto;
    margin-right: 20px;
    font-size: 13px;
}

.flagged *:not(.pii-container)>.card-names>.card-name[contenteditable] {
    background-color: #ff9720bf;
}

.customer-card .finish-item.flagged-object {
    background-color: #ffa0004d;
    border-radius: 6px;
}

.transaction-item.flagged-object {
    box-shadow: 0 0 0px 1px #ffa000;
}
.modal.revision-menu {
    width: 900px;
    height: 600px;
}

.page {
    overflow-y: scroll;
    overflow-x: hidden;
    height: calc(100% - 50px);
    position: relative;
    z-index: 1;
    transition: all 300ms;
}

.encapsulate.encapsulate-presentation {
    width: 100%;
    height: 100%;
    position: fixed;
    background-color: white;
    z-index: 4;
    top: 0;
}

.flag-select .customer-card {
    position: absolute;
    transform: rotate(0deg);
    width: calc(100% - 250px);
    left: 250px;
    height: calc(100%);
}

.flag-action-bar {}

.flag-action-bar {
    background-color: white;
    position: absolute;
    position: absolute;
    height: calc(100% - 50px);
    bottom: 0px;
    width: 60px;
    right: 0px;
    box-shadow: 0 0 5px 0 #00000033;
    display: flex;
    flex-direction: column;
    align-items: center;
    z-index: 1;
    transition: all 200ms;
    transform: translateX(0px);
}

.flag-action-bar.right {
    transform: translateX(110%);
}

.encapsulate .page {
    height: 100%;
}

.next.relative {
    bottom: unset;
    transform: unset;
    left: unset;
}

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

.next.flag-queue {
    margin: auto;
    margin-bottom: 10px;
}

.central-actions {
    width: 200px;
    margin-right: auto;
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
}

.modal.flag-select {
    width: 1246px;
    height: 700px;
}

.flag-select .next.release {
    background-color: green;
}

.notification.move-left {
    transform: translateX(95%);
}

.status i.fa.fa-flag.has-action:hover {
    transform: scale(1.1);
    transition: all 200ms;
    cursor: pointer;
    filter: invert(1);
}

.splash {
    width: 100%;
    height: 100%;
    position: fixed;
    background-color: #2196f3;
    z-index: 1000;
    display: flex;
}

.splash img {
    width: 100px;
    object-fit: cover;
    position: relative;
    margin: auto;
    transform: translateY(-55px);
}

[point-set='access-management-topbar'][point='users'] .finish-list {
    width: 60%;
    margin-top: 30px;
}

[point-set='access-management-topbar'][point='keys'] .finish-list {
    width: 60%;
    margin-top: 30px;
}

.topbar.white.retract {margin-top: -60px; margin-bottom:10px;}

.modal.invoice {
    width: 10in;
    height: 6in;
}

.modal.invoice .demon-large-item {
    box-shadow: unset;
    margin-top: 30px;
    margin-bottom: 20px !important;
    margin: 8px 20px 30px 20px;
}

.population-list-export .next.clear {
    background-color: #3f51b5;
}

.freeze * {
  -webkit-transition: none !important;
  -moz-transition: none !important;
  -o-transition: none !important;
  -ms-transition: none !important;
  transition: none !important;
}

.page.extend {
    height: 100%;
}

.modal.onboard-first {
    width: 1000px;
    height: 600px;
}

.page.content {
    position: absolute;
    top: 50px;
}

.user-detail i.fa.fa-user {
    margin-right: 7px;
}

.user-detail {
    padding: 6px 14px;
    border-radius: 5px;
    overflow: hidden;
    white-space: nowrap;
    flex-shrink: 0;
}

.modal.user-actions {
    width: 600px;
    height: 400px;
}

[point='overview'] .demon-large-item {
}

[point='modules'] .finish-list {
    margin-top: 0px;
}

.product-list, .object-list {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: center;
    margin-top: 40px;
    margin-bottom: 40px;
}


.topbar i.fa-plus.add {
    margin-left: auto;
    margin-right: 30px;
    cursor: pointer;
    left: unset;
    top: unset;
    margin-top: unset;
}

.sequenced-item {
    width: 600px;
    height: 260px;
    margin: 20px auto;
    display: flex;
    flex-direction: row;
    box-shadow: 0 0 4px #0000003d;
    padding: 20px;
    border-radius: 6px;
}

.sequenced-item:first-child {
}

.sequenced-item .product-small {
    box-shadow: unset;
    margin: unset;
    width: 250px;
}

.sequenced-item .finish-list i {
    margin-left: 15px;
}

.edit-series-item {
    width: 700px;
    height: 500px;
}

.nothing-to-show {
    text-align: center;
    position: absolute;
    left: 50%;
    transform: translate(-50%, -50%);
    top: 38%;
    white-space: nowrap;
}

.nothing-to-show h2 {
    margin: unset;
}

.nothing-to-show .fa {
    margin-bottom: 20px;
}

.nothing-to-show * {
    color: #4d4d4d !important;
}

.edit-variant .variant-options {
    position: relative;
    height: 200px;
    width: -webkit-fill-available;
    border-radius: 6px;
}

.topbar-push {
    margin-left: auto;
    margin-right: 30px;
}

.action {
    cursor: pointer;
}

.modal.edit-image {
    width: 700px;
    height: 500px;
}

.edit-image [point='address'] .system-image {
    margin-left: 30px;
}

.edit-image .flex {
    margin-top: 30px;
}

[point='address'] input {
    width: 212px;
}

.variant-options .nothing-to-show {top: 48%;}

.variant .body {
    width: 300px;
    margin-top: 20px;
}

.variant .finish-list {
    margin-top: unset;
    font-size: 12px;
}

.variant .flex {
    justify-content: space-around;
    margin-bottom: 10px;
}

.campaign h2 {
		margin-left: 0;
		text-align: center;
		overflow: hidden;
		white-space: nowrap;
		text-overflow: ellipsis;
		/*margin-bottom: 10px;
		/margin-top: 20px;*/
		margin: 10px auto;
		max-width: 100%;
		margin-bottom: 7px;
}

.campaign {
    margin: 21px;
    width: 380px;
    border-radius: 7px;
    position: relative;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    box-shadow: 0 0 4px #0000003d;
    height: 375px;
    position: relative;
}

[point-set='campaign-card-sidebar'] iframe {
    width: 100%;
    height: 100%;
    border: unset;
    display: block;
}


.campaign-mailing {
    margin: 20px;
    width: 330px;
    border-radius: 7px;
    position: relative;
    overflow: hidden;
    display: flex;
    align-items: center;
    flex-direction: column;
    box-shadow: 0 0 4px #0000003d;
    padding: 20px 20px;
    height: 120px;
}

.campaign-mailing>h2 {
    margin-left: unset;
}

[point-set='campaign-mailing-sidebar'] iframe {
    width: 100%;
    height: 100%;
    display: block;
    border: unset;
}




[point-set='campaign-mailing-sidebar'] iframe {
    width: 100%;
    height: 100%;
    display: block;
    border: unset;
}


.user {
    margin: 21px;
    width: 195px;
    position: relative;
    overflow: hidden;
    display: flex;
    align-items: center;
    flex-direction: column;
    box-shadow: 0 0 4px #0000003d;
    padding: 20px 20px;
    height: 241px;
    border-radius: 6px;
}

.user.key h2 {
    margin-top: 5px;
}

.user.key {
}

.user.key small {
    font-size: 11px;
}

.user h2 {
    margin-top: 10px;
}

.mailing-item {
    margin: 21px;
    width: 380px;
    border-radius: 7px;
    position: relative;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    box-shadow: 0 0 4px #0000003d;
    height: 375px;
    position: relative;
}

.mailing-item:first-child {
}

.mailing-item .finish-item i {
}

.switch.disabled {filter: grayscale(.6);cursor: no-drop;}

.switch.disabled::after {
    background-color: white;
}

.mailing-results-small {
    width: 250px;
    position: relative;
}

.mailing-item h2 {
    margin: unset;
    margin-bottom: 15px;
}

.mailing-item .finish-list {
    font-size: 13px;
}

.mailing-item .fa-check {
    color: green;
}

.mailing-item .flex>div>p {
}

.linear-list {
    margin-top: 60px;
    margin-bottom: 60px;
}

.create-transaction .desc {
    text-align: right;
}

.select-campaign.modal {
    width: 800px;
    height: 600px;
}

.select-address.modal {
    width: 800px;
    height: 600px;
}

.document {
    width: 330px;
    margin: 21px;
    width: 185px;
    border-radius: 7px;
    position: relative;
    overflow: hidden;
    display: flex;
    align-items: center;
    flex-direction: column;
    box-shadow: 0 0 4px #0000003d;
    padding: 20px 20px;
    height: 230px;
}

.document>.fa {
    font-size: 58px;
    margin-top: 30px;
    margin-bottom: 30px;
}

.document h2 {
    margin: 0 auto;
    margin-top: 10px;
    text-align: center;
    overflow: hidden;
    white-space: nowrap;
    max-width: 100%;
    text-overflow: ellipsis;
    margin-bottom: 10px;
    font-size: 15px;
}

.document .document-info {
    width: -webkit-fill-available;
    margin-right: auto;
    height: 100%;
    margin-top: 20px;
}

.document .fa-cog {
    font-size: unset;
    position: absolute;
    bottom: 2px;
    right: 20%;
}

div#html-container {
    height: 100%;
}



.tox-toolbar-overlord {
    margin-top: -1px !important;
}

.tox-toolbar__primary {
    position: fixed !important;
    width: 100% !important;
}

.tox-sidebar-wrap {
    margin-top: 38px !important;
}

.custom-page-size.modal {
    width: 500px;
    height: 300px;
}

.page-setup.modal {
    width: 1000px;
    height: 600px;
}

.modal.merge-menu {
    width: 700px;
    height: 500px;
    z-index: 68;
}

.subscription-model {
    width: 500px;
    height: 300px;
    box-shadow: 0 0 4px #0000003d;
    border-radius: 6px;
    margin: 20px auto;
    overflow: hidden;
}

.subscription-model>p {
    margin-left: 30px;
    font-size: 16px;
}

.subscription-model i.fa.fa-cog {
    margin-left: auto;
    margin-right: 30px;
    cursor: pointer;
}

.edit-series-subscription-model {
    width: 800px;
    height: 500px;
}

.bulk-actions-menu.modal {
    width: 700px;
    height: 500px;
}

.create-mailing.modal {
    width: 600px;
    height: 400px;
}

.customer[noclick] {
    cursor: no-drop;
}

.customer i.fa-minus-circle {
    margin-left: auto;
    margin-right: 20px;
    color: red;
    font-size: 12px;
    cursor: pointer;
}

.topbar.white {
    padding: 0px 0;
}

.display-item.no-sep {
    border-right: unset;
}

.personal-info li, .object-container:not(.basic) li:not([category]) {padding-left: 40px !important;}

.iso-lookup-tab .finish-list {
    margin-top: 0px;
}

.finish-item.selectable.warn {
    background-color: #ffc04c;
    padding-left: 50px;
}

.finish-item.selectable.warn i.fa-exclamation-triangle {
    margin-right: 5px;
    margin-bottom: 5px;
    position: absolute;
    top: 50%;
    transform: translate(-31px, -50%);
}
.customer-info.notes .finish-list {
    margin-top: 0px;
}

datalist {
    display: none !important;
}

.user i.fa.fa-user, .user i.fa.fa-key {
    font-size: 35px;
    margin-top: 34px;
}

.view-credential .finish-list {
    width: 80%;
    margin-top: 30px;
    margin-bottom: 60px;
}

.modal.create-restriction {
    width: 600px;
    height: 400px;
}

.modal.refactor-product-variants {
    width: 950px;
    height: 650px;
}

.refactor-product-variants .finish-item .fa.action {
    transform: translateY(2px);
}


.refactor-product-variants div#options {
    transform: unset;
    left: unset;
    margin-top: unset;
}

.refactor-product-variants .finish-item {
    padding-top: 4px;
    padding-bottom: 4px;
    font-size: 13px;
}

.refactor-product-variants .finish-list {
    left: unset;
    transform: unset;
    margin-top: unset;
}

.refactor-product-variants input[type="text"] {
    width: 130px;
    font-size: inherit !important;
    padding: 3px;
    padding-right: 10px;
}

input[type="datetime-local"] {
    width: 220px !important;
    padding-left: 10px !important;
}


.campaign .display-item {
    max-width: 300px;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.campaign.small-campaign-card {
    height: 50px;
    width: 700px;
    margin: 5px;
    box-shadow: 0 0 2px 0 #00000054;
    border-radius: unset;
    padding: 2px;
    border-radius: 3px;
}

.campaign.small-campaign-card>.topbar {
    box-shadow: unset;
}
.campaign-mailing.small-mailing-card>.topbar {
    box-shadow: unset;
}

.campaign-mailing.small-mailing-card {
    height: 50px;
    width: 700px;
    margin: 5px;
    box-shadow: 0 0 2px 0 #00000054;
    border-radius: unset;
    padding: 2px;
    border-radius: 3px;
}


.modal.customer-toolbox {
    width: 700px;
    height: 500px;
}

.modal.merge-customers {}

.modal.merge-customers {
    width: 600px;
    height: 400px;
}

input[type="radio"] {
    width: unset;
    height: unset;
    padding: unset;
    -webkit-appearance: radio;
    cursor: default;
    border: unset !important;
    outline: none !important;
    border-radius: unset;
}

input[type="checkbox"] {
    width: unset;
    height: unset;
    padding: unset;
    -webkit-appearance: checkbox;
    cursor: default;
}

.flag-select .page>.finish-list {
    margin-top: unset;
}

.flag-select .history-sidebar i.fa.fa-arrow-left.back {
    display: none !important;
}

.checklist {
}

.path-vertical .checklist {
    text-align: left;
    padding-top: 13px;
    padding-bottom: 13px;
    margin-left: 40px;
    position: relative;
    transition: all 100ms;
    display: flex;
    align-items: center;
    user-select: none; -webkit-user-select: none;
}

.flow-bubble {
    width: 30px;
    height: 30px;
    background-color: #353535;
    border-radius: 100%;
    position: relative;
    transform: translate(-50%, 0px);
    z-index: 2;
    margin-right: 10px;
    box-shadow: 0 0 18px 2px #0000003b;
    transition: all 100ms;
    flex-grow: 0;
    flex-shrink: 0;
}

.flow-line {
    position: absolute;
    width: 17px;
    background-color: #adc8ff;
    left: 0px;
    top: 50%;
    height: 100%;
    transform: translate(-50%, 0px);
    box-shadow: 0 0 6px 0 #00000030;
    transition: all 100ms;
}

.checklist:not(.open):not(.active) .flow-line-top {
}

.checklist.open .flow-line, .checklist:not(.open):not(.active) .flow-line {
    background-color: #f2f2f2;
    outline: 2px dotted;
    outline-offset: -2px;
}

.active .flow-bubble {
    background-color: #adc8ff;
}

h3 {}

.checklist h3 {
    margin: unset;
}

.checklist i.fa.fa-lock {
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    color: #cccccc;
    font-size: 12px;
}

.checklist.open .flow-bubble {
    background-color: #558dff;
}

.checklist.open .fa, .checklist.active .fa {
    display: none;
}

.checklist.active .fa {}

.checklist.locked {
    cursor: not-allowed;
}

.checklist {
    cursor: pointer;
    position: relative;
}

.checklist:not(.locked):hover .flow-bubble{
    background-color: #75a2ff;
}

.checklist.locked:hover .flow-bubble .fa{
    color: white;
}

.checklist.locked:hover .flow-bubble{
    background-color: #262626;
}

.checklist.outline-hover-path .flow-line {
    outline: 2px solid #adc8ff !important;
    background-color: #adc8ff !important;
}

.checklist.outline-hover .flow-bubble {
    background-color: #adc8ff;
}

.checklist.outline-hover-path .flow-bubble{
    background-color: #adc8ff;
}

.checklist.outline-hover-exclude .flow-line, .checklist.outline-hover .flow-line {
    filter: opacity(.6);
    /*outline: 2px dotted;
    outline-offset:-2px;*/
}

.checklist.outline-hover-exclude .flow-bubble {
    background-color:#353535;
}

.checklist.outline-unreachable {
    cursor: not-allowed !important;
}

.checklist.outline-unreachable:hover .flow-bubble {
    background-color: #353535;
}

.sidebar-retracted i.fa.fa-arrow-right {
    position: absolute;
    top: 0;
    right: 0;
    width: 50px;
    height: 10000%;
    text-align: right;
    cursor: pointer;
    transform: translate(0px, 0px);
}

.sidebar.sidebar-retractable:not(.sidebar-retracted) i.fa.fa-arrow-right {
    display: none;
}

.sidebar-retracted .fa-arrow-right::before {
    position: relative;
    top: 20px;
    right: 18px;
}

.sidebar-retracted i.fa.fa-arrow-right:hover {
    background-color: #00000008;
}

[path-set='fulfill-path'] .itemlist {
    width: 70%;
    margin: auto;
    margin-top: 60px;
}

.path {
    position: relative;
    margin: auto;
    display: flex;
    flex-direction: row;
    align-items: center;
    width: fit-content;
    margin-top: 20px;
    padding-bottom: 30px;
    margin-bottom: 20px;
}

.path .checklist .flow-line {
    height: 17px;
    width: 100%;
    left: 15px;
    transform: translate(0%, -50%);
}

.path .checklist {
    padding-right: 40px;
    align-items: center;
    display: flex;
}

.path .flow-bubble {
    margin-right: unset;
    transform: translate(0px);
}

.path .checklist:last-of-type {
    padding-right: unset;
    width: 30px;
}

.path .checklist h3 {
    position: relative;
    transform: translate(calc(-50% + -15px), 30px);
    white-space: nowrap;
}

.checklist.list-in .flow-line {
    transform: rotate(-17deg);
}

.checklist.list-out .flow-line {
    transform: rotate(17deg) translate(-100%, 0);
}

.sidebar .checklist:hover {
    border-right: 3px solid #75a2ff;
}

.sidebar .checklist.locked:hover {
    border-right: none;
}

.queue-select .page>.itemlist {
    width: 70%;
    margin: auto;
    margin-top: 105px;
}

.checklist.list-tabbed {
    margin-left: 57px;
}

.modal.edit-product {
    width: 800px;
    height: 500px;
}

.create-transaction [point-set="subscription-config-topbar"] .itemlist {
    width: 80%;
    margin: auto;
    margin-top: 80px;
}

.modal.migrate-transaction {
    width: 500px;
    height: 300px;
}

.transaction-item.highlight {
    box-shadow: 0 0 0px 1px #2c6ff0;
}

.modal.edit-transaction-cart {
    width: 700px;
    height: 480px;
}

.modal.edit-transaction-cart .itemlist {
    width: 80%;
    margin: auto;
    margin-top: 50px;
}

.create-document.modal {
    width: 800px;
    height: 500px;
}

.modal.create-communication {
    width: 600px;
    height: 400px;
}

.modal.set-communication-recipients {
    width: 500px;
    height: 300px;
}

.payment-methods {
    height: 500px;
}

.modal.add-payment-method {
    width: 900px;
    height: 550px;
}

.modal.billing-information {
    width: 750px;
    height: 500px;
}

.demon-large-item.notification-settings .finish-list {
    margin-top: 30px;
    width: 95%;
}

ul {
    font-weight: lighter;
}

li, li[openable]>.open {}

.popover ul li:hover {outline: 1px solid #e8e8e8;}

ul[list] li {
    display: flex;
    justify-content: space-between;
    padding: 0.83em 30px;
    align-items: center;
    border-bottom: 1px solid #ececec8f;
    position: relative;
    align-items: center;

background-color: white;}

ul[list] li:last-of-type {
    border-bottom: unset;
}

li[openable], li[category] {display: block !important;cursor: pointer;user-select: none; -webkit-user-select: none;padding: 0px 0px !important;}

li[openable]>ul, li[category]>ul {border-left: 1px dashed #666666;width: calc(100% - 21px);margin-left: 20px;transform: unset;}

li[openable]>.open, li[category]>.category {left: 0;top: 0;position: relative;display: flex;justify-content: space-between;align-items: center;padding: .8em 30px;}

li[openable] .open:hover {
    background-color: #f3f3f3;
    cursor: pointer;
}

li[openable][open]>.open>.fa-angle-right {
    transform: translate(-2px, 0px) rotate(90deg);
    transition: all 200ms;
}

li[openable]>.open>.fa-angle-right {
    transform: translate(-2px, 0) rotate(0);
    transition: all 200ms;
}

li[openable][open] {
    height: fit-content;
}

li[openable]:not([open])>ul {
    display: none;
}

li[category][hidden]>ul {
    display: none;
}

li[openable]>ul>li:first-of-type, li[category]>ul>li:first-of-type {
    border-top: 1px solid #00000008;
}

.edit-address-component.modal {
    width: 800px;
    height: 600px;
}

.popover li>i {
    margin-left: 20px;
    width: 20px;
    text-align: center;
}

p.preview {
    margin-right: 30px;
    margin-left: auto;
}

.topbar.white.large-topbar {
    transform: unset;
    padding: unset;
    height: 70px;
}

.advanced-search .topbar h2 {
    margin-left: auto;
    margin-right: auto;
}

.advanced-search i.fa.fa-info-circle {
    margin: 0px 10px 0px 0px;
}

.popover.right-top-arrow:before {
    left: unset;
    right: 1px;
    transform: translate(50%, -50%) rotate(45deg);
    top: 11px;
}

.popover.right-top-arrow:after {right: 1px;left: unset;top: 12px;}

.variant .flex {
    flex-direction: column;
    align-items: center;
    margin-top: 15px;
    height: 240px;
    justify-content: space-evenly;
}
.advanced-search ul li {
    background-color: white;
}

.advanced-search .main .value>* {
    margin-left: 10px;
    margin-right: 10px;
}

.advanced-search .main ul {
    max-height: calc(100% - 16% - 40px);
    overflow: scroll;
    margin-bottom: unset;
    margin-top: unset;
}
.object-selector {
    width: 200px;
    height: 20px;
    border: 1px solid #2a9bff;
    padding: 2px 5px 2px 5px;
    border-radius: 4px;
}

.object-select {
    min-width: 20px;
    transition: all 200ms;
    height: 22px;
    display: inline-flex;
    align-items: center;
    background-color: #4caf50;
    border: 1px dashed #4caf50;
    padding: 5px 20px 5px 15px;
    border-radius: 5px;
    white-space: nowrap;
    overflow: hidden;
    cursor: pointer;
}

.object-select:focus, .object-select:hover  {
}

.object-select i {
    margin-right: 13px;
}

.object-select span {
    width: calc(100%);
    overflow: hidden;
    text-overflow: ellipsis;
}

.object-select[required]:not([set]) {
    background-color: #fff0eb;
    border: 1px dashed #ff8686;
}

.object-select:not([required]):not([set]) {
    background-color: #fbfbfb;
    border: 1px dashed #b7b7b7;
}

.object-select[required]:not([set]) i.fa.fa-stroopwafel {

    color: #792020;
}

.object-select:not([required]):not([set]) i.fa.fa-stroopwafel{
    color:#474747;
}

.object-select[reqired]:not([set]) span {
    color: #b4a9a9;
}

.object-select[set] {
    color: white;
}

.object-select[set] i.fa.fa-ban {
    display: block;
    color: #293b2a42;
}

.object-select i.fa.fa-ban {
    display: none;
}

.object-select[set] i.fa.fa-stroopwafel {
    display: none;
}

.object-select i.fa.fa-stroopwafel {}

.object-select[set]:not([disabled]):hover i.fa.fa-ban {
    color: white;
}

.object-select[set]:not([no-change]):hover {
    background-color: #70b873;
    border: 1px solid #70b873;
}

.object-select:not([reqired]):not([set]) span {
    color: Gray;
}

.object-select:not([required]):not([set]):not([disabled]):hover {
    border: 1px solid #00000087;
}

.object-select[required]:not([set]):not([disabled]):hover {
    border: 1px solid #ff8686;
}

.graph {
    width: 500px;
    height: 250px;
}

.graph {
    border: 1px solid #00000014;
    position: relative;
    flex-grow: 0;
    flex-shrink: 0;
    margin: 10px;
}

.graph {}

.graph .load-throbber {
    top: 50%;
    position: absolute;
}

.topbar.white.fix-pad {
    padding: 0px 20px;
    transform: translateX(-40px);
    width: calc(100% + 20px);
}

.graph .page {
    padding: 20px;
}

[point='usage'] .graph:last-of-type {
    margin-bottom: 30px;
}

.modal.quick-product-information {
    width: 800px;
    height: 600px;
}

.modal.customer-communications {
    width: 1050px;
    height: 700px;
}

.modal.new-customer-communication {
    width: 650px;
    height: 450px;
}

.modal.pdf-preview {
    width: 90%;
    height: 90%;
}

.modal.email-preview {
    width: 90%;
    height: 80%;
}




/* Email Client UI */

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

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

.dropdown, .dropleft, .dropright, .dropup {
    position: relative;
}

svg {
    overflow: hidden;
    vertical-align: middle;
}

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

.flex-wrap {
    -ms-flex-wrap: wrap!important;
    flex-wrap: wrap!important;
}


@media (min-width: 992px) {
    .inbox-wrapper .email-aside .aside-content {
        padding-right: 10px;
    }
}

.inbox-wrapper .email-aside .aside-content .aside-header {
    padding: 0 0 5px;
    position: relative;
}

.inbox-wrapper .email-aside .aside-content .aside-header .title {
    display: block;
    margin: 3px 0 0;
    font-size: 1.1rem;
    line-height: 27px;
    color: #686868;
}

.inbox-wrapper .email-aside .aside-content .aside-header .navbar-toggle {
    background: 0 0;
    display: none;
    outline: 0;
    border: 0;
    padding: 0 11px 0 0;
    text-align: right;
    margin: 0;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    position: absolute;
}

@media (max-width: 991px) {
    .inbox-wrapper .email-aside .aside-content .aside-header .navbar-toggle {
        display: block;
    }
}

.inbox-wrapper .email-aside .aside-content .aside-header .navbar-toggle .icon {
    font-size: 24px;
    color: #71738d;
}

.inbox-wrapper .email-aside .aside-content .aside-compose {
    text-align: center;
    padding: 14px 0;
}

.inbox-wrapper .email-aside .aside-content .aside-compose .btn,
.inbox-wrapper .email-aside .aside-content .aside-compose .fc .fc-button,
.fc .inbox-wrapper .email-aside .aside-content .aside-compose .fc-button,
.inbox-wrapper .email-aside .aside-content .aside-compose .swal2-modal .swal2-actions button,
.swal2-modal .swal2-actions .inbox-wrapper .email-aside .aside-content .aside-compose button,
.inbox-wrapper .email-aside .aside-content .aside-compose .wizard > .actions a,
.wizard > .actions .inbox-wrapper .email-aside .aside-content .aside-compose a {
    padding: 11px;
}

.inbox-wrapper .email-aside .aside-content .aside-nav {
    visibility: visible;
    padding: 0 0;
}

.inbox-wrapper .email-aside .aside-content .aside-nav.collapse {
    display: block;
}

@media (max-width: 991px) {
    .inbox-wrapper .email-aside .aside-content .aside-nav.collapse {
        display: none;
    }
}

@media (max-width: 991px) {
    .inbox-wrapper .email-aside .aside-content .aside-nav.show {
        display: block;
    }
}

.inbox-wrapper .email-aside .aside-content .aside-nav .title {
    display: block;
    color: #3d405c;
    font-size: 12px;
    font-weight: 700;
    text-transform: uppercase;
    margin: 20px 0 0;
    padding: 8px 14px 4px;
}

.inbox-wrapper .email-aside .aside-content .aside-nav .nav li {
    width: 100%;
}

.inbox-wrapper .email-aside .aside-content .aside-nav .nav li a {
    display: -webkit-flex;
    display: flex;
    -webkit-align-items: center;
    align-items: center;
    position: relative;
    color: #71748d;
    padding: 7px 14px;
}

.inbox-wrapper .email-aside .aside-content .aside-nav .nav li a:hover {
    text-decoration: none;
    background-color: rgba(114, 124, 245, 0.1);
    color: #727cf5;
}

.inbox-wrapper .email-aside .aside-content .aside-nav .nav li a .icon svg {
    width: 18px;
    margin-right: 10px;
}

.inbox-wrapper .email-aside .aside-content .aside-nav .nav li a .badge {
    margin-left: auto;
}

.inbox-wrapper .email-aside .aside-content .aside-nav .nav li a svg {
    width: 18px;
    margin-right: 10px;
}

.inbox-wrapper .email-aside .aside-content .aside-nav .nav li.active a {
    color: #ff3366;
    background: rgba(255, 51, 102, 0.1);
}

.inbox-wrapper .email-aside .aside-content .aside-nav .nav li.active a .icon {
    color: #ff3366;
}

.inbox-wrapper .email-content .email-inbox-header {
    background-color: transparent;
    padding: 18px 18px;
}

.inbox-wrapper .email-content .email-inbox-header .email-title {
    display: -webkit-flex;
    display: flex;
    -webkit-align-items: center;
    align-items: center;
    font-size: 1rem;
}

.inbox-wrapper .email-content .email-inbox-header .email-title svg {
    width: 20px;
    margin-right: 10px;
    color: #686868;
}

.inbox-wrapper .email-content .email-inbox-header .email-title .new-messages {
    font-size: .875rem;
    color: #686868;
    margin-left: 3px;
}

.inbox-wrapper .email-content .email-inbox-header .input-search .input-group-btn .btn,
.inbox-wrapper .email-content .email-inbox-header .input-search .input-group-btn .fc .fc-button,
.fc .inbox-wrapper .email-content .email-inbox-header .input-search .input-group-btn .fc-button,
.inbox-wrapper .email-content .email-inbox-header .input-search .input-group-btn .swal2-modal .swal2-actions button,
.swal2-modal .swal2-actions .inbox-wrapper .email-content .email-inbox-header .input-search .input-group-btn button,
.inbox-wrapper .email-content .email-inbox-header .input-search .input-group-btn .wizard > .actions a,
.wizard > .actions .inbox-wrapper .email-content .email-inbox-header .input-search .input-group-btn a {
    border-radius: 0;
    padding: 4.5px 10px;
}

.inbox-wrapper .email-content .email-inbox-header .input-search .input-group-btn .btn svg,
.inbox-wrapper .email-content .email-inbox-header .input-search .input-group-btn .fc .fc-button svg,
.fc .inbox-wrapper .email-content .email-inbox-header .input-search .input-group-btn .fc-button svg,
.inbox-wrapper .email-content .email-inbox-header .input-search .input-group-btn .swal2-modal .swal2-actions button svg,
.swal2-modal .swal2-actions .inbox-wrapper .email-content .email-inbox-header .input-search .input-group-btn button svg,
.inbox-wrapper .email-content .email-inbox-header .input-search .input-group-btn .wizard > .actions a svg,
.wizard > .actions .inbox-wrapper .email-content .email-inbox-header .input-search .input-group-btn a svg {
    width: 18px;
}

.inbox-wrapper .email-content .email-filters {
    padding: 20px;
    border-bottom: 1px solid #e8ebf1;
    background-color: transparent;
    width: 100%;
    border-top: 1px solid #e8ebf1;
}

.inbox-wrapper .email-content .email-filters > div {
    display: -webkit-flex;
    display: flex;
    -webkit-align-items: center;
    align-items: center;
}

.inbox-wrapper .email-content .email-filters .email-filters-left .btn-group,
.inbox-wrapper .email-content .email-filters .email-filters-left .fc .fc-toolbar.fc-header-toolbar .fc-left .fc-button-group,
.fc .fc-toolbar.fc-header-toolbar .fc-left .inbox-wrapper .email-content .email-filters .email-filters-left .fc-button-group,
.inbox-wrapper .email-content .email-filters .email-filters-left .fc .fc-toolbar.fc-header-toolbar .fc-right .fc-button-group,
.fc .fc-toolbar.fc-header-toolbar .fc-right .inbox-wrapper .email-content .email-filters .email-filters-left .fc-button-group {
    margin-right: 5px;
}

.inbox-wrapper .email-content .email-filters .email-filters-left input {
    margin-right: 8px;
}

.inbox-wrapper .email-content .email-filters .email-filters-right {
    text-align: right;
}

@media (max-width: 767px) {
    .inbox-wrapper .email-content .email-filters .email-filters-right {
        width: 100%;
        display: flex;
        justify-content: space-between;
    }
}

.inbox-wrapper .email-content .email-filters .email-filters-right .email-pagination-indicator {
    display: inline-block;
    vertical-align: middle;
    margin-right: 13px;
}

.inbox-wrapper .email-content .email-filters .email-filters-right .email-pagination-nav .btn svg,
.inbox-wrapper .email-content .email-filters .email-filters-right .email-pagination-nav .fc .fc-button svg,
.fc .inbox-wrapper .email-content .email-filters .email-filters-right .email-pagination-nav .fc-button svg,
.inbox-wrapper .email-content .email-filters .email-filters-right .email-pagination-nav .swal2-modal .swal2-actions button svg,
.swal2-modal .swal2-actions .inbox-wrapper .email-content .email-filters .email-filters-right .email-pagination-nav button svg,
.inbox-wrapper .email-content .email-filters .email-filters-right .email-pagination-nav .wizard > .actions a svg,
.wizard > .actions .inbox-wrapper .email-content .email-filters .email-filters-right .email-pagination-nav a svg {
    width: 18px;
}

.inbox-wrapper .email-content .email-filters .be-select-all.custom-checkbox {
    display: inline-block;
    vertical-align: middle;
    padding: 0;
    margin: 0 30px 0 0;
}

.inbox-wrapper .email-content .email-list .email-list-item {
    display: -webkit-flex;
    display: flex;
    -webkit-align-items: center;
    align-items: center;
    border-bottom: 1px solid #e8ebf1;
    padding: 10px 20px;
    width: 100%;
    cursor: pointer;
    position: relative;
    font-size: 14px;
    cursor: pointer;
    transition: background .2s ease-in-out;
}

.inbox-wrapper .email-content .email-list .email-list-item:hover {
    background: rgba(114, 124, 245, 0.08);
}

.inbox-wrapper .email-content .email-list .email-list-item:last-child {
    margin-bottom: 5px;
}

.inbox-wrapper .email-content .email-list .email-list-item .email-list-actions {
    width: 40px;
    vertical-align: top;
    display: table-cell;
}

.inbox-wrapper .email-content .email-list .email-list-item .email-list-actions .form-check {
    margin-bottom: 0;
}

.inbox-wrapper .email-content .email-list .email-list-item .email-list-actions .form-check i::before {
    width: 15px;
    height: 15px;
}

.inbox-wrapper .email-content .email-list .email-list-item .email-list-actions .form-check i::after {
    font-size: .8rem;
}

.inbox-wrapper .email-content .email-list .email-list-item .email-list-actions .favorite {
    display: block;
    padding-left: 1px;
    line-height: 15px;
}

.inbox-wrapper .email-content .email-list .email-list-item .email-list-actions .favorite span svg {
    width: 14px;
    color: #686868;
}

.inbox-wrapper .email-content .email-list .email-list-item .email-list-actions .favorite:hover span {
    color: #8d8d8d;
}

.inbox-wrapper .email-content .email-list .email-list-item .email-list-actions .favorite.active span svg {
    color: #fbbc06;
}

.inbox-wrapper .email-content .email-list .email-list-item .email-list-detail {
    display: -webkit-flex;
    display: flex;
    -webkit-justify-content: space-between;
    justify-content: space-between;
    -webkit-flex-grow: 1;
    flex-grow: 1;
    -webkit-flex-wrap: wrap;
    flex-wrap: wrap;
}

.inbox-wrapper .email-content .email-list .email-list-item .email-list-detail .from {
    display: block;
    font-weight: 400;
    margin: 0 0 1px 0;
    color: #000;
}

.inbox-wrapper .email-content .email-list .email-list-item .email-list-detail .msg {
    margin: 0;
    color: #71738d;
    font-size: .8rem;
}

.inbox-wrapper .email-content .email-list .email-list-item .email-list-detail .date {
    color: #000;
}

.inbox-wrapper .email-content .email-list .email-list-item .email-list-detail .date .icon svg {
    width: 14px;
    margin-right: 7px;
    color: #3d405c;
}

.inbox-wrapper .email-content .email-list .email-list-item.email-list-item--unread {
    background-color: rgba(114, 124, 245, 0.09);
}

.inbox-wrapper .email-content .email-list .email-list-item.email-list-item--unread .from {
    color: #000;
    font-weight: 800;
}

.inbox-wrapper .email-content .email-list .email-list-item.email-list-item--unread .msg {
    font-weight: 700;
    color: #686868;
}

.rtl .inbox-wrapper .email-aside .aside-content .aside-header .navbar-toggle .icon {
    position: absolute;
    top: 0;
    left: 0;
}

.rtl .inbox-wrapper .email-aside .aside-content .aside-nav .nav {
    padding-right: 0;
}

.rtl .inbox-wrapper .email-aside .aside-content .aside-nav .nav li a .icon svg {
    margin-right: 0;
    margin-left: 10px;
}

.rtl .inbox-wrapper .email-aside .aside-content .aside-nav .nav li a .badge {
    margin-left: 0;
    margin-right: auto;
}

.rtl .inbox-wrapper .email-aside .aside-content .aside-nav .nav li a svg {
    margin-right: 0;
    margin-left: 10px;
}

.rtl .inbox-wrapper .email-content .email-inbox-header .email-title svg {
    margin-right: 0;
    margin-left: 10px;
}

.rtl .inbox-wrapper .email-content .email-inbox-header .email-title .new-messages {
    margin-left: 0;
    margin-right: 3px;
}

.rtl .inbox-wrapper .email-content .email-filters .email-pagination-indicator {
    margin-right: 0;
    margin-left: 13px;
}

.rtl .inbox-wrapper .email-content .email-list .email-list-item .email-list-detail .date .icon svg {
    margin-right: 0;
    margin-left: 7px;
}

.email-head {
    background-color: transparent;
}

.email-head-subject {
    padding: 25px 25px;
    border-bottom: 1px solid #e8ebf1;
}

@media (max-width: 767px) {
    .email-head-subject {
        padding: 25px 10px;
    }
}

.email-head-subject .title {
    display: block;
    font-size: .99rem;
}

.email-head-subject .title a.active .icon {
    color: #fbbc06;
}

.email-head-subject .title a .icon {
    color: silver;
    margin-right: 6px;
}

.email-head-subject .title a .icon svg {
    width: 18px;
}

.email-head-subject .icons {
    font-size: 14px;
    float: right;
}

.email-head-subject .icons .icon {
    color: #000;
    margin-left: 12px;
}

.email-head-subject .icons .icon svg {
    width: 18px;
}

.email-head-sender {
    padding: 13px 28px;
}

@media (max-width: 767px) {
    .email-head-sender {
        padding: 25px 10px;
    }
}

.email-head-sender .avatar {
    float: left;
    margin-right: 10px;
}

.email-head-sender .date {
    float: right;
    font-size: 12px;
}

.email-head-sender .avatar {
    float: left;
    margin-right: 10px;
}

.email-head-sender .avatar img {
    width: 36px;
}

.email-head-sender .sender > a {
    color: #000;
}

.email-head-sender .sender span {
    margin-right: 5px;
    margin-left: 5px;
}

.email-head-sender .sender .actions {
    display: inline-block;
    position: relative;
}

.email-head-sender .sender .actions .icon {
    color: #686868;
    margin-left: 7px;
}

.email-head-sender .sender .actions .icon svg {
    width: 18px;
}

.email-body {
    background-color: transparent;
    border-top: 1px solid #e8ebf1;
    padding: 30px 20px;
}

@media (max-width: 767px) {
    .email-body {
        padding: 30px 10px;
    }
}

.email-attachments {
    background-color: transparent;
    padding: 25px 28px 5px;
    border-top: 1px solid #e8ebf1;
}

@media (max-width: 767px) {
    .email-attachments {
        padding: 25px 10px 0;
    }
}

.email-attachments .title {
    display: block;
    font-weight: 500;
}

.email-attachments .title span {
    font-weight: 400;
}

.email-attachments ul {
    list-style: none;
    margin: 15px 0 0;
    padding: 0;
}

.email-attachments ul > li {
    margin-bottom: 5px;
}

.email-attachments ul > li:last-child {
    margin-bottom: 0;
}

.email-attachments ul > li a {
    color: #000;
}

.email-attachments ul > li a svg {
    width: 18px;
    color: #686868;
}

.email-attachments ul > li .icon {
    color: #737373;
    margin-right: 2px;
}

.email-attachments ul > li span {
    font-weight: 400;
}

.rtl .email-head-subject .title a .icon {
    margin-right: 0;
    margin-left: 6px;
}

.rtl .email-head-subject .icons .icon {
    margin-left: 0;
    margin-right: 12px;
}

.rtl .email-head-sender .avatar {
    margin-right: 0;
    margin-left: 10px;
}

.rtl .email-head-sender .sender .actions .icon {
    margin-left: 0;
    margin-right: 7px;
}

.email-head-title {
    padding: 15px;
    border-bottom: 1px solid #e8ebf1;
    font-weight: 400;
    color: #3d405c;
    font-size: .99rem;
}

.email-head-title .icon {
    color: #696969;
    margin-right: 12px;
    vertical-align: middle;
    line-height: 31px;
    position: relative;
    top: -1px;
    float: left;
    font-size: 1.538rem;
}

.email-compose-fields {
    background-color: transparent;
    padding: 20px 15px;
}

.email-compose-fields .select2-container--default .select2-selection--multiple .select2-selection__rendered {
    margin: -2px -14px;
}

.email-compose-fields .select2-container--default .select2-selection--multiple .select2-selection__rendered .select2-selection__choice {
    border-radius: 0;
    background: #727cf5;
    color: #ffffff;
    margin-top: 0px;
    padding: 4px 10px;
    font-size: 13px;
    border: 0;
}

.email-compose-fields .select2-container--default .select2-selection--multiple .select2-selection__rendered .select2-selection__choice span {
    color: #ffffff;
}

.email-compose-fields .select2-container--default .select2-selection--multiple .select2-selection__rendered .select2-search {
    line-height: 15px;
}

.form-group.row {
    margin-bottom: 0;
    padding: 12px 0;
}

.form-group.row label {
    white-space: nowrap;
}

.email-compose-fields label {
    padding-top: 6px;
}

.email.editor {
    background-color: transparent;
}

.email.editor .editor-statusbar {
    display: none;
}

.email.action-send {
    padding: 8px 0px 0;
}

.btn-space {
    margin-right: 5px;
    margin-bottom: 5px;
}

.breadcrumb {
    margin: 0;
    background-color: transparent;
}

.rtl .email-compose-fields .select2-container--default .select2-selection--multiple .select2-selection__rendered .select2-selection__choice {
    float: right;
}

.rtl .btn-space {
    margin-right: 0;
    margin-left: 5px;
}
.card {
    box-shadow: 0 0 10px 0 rgba(183, 192, 206, 0.2);
    -webkit-box-shadow: 0 0 10px 0 rgba(183, 192, 206, 0.2);
    -moz-box-shadow: 0 0 10px 0 rgba(183, 192, 206, 0.2);
    -ms-box-shadow: 0 0 10px 0 rgba(183, 192, 206, 0.2);
}
.card {
    position: relative;
    display: flex;
    flex-direction: column;
    min-width: 0;
    word-wrap: break-word;
    background-color: #fff;
    background-clip: border-box;
    border: 1px solid #f2f4f9;
    border-radius: 0.25rem;
}
.badge {
    padding: 6px 5px 3px;
}
.text-white {
    color: #ffffff !important;
}
.font-weight-bold {
    font-weight: 700 !important;
}
.float-right {
    float: right !important;
}
.badge-danger-muted {
    color: #212529;
    background-color: #f77eb9;
}

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

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

.flex-wrap {
    -ms-flex-wrap: wrap!important;
    flex-wrap: wrap!important;
}

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

*, ::after, ::before {
}

svg {
    overflow: hidden;
    vertical-align: middle;
}

.dropdown, .dropleft, .dropright, .dropup {
    position: relative;
}

.dropdown-menu {
    position: absolute;
    top: 100%;
    left: 0;
    z-index: 1000;
    display: none;
    float: left;
    min-width: 10rem;
    padding: .5rem 0;
    margin: .125rem 0 0;
    font-size: 1rem;
    color: #212529;
    text-align: left;
    list-style: none;
    background-color: #fff;
    background-clip: padding-box;
    border: 1px solid rgba(0,0,0,.15);
    border-radius: .25rem;
}

/* End Email Client UI*/

.email-preview iframe {
    border: unset;
    width: 100%;
}

.valid {outline: green auto 1px;}

.modal.geocode-result {
    width: 500px;
    height: 420px;
}

p[index='formatted_address'] {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 70%;
}

.button.red {
    background-color: #900909;
}

.advanced-search .object-select {
    margin: 0px 5px;
}

.modal.bulk-action {
    width: 600px;
    height: 400px;
}

.disabled>*, [disabled]>* {
    color: gray;
}

.content.filters li[filter-id] {
    cursor: default;
}

.content.filters li[filter-id] .fa-plus {
    cursor: pointer;
}

.transactions .topbar.white {
    margin-bottom: 60px;
}

.modal.tag-select {
    height: 300px;
    width: 500px;
}

.modal.edit-customer-name {
    width: 700px;
    height: 500px;
}

.modal.change-password {
    width: 500px;
    height: 250px;
}

.topbar.white.line {
    box-shadow: unset;
    border-bottom: 1px solid #00000012;
}

.topbar.white.line {
    box-shadow: unset;
    border-bottom: 1px solid #00000012;
}

.page[point-set='product-card-topbar'][point='configuration'] {
    overflow: hidden;
}

.flex-h {
    display: flex;
    flex-direction: row;
}

.remote-order .customer {
    margin: auto;
    margin-top: 29px;
    box-shadow: unset;
    width: 78%;
    border: 1px solid #dfdfdf;
    margin-bottom: 20px;
}

.remote-order .transaction-item:first-of-type {margin-top: 150px;}

.customer [category] i.fa.fa-star, .customer [openable] i.fa.fa-star, .customer [category] i.fa.fa-exclamation-triangle, .customer [openable] i.fa.fa-exclamation-triangle {
    font-size: 9px;
}

.customer i.fa {
    color: #5266ff;
    top: 20px;
    left: 20px;
}

.add-transaction-communication {
    width: 750px;
    height: 530px;
}

.object-select[no-change] {
    cursor: default;
}

.object-select[no-change][set] i {
    display: none !important;
}

.object-select[no-change] {
    padding-left: 20px;
}

.card-names .card-name.add-name {
    border: 1px dashed #3b3b3b;
    color:#3b3b3b;
}

.card-names .card-name.add-name:hover {
    cursor:pointer;
}

.card-names.status-left {
    margin-left: 80px;
}

.modal.auto-renew {
    width: 400px;
    height: 200px;
}

.modal.bulk-import {
    width: 1300px;
    height: 700px;
}

.bulk-import td {
    border-right: 1px solid white;
    white-space: nowrap;
    padding: 5px;
    border-collapse: separate;
}

.bulk-import td:first-of-type {padding-left: 7px;}

.bulk-import tr {
    border: unset;
}

.bulk-import tr:nth-child(odd) {}

.bulk-import tr td, .bulk-import tr th {
    border: 1px solid #444444;
}

.bulk-import table {
    border-collapse: collapse;
}

.load-throbber.mini {
    position: relative;
    left: unset;
    top: unset;
    width: 30px;
    height: 30px;
    transform: unset;
    font-size: 12px;
}

.mini .throbber {
}

.remote-order .warn {
    background-color: #ffddb7;
}

.bulk-import tr td {
    cursor: pointer;
}

.bulk-import .column-select {}

.bulk-import *:not(.file-header)>td.highlight {
    background-color: #506df5;
}

.bulk-import tr[head]:first-of-type {
  position: -webkit-sticky; /* for Safari */
  position: sticky;
  top: 0px;
  background-color: white;
  z-index: 10;
  border: unset;
  outline: 2px solid #444444;
  outline-offset: -2px;
  box-shadow: 0 0 19px 0px #0000006b;
}

.bulk-import ul#columns i.fa.fa-arrow-right {
    color: gainsboro;
    margin-left: 15px;
}

.import-column-drag-ghost .rule-ui-tag{
	display:block !important;
	background-color:white;
}

#columns .rule-ui-tag {
    display: block;
}

p.rule-ui-tag {
    display: none;
}

.bulk-import #columns li.highlight, .bulk-import #dedupe li.highlight {
    background-color: #a4caff;
}

.bulk-import #columns li.highlight i.fa-arrow-right {
    color: white;
}

.modal.edit-campaign {
    width: 600px;
    height: 400px;
}

.transaction-item.medium.not-local-transaction {
    background-color: white;
}

.transaction-item.not-local-transaction .object-header {
    background-color: #ff57221c;
}

.report {
    margin: 21px;
    width: 300px;
    border-radius: 7px;
    position: relative;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    box-shadow: 0 0 4px #0000003d;
    height: 345px;
    position: relative;
}

.report i.fa.fa-chart-pie {
    font-size: 59px;
}

.flex-h {}

.flex-v {
    display: flex;
    flex-direction: column;
}

.modal.configure-report {
    width: 800px;
    height: 500px;
}

.modal.change-inventory {
    width: 500px;
    height: 300px;
}

.modal.full-sale-history {
    width: 50;
    width: 700px;
    height: 400px;
}

.modal.full-sale-history .itemlist {
    width: 80%;
    margin: auto;
    top: 47%;
    transform: translateY(-50%);
}

svg > g > g:last-child { pointer-events: none }

.modal.configure-mailing {
    width: 95%;
    height: 85%;
}

.next.include {
    background-color: #f6963c;
}

.next.exclude {
    background-color: #4e4e4e;
}

.next .fa-external-link-alt {margin: 0px 0px 0px 1px;}

.modal.configure-mailing iframe {
    width: 100%;
    height: 100%;
    border: unset;
    display: block;
}

.customer.ui-list-item li {
    white-space: nowrap;
}

.modal.configure-linkage {
    width: 700px;
    height: 500px;
}

.personal-info li[category]>ul {
    margin-left: 25px;
}

.slider {
    height: 42px;
    width: 410px;
    position: absolute;
    bottom: 30px;
    left: 50%;
    transform: translate(-50%, 0);
    border-radius: 46px;
    background-color: #f9f9f9;
    box-shadow: 0 0 6px 0 #0000004d;
    border: 1px solid #a9a9a9;
    overflow: hidden;
}

.slider .circle {
    width: 40px;
    height: 40px;
    border-radius: 100%;
    background-color: #ffffff;
    box-shadow: 0 0 8px 0 #00000033;
    border: 1px solid #dedede;
    z-index: 26;
    position: absolute;
}

.block {}

.slider .block {
    height: 100%;
    width: 300px;
    background-color: #f9f9f9;
    position: absolute;
    top: 0;
    right: 0;
}

.modal.manage-object-mirroring {
    width: 600px;
    height: 400px;
}

.modal.add-object-mirror {
    height: 400px;
    width: 700px;
}

.modal.add-object-mirroring {
    width: 550px;
    height: 320px;
}

.customer-list .customer.ui-list-item .customer-body-section, .small.customer.ui-list-item .customer-body-section {
    max-height: 130px;
    min-height: 130px;
}

i.fa.fa-send {
    transform: translate(-52%, -46%);
}

.modal.email-deliverability {
    width: 600px;
    height: 400px;
}

.graph p.graph-title {
    font-weight: normal;
    display: flex;
    align-items: center;
}

.graph i.fa.fa-info-circle {
    font-size: 13px;
    margin-left: 10px;
    transform: translate(0, 0px);
}

.graph .graph-body {
    padding: 20px;
    padding-bottom: 44px;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    height: -webkit-fill-available;
}

.graph-container {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
}

.graph .graph-header-box {
    height: 50px;
}

.graph p.graph-aggregate {
    font-size: 21px;
}

.graph .comparison-tag-box {
    color: #4f566b;
    background-color: #e3e8ee;
    border-radius: 6px;
    margin-left: 10px;
    padding-left: 10px;
    font-size: 13px;
    display: flex;
    align-items: center;
    padding-top: 0px;
    width: fit-content;
    padding-right: 10px;
    justify-content: center;
}

.comparison-tag-box .tag {
    height: fit-content;
}

.graph .graph-point {
    font-size: 13px;
    margin-top: 5px;
}

.load-throbber .load-text {
    position: absolute;
    white-space: nowrap;
    left: 50%;
    transform: translate(-50%, 21px);
    font-size: 21px;
}

.inline-throbber {
    display: flex;
    flex-direction: row;
    align-items: center;
    margin: auto;
}

.load-throbber.inline-throbber .load-text {
    left: 100%;
    top: 50%;
    transform: translate(30px, -50%);
}

.inline-throbber {}

.relative.load-throbber {
    position: relative;
    transform: unset;
    top: unset;
    left: unset;
    margin: unset;
}

.inline-throbber .load-text {
    margin-left: 21px;
}

.graph-ui-item {
    width: 100%;
    height: 100%;
    margin-bottom: 5px;
}

.graph-dashboard {
    margin: 30px 30px;
}

.dashboard-head-box {
    margin-bottom: 40px;
    padding-bottom: 10px;
    border-bottom: 1px solid #0000003d;
}

.dashboard-head-box h2 {
    margin-left: unset;
    font-weight: lighter;
    font-size: 26px;
    margin-top: unset;
}

.left-range-select {
    height: 30px;
    border-radius: 5px;
    border: 1px solid #d6d6d6;
    position: relative;
    flex-shrink: 0;
    flex-grow: 0;
}

button {
    appearance: none;
    border: unset;
    background-color: unset;
    font-size: 13px;
    padding: 5px;
    padding-left: 15px;
    color: #3b3b3b;
    font-weight: lighter;
    padding-right: 15px;
    transition: all 200ms;
    cursor: pointer;
    position: relative;
    height: 30px;
}

.graph-dashboard .controls-bar.flex-h {
    font-size: 15px;
    align-items: center;
}

.button i.fa.fa-angle-down {
    margin-right: 5px;
}

.controls-bar button i.fa.fa-angle-down {
    margin-left: 5px;
    transform: translate(0px, 1px);
}

.left-range-select button:not(:last-child) {margin-right: 1px;}

button:not([disabled]):hover {background-color: rgb(252, 252, 252);box-shadow: background-color: rgb(255, 255, 255);box-shadow: rgba(0, 0, 0, 0) 0px 0px 0px 0px, rgba(0, 0, 0, 0) 0px 0px 0px 0px, rgba(0, 0, 0, 0.12) 0px 1px 1px 0px, rgba(60, 66, 87, 0.16) 0px 0px 0px 1px, rgba(0, 0, 0, 0) 0px 0px 0px 0px, rgba(60, 66, 87, 0.08) 0px 3px 9px 0px, rgba(60, 66, 87, 0.08) 0px 2px 5px 0px;}

.button-bar button:first-child {
    border-top-left-radius: 4px;
    border-bottom-left-radius: 4px;
}

.button-bar button:last-child {
    border-top-right-radius: 4px;
    border-bottom-right-radius: 4px;
}

.button-bar button:after, .button-bar button:before{
    position: absolute;
    top: 0;
    bottom: 0;
    z-index: 1;
    display: block;
    width: 1px;
    background: #0000000a;
    content: "";
}

.button-bar button:first-child:before, .button-bar button:last-child:after{
    display:none;
}


.button-bar button:after {
    right: -1px;
}

.button-bar button:before {
    left: -1px;
}

i.fa.fa-calendar {}

button i.fa.fa-calendar {
    margin-right: 10px;
}

button:focus {
    box-shadow: rgb(0 0 0 / 0%) 0px 0px 0px 0px, rgb(58 151 212 / 36%) 0px 0px 0px 4px, rgb(0 0 0 / 12%) 0px 1px 1px 0px, rgb(60 66 87 / 16%) 0px 0px 0px 1px, rgb(0 0 0 / 0%) 0px 0px 0px 0px, rgb(0 0 0 / 0%) 0px 0px 0px 0px, rgb(60 66 87 / 8%) 0px 2px 5px 0px;
    z-index: 2;
}

.button-bar select {
    appearance: none;
    position: relative;
    z-index: 1;
    -ms-flex: 0 1 auto;
    flex: 0 1 auto;
    margin: 0;
    text-decoration: none;
    vertical-align: middle;
    word-break: normal;
    background: transparent;
    border: 0;
    outline: 0;
    transition: color .24s;
    -webkit-appearance: none;
    appearance: none;
    -webkit-user-select: auto;
    -ms-user-select: auto;
    user-select: auto;
    padding-left: 20px;
    padding-right: 35px;
    height: 30px;
}

.button-bar {
    display: flex;
    flex-direction: row;
    align-items: center;
    height: fit-content;
    height: -moz-fit-content;
    border-radius: 5px;
    border: 1px solid #d6d6d6;
    position: relative;
    flex-shrink: 0;
    flex-grow: 0;
    background-color: white;
}

.button-bar .fa.fa-arrows-alt-v {
    margin-right: 10px;
    position: absolute;
    right: 5px;
}

.button-bar button {}

.button-bar button i.fa.fa-cog {
  margin-right: 5px;
}

ul.custom-range-ul li {
    padding: 6px;
    padding-left: 40px;
    padding-right: 30px;
}

ul.custom-range-ul li:hover {
    background-color: #a2b7f41c;
    outline: unset;
}

ul.custom-range-ul {
    width: calc(100% + 30px);
    left: 0px;
    transform: translate(-15px);
    overflow: hidden;
}

ul.custom-range-ul li {
    border: unset;
}

.custom-range-ul li.selected .fa.fa-check {
    font-size: 10px;
    position: absolute;
    left: -7px;
}

ul.custom-range-ul li.selected {
    color: #7083e7;
}

.flex-h.comparison-tag-box.red {
    color: rgb(152, 55, 5);
    background-color: #f8e5b9;
}

p.graph-aggregate[compared-aggregate] {
    text-align: right;
}

p.graph-point[compared-point] {
    text-align: right;
}

.graph .comparison-tag-box.green {
    color: rgb(14, 98, 69);
    background-color: rgb(203, 244, 201);
}

@media screen and (max-width: 1050px) {
  .advanced-search{
    width:90%;
  }
 }

 @media screen and (max-height: 800px) {
    .advanced-search{
      height:90%;
    }
 }

 .customer.ui-list-item .customer-body-selection {
     overflow: hidden !important;
 }

 .customer.ui-list-item .customer-body-section {
 }


.customer-list .customer.ui-list-item.group .customer-body-section {
    overflow: scroll !important;
}

.extra {}

.graph .action.extra {
    position: absolute;
    color: #4e8cff;
    bottom: -6px;
    right: 12px;
    transform: translate(0, -100%);
    font-size: 14px;
    display: none;
}

.graph .action.extra .fa {
    margin-left: 5px;
}

.graph:hover .action.extra {
    display: block;
}

.graph:hover .action.extra:hover {
    color: #1f407b;
}

.graph .endpoint-labels {
    width: 100%;
    height: 10px;
    display: flex;
    justify-content: space-between;
    margin-top: -8px;
    margin-right: 5px;
}

.endpoint-labels p {
    font-size: 12px;
    margin-left: 3px;
    margin-right: 3px;
}

.customer-card.flagged .card-name *:not(button *, button) {
}

.credential-identity {
    width: 10px;
    height: 50px;
    border: 1px solid black;
    margin-left: 15px;
    cursor: pointer;
}

.identity.flex-h {
    margin-top: 25px;
    margin-left: 30px;
}

.identity.flex-h.status-left {
    margin-left: 80px;
}

.credential-identity:hover i {
    transform: scale(1.3);
    cursor: pointer;
    color: #3786ff;
}

.credential-identity i {
    transition: all 200ms;
}

.credential-identity:hover {
    background-color: #ffffff;
}

.modal.customer-credential-menu {
    width: 600px;
    height: 400px;
}

.button-bar.large>* {
    height: 41px;
    padding-left: 20px;
    padding-right: 20px;
}

.button-bar.large.finish {
    width: max-content;
    left: 50%;
    transform: translate(-50%, -5%);
    bottom: 30px;
    position: absolute;
}

.button-bar.large.finish {}

.modal.edit-automation {
    width: 95%;
    height: 90%;
    min-width: 800px;
    min-height: 500px;
}

.edit-automation .fa-ellipsis-h {
    margin-left: 30px;
}


.input-connector:not([connected]), .output-connector:not([connected]) {
    background-color: #00000003;
    border: 1px dashed #000000c7;
}

.input-connector[connected], .output-connector[connected] {
    background-color: #53c53dba;
    border: 1px dashed #000000c7;
}

.output-connector, .input-connector {
    width: 20px;
    height: 20px;
    border-radius: 25px;
    transition: all 200ms;
    margin-right: 15px;
    position: absolute;
    left: -29px;
    top: 50%;
    transform: translate(0, -50%);
    text-align: center;
}


.output-connector:not([connected]):not(.no-connect):hover, .input-connector:not([connected]):not(.no-connect):hover {

    cursor: crosshair;
    border: 1px solid #000000c7;
}

.edit-automation span.object-select {
    margin-left: auto;
}

.edit-automation canvas {
    position: absolute;
    z-index: 2;
    pointer-events: none;
}


.modal.select-action {
    width: 600px;
    height: 400px;
}

.output-connector::before, .input-connector::before {
    top: 4px;
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -49%);
    font-size: 12px;
}

.output-connector::before {
   transform: translate(-50%, -45%);
}

li[category][location_pipe_id]>ul {
    margin-left: 35px;
    width: calc(100% - 35px);
box-shadow: inset 6px 6px 10px 0 rgb(0 0 0 / 9%), inset -6px -6px 10px 0 rgb(232 232 232 / 24%);border-radius: 6px 0px 0px 6px;border-left: unset;}

li[category][location_pipe_id]>ul>li:last-of-type {

border-radius: 0px 0px 0px 6px;;border-bottom: unset;}

.input-connector.no-connect {opacity: .2;}

.input-connector.no-connect:hover {}

.automation-action-bar {
    margin-right: 15px;
    cursor: grab;
    left: 15px;
    position: absolute;
}

.edit-automation [category] p:first-child {
    margin-left: 15px;
}

.modal.purchase-number {
    width: 1000px;
    height: 600px;
}

.button-bar.finish {
    position: absolute;
    margin: auto;
    width: fit-content;
    bottom: 50px;
    left: 50%;
    transform: translate(-50%, 0);
}
.configure-mailing textarea {
    min-height:200px;
    max-height:300px;
    resize:none;
}

.edit-phone.modal {
    width: 700px;
    height: 450px;
}

.communication-label {
    font-size: 10px;
    margin-bottom: 5px;
}

li.communication {
    display: flex;
}

.communication-footer {
    font-size: 10px;
    margin-top: 4px;
}

p.communication-recipients:hover, p.communication-attachments:hover {
    color: #3b8ff8;
}

.status-icon .load-throbber.relative {
    height: 30px;
    width: 30px;
    font-size: 16px;
}

.status-icon i.fa:hover {
    transform: scale(1.3);
    color: #3b3b3b !important;
}

.status-icon i.fa {
    transition: all 100ms;
}

.queue-select .transaction-item:first-of-type, .view-transaction .transaction-item:first-of-type {
    margin-top: 20px;
    margin-bottom: 50px;
}

ul[list][embedded-list] li {
    padding-left: 0px;
    padding-right: 0px;
}

.object-select[set][disabled] span {
    color: white;
}

.object-select[set][disabled]:hover {
    background-color: #4caf50;
    border: 1px dashed #4caf50;
}

.object-select[set][disabled] .fa-ban {}

.advanced-search.modal.fullscreen {
    width: 95%;
    height: 95%;
}

.advanced-search.modal.tall {
    height: 101%;
}

.personal-info li[flagged], .customer-info.notes li[flagged], .object-container li[flagged] {
    background-color: #ff8800;
    color: white !important;
}

.personal-info li[flagged] .fa:not(button .fa), .object-container li[flagged] .fa:not(button .fa) {
    color: white !important;
}

.object-select[flagged] {
    background-color: #ff9720;
    border: 1px dashed #ff9720;
}

.object-select[flagged]:not([no-change]):hover {
    background-color: #ffaf54;
    border: 1px solid #ffaf54;
}

.object-select[error] {
    background-color: #fb6f6f;
    border: 1px dashed #fb6f6f;
}

.object-select[error]:not([no-change]):hover {
    background-color: #ff8585;
    border: 1px solid #ff8585;
}

.remote-order .object-select {
    max-width: 300px;
}

.flex-v.special {
}

.personal-info .flex-v.special, .object-container .flex-v.special {
    position: absolute;
    left: 14px;
    text-align: center;
}

.personal-info .flex-v.special>*, .object-container .flex-v.special>* {
    margin-top: 5px;
    margin-bottom: 5px;
}

.personal-info .flex-v.special .bad-address {
    color: #c32929;
    font-size: 10px;
}

.customer.flagged i.fa-star {
    color: #3b3b3b;
}

.customer [category] .flex-v.special {
    position: absolute;
    left: 12px;
    text-align: center;
}

.customer.flagged i.fa.fa-exclamation-triangle {
    color: #c32929;
}

.customer [category] .flex-v.special>* {
    margin-top: 2px;
    margin-bottom: 2px;
}

.invoice iframe {
    width: 100%;
    height: 100%;
    border: unset;
}

ul li[icon-button] {
    width: 100px;
    height: 120px;
    border: 1px;
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    justify-content: space-around;
    margin: 10px;
    box-shadow: 0 0 3px 0 #0000002e;
    border-radius: 2px;
    cursor: pointer;
    transition: all 100ms;
}

ul li[icon-button] .fa {
    font-size: 30px;
}

li[icon-button]:hover {
    background-color: #68a4fd;
    color: white;
}

.transaction-item:first-of-type {
}

.remote-order .transaction-item:last-of-type {
    margin-bottom: 250px;
}

.modal.view-remote-order {
    width: 1000px;
    height: 600px;
}

.modal.payment-methods {
    width: 700px;
}

ul[embedded-list]>li {
    height: 40px;
}

.view-transaction .transaction-item {
    width: 600px;
}

.modal.setup-integration {
    width: 91%;
    height: 700px;
}

.modal.integration-type-select {
    width: 800px;
    height: 500px;
}

.sidebar.path-vertical i.fa.fa-arrow-left.back {
    top: 22px;
    left: 25px;
}

.has-back-arrow.sidebar center h2 {
    width: 90%;
    margin-left: 10%;
}

.modal.oauth-window {
    width: 600px;
    height: 300px;
    padding: 20px;
}

.oauth-window h3 {}

.oauth-window ul {
    margin-top: 30px;
}

.oauth-window .fa-check {
    margin-right: 7px;
    padding-top: 7px;
    padding-bottom: 7px;
}

.customer.ui-list-item.individual.small.empty {
    filter: brightness(.6) blur(1px) !important;
    cursor: default !important;
}

.customer.ui-list-item.empty .customer-header, .campaign.ui-list-item.empty .campaign-header, .large-object.empty .object-header {
    cursor: default;
}

.customer.empty .assign {position: absolute;width: 100%;margin-top: 30px;}

.assign {}

.gift-giver-assign {
    position: absolute;
    top: 135px;
    left: 50%;
    transform: translateX(-50%);
    z-index: 3;
}

.customer.highlight-selected.flagged {}

.customer.highlight-selected.flagged .customer-header {
    background: rgb(128,46,240);
    background: linear-gradient(34deg, rgba(128,46,240,1) 0%, rgba(255,136,0,1) 100%);
}

.customer-left-side {
    width: 400px !important;
    border-right: 1px solid #d8d8d8;
    flex-shrink: 0;
}

.object-container .object-container-header {
    height: 44px;
    background-color: #f4f4f4b5;
    align-items: center;
    justify-content: space-between;
    border-bottom: 1px solid #e2e2e2;
}

.object-container {
    width: 100%;
    border-bottom: 1px solid #0000000f;
}

.customer-left-side {}

.alerts-bar {
    height: 50px;
}

.object-container:last-of-type {
    margin-bottom: 100px;
}

.flex-v.status-bar {
    height: 50px;
}

.flex-v.customer-left-hug {
    position: relative;
    box-shadow: inset 0 0 4px 0 #0000003b;
    width: 45px;
}

.status-item {
    color: white;
    width: 45px;
    height: 45px;
    transition: all 200ms;
    cursor: pointer;
}

.status-item>* {
    margin: auto;
}

.status-item.flag {
    background-color: #ff8800;
}

.status-item.flag:hover {background-color: #c26801;}

.customer-top-hug {
    background-color: white;
    border-bottom: 1px dashed #cacaca;
    height: 45px;
}

.status-item.grouped {
    background-color: #3e1874;
}

.status-item.duplicate {
    background-color: #aa0000;
}

.status-item.delete {
    background-color: #252525;
}

.status-item.flex.merge {
    background-color: #2359f0;
}

.status-item.history {
    background-color: #00805c;
}

.status-item:hover {
    filter: saturate(1.3);
}

.flex-h.hug-actions>* {
    border-right: unset;
    border-left: 1px solid white;
}

.object-container.names .object-container-header {
}

.flex-h.midway-tile {
}

.flex-v.midway-tile {
    min-width: 550px;
    flex-grow: 1;
    border-right: 1px solid #d8d8d8;
}

.customer-card .flex-h.right-tile {
    height: 100%;
    flex-grow: 1;
}

.object-container.transactions {padding-bottom: 0px;margin-bottom: 0px;}

.customer-top-hug {
    background-color: white;
}

.object-header .listing {
    max-width: 63%;
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
}

.object-container-header.superior-header {
    background-color: #fdfdfd;
}

.object-container.superior {
    height: 45px;
}

.itemlist.multiline {height: fit-content;min-height: 200px;overflow-y: scroll;max-height: 400px;}

.itemlist.multiline .contents {
    position: relative;
    flex-wrap: wrap;
    overflow-y: scroll;
    justify-content: center;
    margin-top: 10px;
}

.status-item.dedupe {
    background-color: #ff8d35;
}

.object-container.history .itemlist.multiline {
    width: 100%;
    border-radius: 0;
}

.status-item.flex.inbox {
    background-color: #438eb6;
}

.flex-left-sidebar {
    width: 400px;
    flex-shrink: 0;
    border-right: 1px solid #d8d8d8;
}

ul[list] li[selectable][selected] {
    background-color: #cce2ff;
}

ul[list] li[selectable][selected]::after {
    font-family: "Font Awesome 5 Free";
    content: "\f105";
    font-weight: 800;
    font-style: normal;
    font-variant: normal;
    text-rendering: auto;
    line-height: 1;
}

.button-bar.small button {padding: 3px;padding-right: 12px;padding-left: 13px;height: 27px;}
.button-bar.xsmall button {font-size: 11px;padding: 1px;padding-right: 12px;padding-left: 12px;height: 23px;;}


.default-tag {margin-left: 15px;background-color: #c2e2ff;padding: 3px 11px;border-radius: 4px;color: #0e83ec;}

.graph.minified {border: unset;padding: unset;height: 70px;width: 250px;}

.graph.minified .graph-body {padding: unset;}

.modal.preview-document {width: 95%;height: 90%;;}

.modal.select-transaction {width: 600px;;height: 600px;}

.preview-page-body {background-color: white;margin: 50px;padding: .5in;margin-top: 25px;border: unset;width: calc(100% - 100px - 1in);}

.preview-page-header {background-color: white;margin: 50px;padding: .2in;margin-bottom: 0px;padding-left: 0.5in;font-weight: lighter;font-size: 18px;display: flex;flex-direction: row;align-items: center;font-weight: bold;position: relative;}

.attachment {background-color: white;padding: 20px;position: relative;margin-right: 15px;flex-grow: 0;flex-shrink: 0;margin-bottom: 15px;}

.attachment p {text-align: center;margin-bottom: 20px;margin-top: 15px;}

.attachment i.fa.fa-file-pdf {position: absolute;left: 10px;top: 10px;font-size: 15px;color: #00000061;}

.button-bar.bottom {position: absolute;left: 50%;transform: translateX(-50%);bottom: 30px;}

table {width: 100%;}

table td, table th {padding: 2px 10px 2px 10px;}

table tr:nth-child(odd) {}

table {border-collapse: collapse;}

table th {text-align: left;}

table td, table th {font-weight: lighter;border: 1px solid #c9c9c9;}

table th {font-weight: 400;color: black;}

.modal.select-advanced-search {width: 800px;height: 500px;}

.loop-access .output-connector {position: relative;left: unset;margin: unset;transform: unset;margin-left: 25px;}

.loop-access {display: flex;align-items: center;outline: 1px solid #e5e5e5;outline-offset: 7px;padding: 0px 12px;margin-left: 40px;}

.input-output .input-connector {top: 28%;}

.input-output .output-connector {top: 72%;}

.category.input-output {min-height: 40px;}

button.select.disabled {box-shadow: unset;}

button.select.disabled:hover {cursor: default;box-shadow: unset;}

    .sidebar.right {right: 0px;left: unset;box-shadow: -2px -3px 6px #00000030;}

.sidebar.right.large {width: 30%;}

.demon-large-item ul#sequence {margin-left: unset;border-left: unset;}

i.fa.fa-play {color: #80c380;}

i.fa.fa-pause {color: #cf7070;}

button[toggleable][pressed] {box-shadow: inset 6px 6px 10px 0 rgb(0 0 0 / 6%), inset -6px -6px 10px 0 rgb(253 253 253);transition: all 50ms ease-in;}

button[toggleable]:not([pressed]) {box-shadow: inset 0 0 0px 0px #0000002e;transition: all 50ms ease-in;}



.modal.printers {width: 900px;height: 400px;}

.folder {width: 280px;display: flex;flex-direction: row;padding: 16px 17px;background-color: white;box-shadow: 0 0 0 0 black;border: 1px solid gray;border-radius: 10px; margin:21px;}

.folder i.fa.fa-folder {margin-right: 22px;margin-left: 8px;}

.folder:active {background-color: #8181ff29;cursor: pointer;}

li[location_pipe_id]>.category {height: 20px;}

[add-action], [add-subaction] {height: 16px;}

li[category][location_pipe_id], li[add-action], li[add-subaction], li[add-case] {z-index: 0;position: relative;background-color: unset !important;}

li[location_pipe_id]>.category[tail] {}

li[category][location_pipe_id]:hover, li[add-action]:hover, li[add-subaction]:hover, li[add-case]:hover {background-color: #aeaeae0f !important;}

li[category].pipe-selected {background-color: #3a9aff80 !important;}

li>ul {background-color: white;}

li[category].pipe-selected:hover {background-color: #3a9aff91 !important;}

li[category][location_pipe_id]>ul>li:first-of-type {border-top: unset;border-radius: 6px 0px 0px 0px;}
li[category].log-highlighted {background-color: #349eff82 !important;}
li[category].no-code-coverage {background-color: #ffc10066 !important;}

li[category].log-highlighted:hover {background-color: #46a7ff8f !important;}
li[category].no-code-coverage:hover {background-color: #ffc1004a !important;}


li[category].pipe-selected {
    background-color: #3a9aff80 !important;
}

li[category][location_pipe_id]>ul>li:first-of-type:last-of-type {border-top: unset;border-bottom: unset;border-radius: 6px 0px 0px 6px;}

.button-bar.noborder {}
.customer-left-side li {padding-right: 10px !important;}

.midway-tile  .object-container li {padding-right: 20px !important;}

li[flagged] .button-bar.xsmall.noborder, .customer-card.flagged li.card-name .button-bar {}


*:not(.page, .sidebar-page, .content){
  -ms-overflow-style: none;  /* IE and Edge */
  scrollbar-width: none;  /* Firefox */
}

wi{
	-ms-overflow-style: unset;  /* IE and Edge */
  scrollbar-width: unset;  /* Firefox */
}

.customer-card ul[list].main>li[category] {padding-right: unset !important;}

.advanced-search .main li.select {background-color: #8686ff;color: white;}

.advanced-search .main .select .object-select[set] {border: 1px solid white;}

.advanced-search-onboard * {color: #767676;}

.advanced-search-onboard {position: relative;width: 680px;height: 480px;margin: auto;margin-top: 50px;}

.advanced-search-onboard {}

li.filter-drag-selected {background-color: #a08cea !important;color: white;}

li.filter-drag-selected .object-select[set] {border: 1px solid white;}

.from-and-to {font-size: 13px;margin-left: 30px;display: flex;align-items: flex-start;font-weight: 100;display: flex;flex-direction: column;}

.from-and-to>small {margin-left: 10px;}

.preview-page-header::before {content: "";position: absolute;width: 14px;height: 14px;border: 2px solid #3b3b3b;left: calc(.25in - 7px);}

.footer {}

.search-footer {
    position: absolute;
    bottom: 0;
    width: 100%;
    height: 100px;
    background-color: white;
    border-top: 1px dashed #d5d5d5;
}

.flag-select .last-viewed {
    background-color: #c0dcff;
}

.itemlist:not(.multiline) .contents {
    align-items: center;
    height: calc(100%);
}

.itemlist.multiline .item:last-of-type {
    margin-bottom: 100px;
}

.customer.population-selected .customer-header {
    border-bottom: 1px solid transparent;
    outline: unset;
}

.customer.object.population-selected {
    background: #2c71f0;
}

.customer.ui-list-item.object .customer-name {
    white-space: pre-line;
}

.customer-card .transaction-item {
    width: 90%;
    max-width: 500px;
}

.transaction-item.flagged.population-selected {
    box-shadow: 0 0 0px 2px #ff8800;
}

.transaction-item.flagged.population-selected .object-header {
    background-color: #ff8800;
}

.population-selected.flagged-object .object-header, .population-selected.flagged-object .customer-header {
    background-color: #ff8800 !important;
}

.transaction-item.population-selected .object-header .fa {
    color: white;
}

.transaction-item.population-selected .active-indicator.active {
    background-color: white;
}

.transaction-item.population-selected .active-indicator:not(.active) {
    background-color: black;
}

.customer.population-selected.flagged-object {
}

.flagged-object.customer .customer-header {
    background-color: white;
    color: #3b3b3b;
    border-bottom: unset;
}

.flagged-object.customer .customer-header .fa {
    color: #5266ff;
}

.flagged-object.customer {}

.customer.object.flagged-object {
    box-shadow: 0 0 0px 1px #ffa000;
}

.customer-card div#pending {
    min-height: 190px;
}

.modal.email-preferences {
    width: 65%;
    max-height: 600px;
    height: 66%;
    max-width: 800px;
}

.minified .graph-title-line.flex-h {
    display: none;
}

.minified .comparison-head .flex-v {
    position: relative;
    display: flex;
}

.minified .comparison-head.flex-h {
}

.minified .graph-header-box {
    position: absolute;
    left: 50%;
    transform: translate(-50%, 0);
    bottom: -34px;
    text-align: center;
    font-size: 10px !important;
}

.minified p.graph-aggregate {
    font-size: 12px;
}

.minified p.graph-point {
    font-size: 9px;
    margin-top: 3px;
}

li[disabled] {
    color: #bbbbbb;
    cursor: default !important;
}

li[disabled]:hover {
    background-color: unset !important;
}

.graph.pie-graph {
    /*height: 350px;*/
}

button.disabled {
    color: #797979;
}

button.disabled:hover {
    box-shadow: unset;
}

button.disabled:focus {
    box-shadow: unset;
}

a {
    color: #7878d0;
    font-weight: 600;
}

.bulk-import tr.file-header {
    margin-left: 20px;
    top: 0;
    position: sticky;
    background-color: white;
    color: #3b3b3b;
    font-weight: bold;
    box-shadow: 0 0 16px 0 #00000066;
    outline: 2px solid #444444;
    outline-offset: -2px;
}

.bulk-import [head] td.highlight {
    background-color: #506df5;
    color: white;
    font-weight: bold;
}

.bulk-import [head] td {
    font-weight: bold;
}

.bulk-import tr {
    height: 30px;
}

.bulk-import [scroll] .file-header {
    position: revert;
    top: unset;
}

.searchable i.fa.fa-keyboard {
    padding-right: 10px;
    height: 30px;
    top: -5px;
    position: relative;
    line-height: 30px;
    left: -16px;
    width: 30px;
    padding-left: 10px;
    box-shadow: 4px 0px 11px 3px #00000012;
}

button.searchable:hover {
    box-shadow: unset;
    cursor: text;
}

button.searchable:hover span.text {
    color: #5c5c5c;
}

button.searchable {
    overflow: hidden;
}

button.searchable span.text {height: 30px;top: -5px;position: relative;margin-left: auto;line-height: 30px;margin-left: 15px;padding-right: 20px;}

button.searchable {
    min-width: 150px;
    position: relative;
    display: flex;
}

button.searchable:focus {
    box-shadow: unset;
}

.modal.select-searchable {
    width: 600px;
    height: 400px;
}

.select-searchable>.content>.button-bar {
    border-radius: unset;
    border: unset;
    box-shadow: 0px 4px 6px 0 #00000033;
    z-index: 2;
    position: sticky;
    top: 0;
}

.searchable input.text {
    border: unset;
    outline: unset;
    box-shadow: unset;
    height: 30px;
    padding: unset;
    top: -5px;
    position: relative;
    width: -webkit-fill-available;
    height: 50px;
    font-size: 18px;
    color: #2c2c2c;
    padding-left: 15px;
}

.select-searchable button.searchable {
    width: 100%;
    height: 50px;
    position: relative;
    border: unset;
}

.select-searchable i.fa.fa-keyboard {
    width: 80px;
    height: 50px;
    line-height: 50px;
}

button.searchable.selecting {
    background-color: #5895fd;
    color: white;
}

.bulk-import [head] td.unassigned {
    background-color: #95122933;
}

.bulk-import [head] td.assigned {
    background-color: #1f870f4f;
}

.bulk-import [head] td.assigned.highlight {
    background-color: #229210bf;
}

.bulk-import [head] td.unassigned.highlight {
    background-color: #951229ba;
}

.select-searchable .body i.fa.fa-check {
    color: white;
}

.select-searchable li.selected {
    background-color: #a1e0a1;
}

.bulk-import [head] td {
    outline-offset: -1px;
    border: 0px solid #444444;
    outline: 1px solid #444444;
}

/* CSS Document */

*{
	--main-blue: #1473ee;
}

*.demon-gradient{
	background: rgb(72, 136, 255);
	background: linear-gradient(45deg, rgb(72, 146, 255) 0%, rgb(58, 74, 255) 100%);
}

@media screen and (max-width: 865px){
	.topbar .monitor-cluster{
      display:none !important;
  }

}

@media screen and (max-width: 1300px){
   .modal.flag-select.queue-select {
        width: 92%;
   }
}

@media screen and (max-width: 1100px){
   .modal.create-transaction {
        width: 92%;
   }
}

@media screen and (max-width:1400px){
	.customer-card div#completed {
		 width: 100%;
 }

 .customer-card [point='communication']>.flex-h>* {
		 width: 100% !important;
		 border-right: unset !important;
 }

 .customer-card [point='communication'] .flex-h {
		 flex-direction: row;
		 flex-wrap: wrap;
		 border: unset;
 }

 .flex-v.midway-tile {
		 border: unset;
 }

 .customer-card [point='communication']>.flex-h>*:nth-child(2) {
		 border-top: 1px solid #e1e1e1;
 }
}

.flag-select .customer-card div#completed {
	 width: 100%;
}

.flag-select .customer-card [point='communication']>.flex-h>* {
	 width: 100% !important;
	 border-right: unset !important;
}

.flag-select .customer-card [point='communication'] .flex-h {
	 flex-direction: row;
	 flex-wrap: wrap;
	 border: unset;
}

.flag-select .flex-v.midway-tile {
	 border: unset;
}

.flag-select .customer-card [point='communication']>.flex-h>*:nth-child(2) {
	 border-top: 1px solid #e1e1e1;
}

.finish-item:last-of-type {
    border-bottom: unset;
}

.search-sidebar.right {
    transform: unset !important;
}

i.mobile-search.fa.fa-search {
    display:none;
}


body {
	background-color:white !important;
	color:#3b3b3b;
	font-family: 'Montserrat', Helvetica, sans-serif;
}

input:not([type='radio']) {
    border-radius: 3px;
    border: none;
    box-shadow: 0 0 2px #00000073;
    width: 160px;
    padding-top: 5px;
    padding-bottom: 5px;
    padding-left: 20px;
    -webkit-appearance: none;
}

.button {
    white-space: nowrap;
    cursor: pointer;
    width: auto;
    width: -moz-fit-content;
    height: fit-content;
    background-color: var(--main-blue);
    color: white;
    border-radius: 5px;
    text-align: center;
    transition: all 100ms;
    padding: 0.5em 2em;
    display: flex;
    align-items: center;
    text-align: center;
}

.header {
    text-align: center;
    padding-top: 18px;
    font-weight: bold;
    color: #494949;
    display: flex;
    justify-content: center;
}

.load-throbber {
    left: 50%;
    top: 44%;
    transform: translateX(-50%) translateY(-50%);
    position: fixed;
    z-index: 30000;
    font-size: 26px;
    height: 60px;
    width: 60px;
}

.throbber {
    height: calc(100% - .4em);
    width: calc(100% - .4em);
    background-color: transparent;
    border-radius: 50%;
    border: .2em solid #ffffff00;
    border-top: .2em solid #303030;
    transition:100ms ease-in-out;
    animation: spin .7s ease-in-out infinite;
    position: relative;
    margin-top: 0em;
}

@-webkit-keyframes spin {
  0% { -webkit-transform: rotate(0deg); border-size:8px; }
  100% { -webkit-transform: rotate(360deg); }
}

@keyframes spin {
  0% { transform: rotate(0deg); }
  100% { transform: rotate(360deg); }
}


.login {
    width: 400px;
    height: 300px;
    left: 50%;
    top: 40%;
    position: absolute;
    transform: translate(-50%,-50%);
    box-shadow: 0px 1px 7px #00000085;
    border-radius: 3px;
    overflow: hidden;
}


.login__header-bar {
    width: 100%;
    height: 40px;
    background-color: var(--main-blue);
    position:relative;
    z-index: 2;
}

.login__header-bar__header {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    padding-left: 30px;
    color: white;
    font-weight: bold;
}

.login__header-bar .reset {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    right: 30px;
    color: white;
    font-size: 10px;
    cursor: pointer;
    user-select: none; -webkit-user-select: none;
}

form.login__login-form {
    width: auto;
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    top: 30%;
}

form input {
    display: block;
    margin-top: 10px;
    width: 200px;
    top:31%;
}

.login__submit-button {
    bottom: 40px;
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    border-radius: 5px;
    text-align: center;
    cursor: pointer;
}

.topbar {
    width: 100%;
    transition: all 300ms;
    height: 50px;
    background-color: var(--main-blue);
    top: 0px;
    left: 0px;
    position: relative;
    z-index: 4;
    box-shadow: 0 0 5px #0000007a;
    display: flex;
    align-items: center;
    color: white;
}

.item.logout {
    float: right;
    margin-right: 30px;
}

.item.system {
    float: right;
    margin-right: 50px;
}

.topbar.main-topbar .item.search, .topbar.main-topbar>*:nth-child(3) {
}

.topbar .item, .detail-down .item, .topbar .display-item {
    color: white;
    font-size: 17px;
    font-weight: 100;
    position: relative;
    cursor: pointer;
    transition: all 200ms;
    transform: translateY(-6%);
    padding: 5px 15px 5px 15px;
    margin-top: 2px;
}

.user-detail {
    position: relative;
    color: white;
    font-weight: 100;
    font-size: 17px;
    cursor: pointer;
    width: fit-content;
    text-align: center;
    z-index: 2;
    user-select: none; -webkit-user-select: none;
    margin-right: 30px;
}

.threebar{
	display:none;
}

.detail-down {
    position: absolute;
    right: 10px;
    top: 50px;
    height: auto;
    width: 190px;
    background-color: rgb(66, 81, 255);
    box-shadow: 0px 1px 5px #0000007a;
    border-radius: 2px;
    z-index: 3;
    display: flex;
    flex-direction: column;
}

.detail-down .item {
    text-align: center;
    width: auto;
    margin: unset !important;
    top: unset;
    margin-top: 5px !important;
    font-size: 16px;
    padding-bottom: 15px;
    transform: unset;
}

.detail-down .item:first-of-type {margin-top: 15px !important;}

.detail-down .item:last-of-type {
}

.topbar .monitor-cluster {
    display: flex;
    overflow: visible;
    margin-left: auto;
}

.topbar.main-topbar .monitor-cluster {margin-left: auto;margin-right: 30px;padding-left: 30px;}

.topbar .monitor-item {
    width: auto;
    background-color: white;
    height: 30px;
    border-radius: 3px;
    cursor: pointer;
    display: inline-block;
    margin-right: 8px;
    position: relative;
    box-shadow: 0 0 3px #00000029;
    overflow: hidden;
    white-space: nowrap;
    flex-shrink: 0;
}

.topbar .monitor-item .fa {
    top: 50%;
    transform: translateY(-50%);
    position: absolute;
    margin-left: 6px;
    font-size: 13px;
}

.monitor-item .count {
    text-align: right;
    top: 50%;
    transform: translateY(-50%);
    position: relative;
    padding-left: 29px;
    padding-right: 8px;
    color: #3b3b3b;
}

.sidebar {
    position: absolute;
    left: 0px;
    width: 250px;
    transition: all 300ms;
    height: calc(100%);
    box-shadow: 2px -1px 6px #00000030;
    z-index: 3;
    background-color: white;
    overflow-y: scroll;
}

.sidebar .item {
    text-align: left;
    padding-top: 10px;
    padding-left: 20px;
    cursor: pointer;
    padding-bottom: 10px;
    position: relative;
    transition: all 100ms;
}

.sidebar .item:nth-child(2) {
    margin-top: 27px;
}

.sidebar .item:hover {
    background-color: #e9e9e9;
}

.sidebar .item.open {
    background-color: #56a6fd;
    color: white;
}

.sidebar .item i.fa.fa-angle-right {
    opacity: 0;
    transition: opacity 100ms;
    right: 8px;
    position: absolute;
    top: 50%;
    color: white;
    transform: translateY(-50%);
}

.sidebar .item.open i.fa-angle-right {
    opacity: 1;
}

body>.management, body .account-info-data{
    width: 100%;
    position: absolute;
    top: 50px;
    height: calc(100% - 50px);
    overflow-y: scroll;
    overflow-x: hidden;
}


.sidebar-page .header {
    font-size: 17px;
}

.user-list {
    transform: translateX(-50%);
    position: absolute;
    left: 50%;
    width: fit-content;
    margin-top: 30px;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
}

.user-list .user {
    background-color: #ffffff;
    width: 200px;
    height: 100px;
    color: #3b3b3b;
    position: relative;
    margin: 10px;
    box-shadow: 0 0 5px #0000006b;
    border-radius: 6px;
}

.user-list .user i.fa.fa-user {
    display: inline-block;
    margin-right: 2px;
    margin-left: 2px;
}

.user-list .user .username {
    display: inline-block;
    font-size: 13px;
    margin-right: 0px;
    margin-left: 0px;
}

.user-list .user .mid {
    text-align: center;
    top: 37%;
    transform: translateY(-50%);
    position: absolute;
    width: 100%;
}

.user-list .user .actions {
    position: absolute;
    bottom: 20px;
    left: 50%;
    transform: translateX(-50%);
}

.user-list .user .actions>* {
    margin-left: 10px;
    margin-right: 10px;
    cursor: pointer;
}

.user-list .admin,.user-list .pending {
    right: 11px;
    position: absolute;
    top: 5px;
    font-size: 10px;
}

.add:not(button) {
    display: block;
    position: relative;
    left: 12%;
    cursor: pointer;
    position: relative;
    width: fit-content;
    width: -moz-fit-content;
}

.add:not(button) * {
    margin-left: 5px;
    margin-right: 5px;
}

.darken {
    width: 125%;
    height: 100%;
    position: fixed;
    top: 0px;
    left: 0px;
    z-index: 4;
    background-color: #0000005e;
}

.new-user, .new-mailmerge, .new-backing {
    position: fixed;
    left: 50%;
    top: 50%;
    transform: translate(-50%,-50%);
    width: 500px;
    height: 310px;
    background-color: white;
    overflow: hidden;
    border-radius: 3px;
}

.content {
    width: 100%;
    height: 100%;
    transition: all 400ms;
    position: absolute;
    overflow-y: scroll;
    overflow-x: hidden;
    top: 0px;
    left: 0px;
    transform: translate(0,0);
}

.content.left {
    transform: translate(-100%);
}

.content.right {
    transform: translateX(100%);
}

.management .create.button {
    bottom: 39px;
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
}

.new-user input.username {
    width: 200px;
    left: 50%;
    position: absolute;
    transform: translateX(-50%);
    margin-top: 55px;
}

.new-user input.creation {
    width: 200px;
    position: relative;
    display: inline-block;
    position: relative;
    left: unset;
    margin-top: unset;
}

input[type="checkbox"] {
    border: none;
    box-shadow: none;
    width: auto;
    -webkit-appearance: checkbox;
}

.admin-select {
    left: 50%;
    transform: translateX(-50%);
    top: 135px;
    width: 150px;
}

.user-list .pending {
    left: 11px;
}

.new-user div.creation {
    margin-top: 96px;
    position: absolute;
    left: 50%;
    white-space: nowrap;
    transform: translateX(-50%);
}

.new-user .creation * {
}

.new-user .creation .fa-clipboard {
    cursor: pointer;
    position: absolute;
    margin-left: 12px;
    margin-top: 2px;
}

.monitor-cluster .monitor-extension {
    position: absolute;
    width: 200px;
    height: 106px;
    background-color: #446aff;
    left: 50%;
    transform: translateX(-50%);
    top: 49px;
    box-shadow: 0 0 10px #00000052;
    border-radius: 4px;
    cursor: default;
}

.monitor-cluster .monitor-extension::after {content: "";width: 18px;height: 18px;position: absolute;top: -5px;left: 50%;transform: translateX(-50%) rotate(45deg);background-color: #446aff;z-index: -1;}

.monitor-extension .active-series-item {
    color: white;
    text-align: center;
    margin-top: 10px;
    position: absolute;
    width: calc(100% - 67px);
    right: 0px;
    height: 100%;
}

.left-image,.right-info {
    display: inline-block;
    position: absolute;
}

.right-info {
    position: absolute;
    left: 0px;
    margin-top: 0px;
    text-align: center;
    width: 100%;
    font-size: 5px;
    height: 35px;
    align-items: center;
    display: flex;
    justify-content: center;
}

img.left-series-item-img {
    height: 86px;
    margin-top: 9px;
    border-radius: 3px;
    margin-left: 13px;
    object-fit: fill;
    border-radius: 4px;
    overflow: hidden;
}

.monitor-extension .right-info .series-item {
    color: white;
    margin-top: 1px;
    font-size: 12px;
    font-weight: 100;
    text-align: center;
    margin-left: 5px;
    margin-right: 5px;
}

.monitor-extension .button.manage-series-item {
    font-size: 13px;
    height: 17px;
    width: 96px;
    background-color: white;
    color: black;
    bottom: 22px;
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
}

.sidebar-page .list-container, .new-mailing .list-container, .letter-selector .list-container, .content.printing .list-container {
    width: 80%;
    left: 10%;
    display: flex;
    position: absolute;
    margin-top: 60px;
    justify-content: center;
    flex-wrap: wrap;
}

*:not(.letter-viewer)>.letter {
    position: relative;
    width: 150px;
    height: 200px;
    background-color: white;
    border-radius: 4px;
    color: #3b3b3b;
    margin-right: 20px;
    margin-left: 20px;
    margin-bottom: 40px;
    box-shadow: 0 0 7px #0000004a;
}

.letter>i.fa {
    font-size: 40px;
    left: 50%;
    position: absolute;
    transform: translateX(-50%);
    top: 30%;
}

.letter .header {
    font-size: 10px;
    font-weight: lighter;
    margin: 0px 5px;
}

.letter .actions {
    white-space: nowrap;
    position: absolute;
    bottom: 30px;
    left: 50%;
    transform: translateX(-50%);
}

.letter .actions * {
    margin-left: 10px;
    margin-right: 10px;
    cursor: pointer;
}

.letter .letter-id {
    position: absolute;
    width: 100%;
    text-align: center;
    top: 54%;
    font-size: 10px;
}

.sidebar.left, .search-sidebar.left, .history-sidebar.left {
    transform: translateX(-100%);
}

.search-sidebar,.history-sidebar {
    transition:all 200ms;
    width: 250px;
    height: calc(100%);
    position: absolute;
    left: 0px;
    background-color: white;
    box-shadow: 2px -1px 6px #00000030;
    overflow: scroll;
    z-index: 2;
    display: flex;
    flex-direction: column;
}

.primary-info input {
    position: relative;
    margin: auto;
}

.primary-info .info-box {
    margin-top: 9px;
    position: relative;
    height: 22px;
    display: flex;
}

.primary-info .info-box:first-of-type {
}

.search-sidebar .primary-info {
    margin-top: 3px;
    margin-bottom: 30px;
}

.search-sidebar .info-box.separator {
    margin-top: 30px;
}

body>.customer-list,body>.customer-card {
    left: 250px;
    position: absolute;
    top: 50px;
    width: calc(100% - 250px);
    height: calc(100% - 50px);
    z-index: -2;
    transform: rotate(0deg);
    overflow-x: hidden;
}

.customer-list .list {
    width: 90%;
    margin-top: 36px;
    left: 50%;
    transform: translateX(-50%);
    position: absolute;
    min-width: 500px;
    max-width: 900px;
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
}

.customer, .large-object {
    background-color: #ffffff;
    overflow: hidden;
    cursor: pointer;
    position: relative;
    margin-bottom: 9px;
    display: flex;
    flex-direction: column;
    box-shadow: 0 0 7px #00000047;
    border-radius: 5px;
    font-weight: 100;
    font-size: 12px;
    width: 340px;
    margin: 10px;
}

.customer .customer-header i.fa, .large-object i.fa {
    padding-left: 20px;
    color: #5266ff;
    top: 20px;
    left: 20px;
}

.customer .item {
    padding-left: 20px;
    display: inline-block;
    vertical-align: middle;
}

.customer .name {
}

.customer .item.address {
    font-size: 12px;
    position: absolute;
    padding-right: 23px;
    right: 0px;
    max-width: 50%;
    text-align: right;
}

.customer .mid {
    top: 50%;
    position: absolute;
    transform: translateY(-50%);
    width: 100%;
}

.customer-card .card-names {
    position: relative;
    color: black;
    width: fit-content;
    display: flex;
    z-index: 1;
    flex-direction: column;
}

.identity .card-names .card-name, .identity .credential-identity {
    transition: all 300ms;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #3b3b3b;
    padding-top: 10px;
    border: 1px solid #3b3b3b;
    padding-bottom: 10px;
    padding-left: 20px;
    padding-right: 20px;
    border-radius: 6px;
    height: fit-content;
    font-size: 16px;
    margin-bottom: 10px;
    background-color: white;
    height: 18px;
}

.customer-card .record-type i.fa {
    color: #2e34cf;
    margin-left: 10px;
}

.customer-card .main>.actions, .customer-card .main>.status {
    position: absolute;
    right: 16px;
    top: 16px;
    padding: 11px;
    z-index: 1;
    color: white;
    display: flex;
    flex-direction: column;
    text-align: center;
}

.customer-card .main>.actions * {
    margin-bottom: 17px;
    color: #3d3d3d;
    font-size: 21px;
    cursor: pointer;
}

.customer-card .actions *:last-of-type, .customer-card .status *:last-of-type {
    margin-bottom: unset;
}

.card-names .account-detail {
    color: black;
}

.customer-card .account-status {display: inline-block;margin-left: 30px;}

.customer-info {
    position: relative;
    width: 400px;
    padding-bottom: 29px;
    margin-left: 20px;
    margin-right: 20px;
    z-index: 1;
    height: fit-content;
    margin-top: 20px;
    height: -moz-fit-content;
}

.customer-info .item {
    left: 50%;
    position: relative;
    transform: translateX(-50%);
    margin-top: 3px;
    margin-left: 10px;
    height: 24px;
}

.customer-info .item * {
    top: 50%;
    position: absolute;
    transform: translateY(-50%);
}

.customer-info .item .title {position: absolute;left: 25px;width: 100px;font-size: 14px;}

.customer-info .item input {
    right: 30px;
    height: 11px;
    width: 186px;
}

.customer-info .item:nth-child(3) {
    margin-top: 20px;
}

.customer-card .tags:not(.object-container) {
    position: relative;
    display: inline-block;
    width: auto;
    height: 20px;
    margin-left: 34px;
}

.customer-card .tags .tag {
    display: inline-block;
    margin-right: 8px;
    padding-left: 10px;
    padding-right: 10px;
    padding-top: 5px;
    padding-bottom: 5px;
    background-color: #297be5;
    color: white;
    border-radius: 2px;
}

.customer-info.notes {
    width: 380px;
    margin-top: 20px;
    min-height: 100px;
    margin-bottom: 20px;
}

i.fa.fa-arrow-left.back {
	cursor:pointer;
	position: fixed;
	left: 22px;
	top: 21px;
	font-size: 20px;
	z-index: 1;
}

.customer-card .pii-container {margin-top: 20px;display: flex;justify-content: space-evenly;padding-left: 50px;padding-right: 50px;flex-wrap: wrap;}

.customer-card .transactions, .open-documents .documents, .customer-card .campaigns {
    position: relative;
    background-color: #ffffffc4;
    margin-bottom: 50px;
    padding-bottom: 30px;
    padding-top: 30px;
    margin-bottom: 20px;
}

body {
    overflow: hidden;
    transition: all 300ms;
    transform: scale3d(1,1,1);
    top: 0px;
    left: 0px;
    height: 100%;
    width: 100%;
    position: fixed;
    margin: unset;
}

.transaction, .customer-card .document {
    height: 50px;
    margin-top: 15px;
    width: 100%;
    position: relative;
    background-color: #ffffff;
    color: #3b3b3b;
    cursor: pointer;
    white-space: nowrap;
    display: flex;
    align-items: center;
    box-shadow: 0 0 5px #00000040;
    border-radius: 6px;
    font-size: 13px;
    font-weight: lighter;
}

.transaction .item,.document .item,.log .item {
    position: relative;
    margin-left: 10px;
    display: flex;
    align-items: center;
    color: #3b3b3b;
    max-width: 215px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    padding-right: 10px;
}

.transaction>i.fa, .open-documents .document>i.fa, .open-documents .document>i.fas {
    position: relative;
    margin-left: 20px;
}

.transactions .fa-clock-o {
    margin-right: 6px;
}

.customer-card .new {
    position: absolute;
    margin-top: 20px;
    margin-left: 20px;
    color: #313131;
    cursor: pointer;
    user-select: none; -webkit-user-select: none;
}

.customer-card .transactions .header {
    margin-bottom: 33px;
}

.new-transaction, .new-document, .add-manual-history-items {
    width: 550px;
    height: 400px;
    top: 47%;
    transform: translate(-50%,-50%);
    left: 50%;
    position: absolute;
    background-color: white;
    z-index: 4;
    border-radius: 3px;
    overflow: hidden;
}

.new-transaction .header {
    position: relative;
    width: 100%;
}

.transaction-types {
    left: 50%;
    transform: translateX(-50%);
    margin-top: 60px;
    position: relative;
    width: 250px;
    justify-content: center;
    display: flex;
    flex-wrap: wrap;
}

.transaction-type {
    width: 100%;
    text-align: center;
    padding-top: 5px;
    padding-bottom: 5px;
    padding-left: 20px;
    padding-right: 20px;
    background-color: white;
    color: #3b3b3b;
    cursor: pointer;
    margin-top: 10px;
    border-radius: 5px;
    box-shadow: 0 0 6px #00000040;
}

.payment-info {
    position: relative;
    left: 60px;
    width: fit-content;
    height: 22px;
    display: flex;
    align-items: center;
}

.payment-info select.payment-type {margin-right: 20px;}

.payment-info input {
    margin-right: 10px;
    width: 90px;
}

.payment-info input:last-of-type {
    margin-right: unset;
    width: 100px;
}

.section {
    padding-left: 36px;
    font-size: 15px;
    font-weight: bold;
    color: #656565;
    margin-top: 11px;
    margin-bottom: 10px;
}

.section:first-of-type {
    margin-top: 52px;
}

.campaign-data {
    left: 60px;
    position: relative;
}

.shipping-note {
    height: 48px;
    width: 320px;
    background-color: white;
    box-shadow: 0 0 6px #00000036;
    padding: 10px;
    padding-top: 10px;
    overflow-y: scroll;
    text-align: left;
    border-radius: 7px;
}

.gift-giver {
    font-size: 13px;
    color: #545454;
    left: 60px;
    position: relative;
}

.next {
    position: absolute;
    width: 40px;
    height: 40px;
    background-color: #2c88f0;
    border-radius: 100%;
    color: white !important;
    bottom: 20px;
    left: 50%;
    transform: translateX(-50%);
    cursor: pointer;
    user-select: none; -webkit-user-select: none;
    transition: background-color 200ms;
}

.next i {
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%,-50%);
}

input.error,.error {background-color: #e83c3c2b !important;}

.new-transaction i.back {
    top: 19px !important;
    left: 23px !important;
}

.finish-list {
    left: 50%;
    transform: translateX(-50%);
    position: relative;
    transition: height 200ms;
    overflow-y: hidden;
    height: fit-content;
    height: -moz-fit-content;
    padding: 1px;
}

.finish-item {
    padding-left: 30px;
    padding-right: 30px;
    position: relative;
    padding-top: .8em;
    padding-bottom: .8em;
    border-bottom: 1px solid #ececec8f;
    display: flex;
    align-items: center;
    justify-content: space-between;
    font-weight: lighter;
}

.switch {
    transition: background-color 200ms;
    width: 40px;
    height: 22px;
    border-radius: 27px;
    background-color: lightgrey;
    display: inline-block;
    position: relative;
    user-select: none; -webkit-user-select: none;
}

.switch:not(.true)::after {transform: translateY(-48%);left: 3px;}

.switch::after {
    content: "";
    height: 17px;
    width: 17px;
    background-color: white;
    position: absolute;
    border-radius: 100%;
    transition: all 200ms;
    top: 50%;
}

.switch.true::after {transform: translateY(-48%);left: calc(100% - 20px);}

.switch.true {
    background-color: #63c363;
}

.finish-item>* {
    display: inline-block;
}

.finish-item>.switch, .finish-item>input, .finish-item>.assignment, .finish-item>.value, .finish-item>select, .finish-item>.button {
    cursor: pointer;
    text-align: right;
    display: flex;
    align-items: center;
}

li>.switch, li>input, li>.assignment, li>.value,li>select, li>.button {
    display: flex;
    align-items: center;
    margin-left: auto;
}

.new-transaction .button.create {
    bottom: 30px;
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
}
.pii-container .customer-info i.fa.fa-pencil-alt {
    position: absolute;
    top: 12px;
    right: 14px;
    cursor: pointer;
}

.pii-container.customer-container {
    left: 50%;
    transform: translate(-50%,-50%);
    position: absolute;
    top: 54%;
    z-index: 1;
}

.customer-container .card-names {
    color: white;
    width: 50%;
    left: 50%;
    transform: translateX(-50%);
    position: relative;
    margin-bottom: 20px;
    z-index: 1;
}

.customer-container .customer-info.pii .fa-pencil-alt {
    display: none;
}

.customer-container .button.create {
    left: 50%;
    position: relative;
    transform: translateX(-50%);
    margin-top: 37px;
}

i.fa.fa-arrow-left.back.body {
    top: 80px;
}

.card-names i {
    color: #585858;
    cursor: pointer;
    padding-right: 5px;
    padding-left: 5px;
    margin-left: auto;
}

*:not(.pii-container)>.card-names>.card-name[contenteditable] {
    background-color: #416bffb8;
}

.customer-card .content.settings .finish-list {
    width: 56%;
    min-width: 450px;
}

.confirm {
    background-color: white;
    width: 483px;
    height: 221px;
    position: absolute;
    top: 46%;
    transform: translateY(-50%) translateX(-50%);
    left: 50%;
    border-radius: 3px;
    z-index: 15 !important;
    padding: 10px 20px;
}

.confirm .description {
    text-align: center;
    margin-top: 30px;
}

.confirm .button.confirm-button {
    bottom: 30px;
    position: absolute;
}

.confirm .button.confirm-button.cancel {
    left: 50px;
}

.button.confirm-button.continue {
    right: 50px;
}

.not-found {
    position: absolute;
    width: 300px;
    height: auto;
    top: 40%;
    left: 50%;
    transform: translateX(-50%) translateY(-50%);
    background-color: white;
}

.not-found i {
    font-size: 70px;
    text-align:  center;
    width: 100%;
    color: #b83b3b;
}

.recent-series-item-large,.new-series-item-large {
    position: relative;
    width: 500px;
    height: 200px;
    margin-top: 25px;
    box-shadow: 0 0 9px #0000002b;
    border-radius: 3px;
    left: 50%;
    transform: translateX(-50%);
}

.recent-series-item-large.first {
    margin-top: 50px;
}

.series-item-image img,.series-item-image {
    height: 175px;
    max-width: 125px;
    object-fit: contain;
}

.series-item-image {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    margin-left: 14px;
    border-radius: 3px;
    overflow: hidden;
    height: 175px;
    max-width: 165px;
}

.right-container {
    width: calc(100% - 125px);
    left: 125px;
    position: absolute;
    height: 100%;
}

.recent-series-item-large .actions {
    position: absolute;
    bottom: 10px;
    right: 10px;
}

.customer-list .actions>* {
    cursor: pointer;
    margin-top: 20px;
}

.recent-series-item-large .container-item,.new-series-item-large .container-item {
    margin-top: 20px;
    left: 50%;
    transform: translateX(-50%);
    white-space: nowrap;
    position: relative;
    width: fit-content;
    display: block;
    width: -moz-fit-content;
}

.right-container .container-item>* {
    display: inline-block;
    margin-right: 13px;
}

.right-container input {
    display: inline-block;
}

.container-item.link {
    color: #005ccf;
    cursor: pointer;
}

.recent-series-item-large.first .actions {
    bottom: unset;
    right: unset;
    width: 100%;
}

.recent-series-item-large .finish-item {
    margin-top: 15px;
}

.button.makeactive {
    left: 50%;
    transform: translateX(-50%);
    position: relative;
    margin-top: 20px;
}

.recent-series-item-large.first .container-item {
    margin-top: 10px;
}

.recent-series-item-large:last-of-type {
    margin-bottom: 50px;
}


.sidebar.orders .item {
    font-size: 12px;
}

.order-fill {
    position: absolute;
    left: 250px;
    top: 50px;
    width: calc(100% - 250px);
    height: calc(100% - 50px);
    overflow: hidden;
}


.settings-group {
    left: 50%;
    transform: translateX(-50%);
    position: relative;
    width: fit-content;
    margin-top: 45px;
    box-shadow: 0 0 4px #0000004a;
    width: -moz-fit-content;
}

.settings-item {
    width: 492px;
    height: 40px;
    padding-left: 75px;
    line-height: 40px;
    background-color: #ffffff;
    border-bottom: 1px solid #dedede;
    cursor: pointer;
}

.settings-group .title {
    font-weight: bold;
    color: #464646;
    padding-left: 20px;
    margin-bottom: 10px;
    position: absolute;
    top: -25px;
}

.settings-item:last-of-type {
    border-bottom:unset;
}

.settings-item::after {content: "\f105";position: absolute;font-family: "Font Awesome 5 Free", "Font Awesome 5 Pro";font-weight: 900;right: 25px;color: #3a3a3a;}

.setting-page .finish-list {
    width: 60%;
}

.new-mailmerge .letter {
    cursor:pointer;
}

.new-mailmerge .letter.upload {
    position: absolute;
    left: 50px;
    bottom: 30px;
    height: 150px;
}

.new-mailmerge .letter.create {
    right: 50px;
    position: absolute;
    bottom: 30px;
    height: 150px;
}

.new-mailmerge .letter .desc {
    position: absolute;
    width: 100%;
    text-align: center;
    color: #3b3b3b;
    top: 65%;
    font-size: 10px;
}

.html-upload input[type="file"] {width: 200px;display: inline-block;}

.content.html-upload .button.upload {
    position: absolute;
    bottom: 30px;
    left: 50%;
    transform: translateX(-50%);
}

.new-mailmerge .letter-name {
}

.letter-viewer {
    position: relative;
    background-color: #f0f0f0;
    width: fit-content;
    max-width: 9in;
    height: calc(100% - 40px);
    overflow: scroll;
    border-radius: 3px;
    display: flex;
    padding-top: 20px;
    padding-bottom: 20px;
    box-shadow: 0 0 5px #00000042;
}

.letter-viewer .letter {
    width: fit-content;
    position: relative;
    margin-top: 30px;
}

.letter-viewer .cmd-bar {
    width: 100%;
    height: 38px;
    box-shadow: 0px 0px 4px black;
    position: absolute;
    top: -12px;
}

.letter-viewer-modal .cmd-bar {
    position: relative;
    padding-top: 6px;
    padding-bottom: 16px;
    right: 0px;
    height: fit-content;
	height: -moz-fit-content;
    background-color: white;
    color: #3b3b3b;
    width: 50px;
    border-radius: 4px;
    display: flex;
    vertical-align: top;
    margin-left: 15px;
    white-space: normal;
    box-shadow: 0 0 6px #00000057;
    flex-direction: column;
    align-items: center;
}

.cmd-bar {}

.letter-viewer-modal .cmd-bar .fa {
    margin-top: 16px;
    margin-bottom: 6px;
}

.user-id-desc {
    text-align: center;
    font-size: 9px;
    width: fit-content;
    padding-top: 0px;
    padding-bottom: 5px;
    padding-left: 3px;
    padding-right: 3px;
}

.cmd-bar .switch {font-size: 11px;margin-top: -4px;margin-bottom: 10px;}

.letter-viewer-modal {
    top: 0px;
    width: fit-content;
    position: absolute;
    height: 86%;
    top: 53%;
    left: 50%;
    transform: translate(-50%,-50%);
    white-space: nowrap;
    z-index: 4;
    display: flex;
    justify-content: space-between;
    transition: all 300ms cubic-bezier(0.55, 0.09, 0.68, 0.53);
}

.letter-small {
    transform: scale(0.42) translateX(-50%) translateY(-50%);
    width: 7.5in;
    height: 10in;
    position: relative;
    margin: unset;
    top: 0px;
    overflow: hidden;
    overflow-y: scroll;
    transform-origin: 0 0;
    left: 50%;
    top: 48%;
    padding-left: 1in;
    padding-right: 1in;
    padding-top: .5in;
    box-shadow: 0 0 11px #0000003b;
}

.new-document {
}

.new-document .title, .campaign-email-send .send .title, .section-title {
    padding-left: 30px;
    font-weight: bold;
    color: #3b3b3b;
    font-size: 15px;
    margin-top: 30px;
}

.new-document .main-item,.section-item {
    padding-left: 60px;
    margin-top: 10px;
    font-size: 12px;
    display: inline-block;
}

.new-document .change {
    display: inline-block;
    font-size: 10px;
    padding-left: 11px;
    color: #2930d4;
    font-weight: bold;
    cursor: pointer;
}

.new-document .finish-list {
    max-width: 85%;
    margin-top: 10px;
}

.finish-item input {
    padding-right: 10px;
    cursor: text;
}

.new-document .button.create {
    position: absolute;
    bottom: 30px;
    left: 50%;
    transform: translateX(-50%);
}

.document .fa-clock-o {
    padding-right: 5px;
}

.documents .header {
    margin-bottom: 33px;
}

.revision, .sidebar-object {
    height: 40px;
    background-color: #f5f5f5;
    width: 100%;
    position: relative;
    color: #3b3b3b;
    cursor: pointer;
    padding: 2px 0px;
    transition: all 200ms;
    border-bottom: 4px solid white;
}

.history-sidebar .primary-info {
    margin-top: 15px;
}

.revision-date {
    transform: translateY(-50%);
    font-size: 12px;
    position: absolute;
    top: 50%;
    padding-left: 19px;
}

.revision-number {
    position: absolute;
    font-size: 12px;
}

.click {
    font-size: 14px;
    position: absolute;
    right: 18px;
    top: 50%;
    transform: translateY(-50%);
    cursor: context-menu;
}

.history-sidebar i.fa.fa-arrow-left {
    position: absolute;
    top: 20px;
    left: 14px;
}

.revision.open, .sidebar-object.open {
    background-color: #487ef8;
    color: white;
}

.revision:not(.open):hover, .sidebar-object:not(.open):hover {background-color: #487ef8b5;color: white;}

.log-list-bottombar {
    position: fixed;
    width: 100%;
    bottom: 0px;
    height: 55px;
    background-color: #5836ff;
    left: 0px;
}

.log-list-bottombar>.fa {
    color: white;
    font-size: 28px;
    top: 50%;
    transform: translateY(-50%);
    padding-right: 44px;
    padding-left: 44px;
    position: absolute;
    cursor: pointer;
}

.log-list-bottombar i.fa.fa-angle-right {
    right: 0;
}

.display-block {
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    width: 300px;
    height: 100%;
}

.log-list-bottombar .display-block * {
    color: white;
}

.log-list-bottombar .desc {
    width: 100%;
    text-align: center;
    font-size: 10px;
    margin-top: 5px;
}

.desc .goback {
    display: inline-block;
    color: #b7bdff;
}

.display-block-items>* {
    position: relative;
    display: inline-block;
    width: 50px;
    height: 50px;
}

.display-block .display-block-items {
    display: flex;
    justify-content: center;
    margin-top: 5px;
}

.display-block-items .fa {
    left: 50%;
    transform: translateX(-50%);
    position: relative;
}

.display-block-items .text {
    text-align: center;
    font-size: 10px;
}

.mid-modal {
    width: 300px;
    top: 40%;
    position: absolute;
    left: 50%;
    transform: translate(-50%,-50%);
    box-shadow: 0 0 12px #00000021;
}

.mid-modal .header {
    font-size: 15px;
}

.mid-modal div#flag-viewer {
    margin-top: 40px;
    margin-bottom: 25px;
    left: 50%;
    position: relative;
    transform: translateX(-50%);
}

.log {
    width: 80%;
    height: 45px;
    max-width: 900px;
    background-color: white;
    color: #3b3b3b;
    box-shadow: 0 0 7px #0000004a;
    position: relative;
    left: 50%;
    transform: translateX(-50%);
    margin-bottom: 14px;
    display: flex;
    border-radius: 6px;
    align-items: center;
}

.log:nth-child(2) {
    margin-top: 30px;
}

.log>i.fa.fa {
    padding-left: 17px;
    font-size: 12px;
}

.customer-card .item .fa, .item .fas {
    margin-right: 5px;
    margin-left: 5px;
    font-size: 8px;
}

.log .item:first-of-type {
    cursor: pointer;
    min-width: 279px;
}

.itemlist {
    position: relative;
    height: 200px;
    width: calc(100% - 20px);
    display: block;
    padding-left: 20px;
    padding-right: 20px;
    padding-top: 20px;
    padding-bottom: 14px;
    overflow: hidden;
    border-radius: 6px;
    border: 1px solid #00000014;
    box-shadow: inset 0 0 12px #0000001f;
    background-color: #fbfbfb;
}

.itemlist .item, .product-container .item {
    height: 160px;
    user-select: none; -webkit-user-select: none;
    min-width: 115px;
    width: 120px;
    border-radius: 3px;
    overflow: hidden;
    padding: 5px;
    padding-right: 10px;
    position: relative;
    transition: all 200ms;
}

.itemlist .item img, .itemlist .item .outline, .product-container .item img, .product-container .item .outline {
    border-radius: 5px;
    transition: 200ms filter;
    height: 100%;
    max-width: 85%;
    object-fit: contain;
    transition: all 200ms;
}

.itemlist .item>.fa, .product-container .item>.fa {
    position: absolute;
    color: white;
    z-index: 1;
    top: 40%;
    left: 50%;
    margin: unset;
    cursor: pointer;
    transform: translate(-50%,-50%);
    display: none;
}

.itemlist .item .modify, .product-container .item .modify  {
    position: absolute;
    top: 84%;
    left: 50%;
    transform: translateX(-50%);
    white-space: nowrap;
}

.itemlist .item .modify>*, .product-container .item .modify>* {
    display: inline-block;
}

.itemlist .item .modify>.fa, .product-container .item .modify>.fa {
    cursor: pointer;
}

.itemlist .item:hover>.fa, .product-container .item:hover>.fa {
    display: block;
}

.itemlist .order-item input {
    width: calc(70px - 25px);
}

.itemlist .order-item {
    width: 100%;
}

.itemlist .order-item .title, .product-container .order-item .title {
    width: 100%;
    text-align: center;
    font-size: 15px;
    font-weight: bold;
    margin-bottom: 5px;
    color: #4e4e4e;
}

.itemlist .order-item, .product-container .itemlist .order-item{
    top: 50%;
    transform: translateY(-50%) translateX(-50%);
    position: relative;
    height: 50px;
    left: 50%;
    width: fit-content;
}

.itemlist .order-item .fa-plus, .product-container .order-item .fa-plus  {
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    margin: unset;
    top: 54%;
    color: #2d2d2d;
    font-size: 20px;
    cursor: pointer;
}

.itemlist .new {
    position: fixed;
    z-index: 1;
    background-color: white;
    margin-left: -10px;
    padding-left: 7px;
    padding-right: 7px;
    width: fit-content;
}

.itemlist .new select.item-select {
    left: 50%;
    transform: translateX(-50%);
    position: relative;
}

.item[pos="1"] {
    margin-left: 156px;
}

.itemlist .item.new .desc {
    width: 100%;
    text-align: center;
    font-size: 10px;
}

.itemlist .item.new .desc.sel {
    margin-top: 5px;
}

.itemlist .item.new .desc.sel.success {
    color: green;
}

.order-pack {
    width: 60%;
    max-width: 1000px;
    height: 68%;
    background-color: white;
    z-index: 3;
    position: absolute;
    top: 53%;
    left: 50%;
    transform: translate(-50%,-50%);
    overflow: hidden;
}

.order-pack .itemlist {
    width: calc(80% - 20px);
    left: 10%;
    position: absolute;
    top: 43%;
    transform: translateY(-50%);
    padding-top: 22px;
    padding-bottom: 0px;
}

.order-pack .content.letters .letters, .order-pack .content.emails .letters {
    margin-bottom: 20px;
    left: 50%;
    transform: translateX(-50%);
    position: relative;
    width: calc(8.5in * .4);
    margin-top: 50px;
    margin-bottom: 100px;
}

.order-pack .letters .letter-small {
    top: 0px !important;
    transform: translateY(0px) scale(0.42) translateX(-50%);
    position: absolute;
}

.order-pack .title {
    position: absolute;
    top: 23%;
    transform: translateY(-50%);
    padding-left: 65px;
    font-weight: bold;
    color: #353535;
    font-size: 12px;
}

.itemlist .item .name {
    position: absolute;
    z-index: 1;
    color: white;
    font-size: 10px;
    width: auto;
    text-align: center;
    top: 19%;
    display: none;
    left: 50%;
    width: auto;
    transform: translateX(-50%);
}

.itemlist .item:hover .name {
    display: block;
}

.item.added {
}

.itemlist .item>.fa-check {
    color: green;
    display: block;
}

.itemlist .item.added img {
    filter: brightness(.25);
}


.itemlist .item:not(.added)>.fa-check {
    display: none;
}

.order-pack .letters embed {
    width: calc(8.5in * .4);
    height: calc(11in * .4);
    transform-origin: 0 0;
    margin-bottom: 30px;
    box-shadow: 0 0 13px #00000036;
}



.order-pack .content.letters .button {
    left: 50%;
    transform: translateX(-50%);
    position: relative;
}

.order-pack .content.main .finish {
    position: absolute;
    bottom: 30px;
    left: 50%;
    transform: translateX(-50%);
}

.new-transaction .itemlist, .add-manual-history-items .itemlist {
    margin-left:20px;
    width: calc(100% - 80px);
}

.donor-list {
    position: fixed;
    width: 500px;
    height: 600px;
    left: 50%;
    transform: translateX(-50%) translateY(-50%);
    top: 54%;
    background-color: white;
    z-index: 4;
    padding-left: 40px;
    padding-right: 40px;
    padding-top: 30px;
    overflow: scroll;
    padding-bottom: 20px;
}

.create-series-item {
    position: fixed;
    left: 50%;
    transform: translate(-50%,-50%);
    top: 50%;
    width: 600px;
    height: 432px;
    background-color: white;
    z-index: 4;
}

.create-series-item .button.finish {
    bottom: 30px;
    left: 50%;
    transform: translateX(-50%);
    position: absolute;
}

.create-series-item .title {
    padding-left: 60px;
    font-weight: bold;
    color: #444444;
    margin-top: 20px;
    font-size: 15px;
}

.create-series-item>input {
    margin-left: 49px;
    margin-top: 10px;
    width: 300px;
}

.create-series-item .container-item {
    margin-top: 0px;
    right: 0px;
}

.create-series-item .header[contenteditable] {
    color: #ca2311;
}

.campaign-card {width: 100%;left: 0;height: 100%;overflow: scroll;}

.campaign-setup {
    height: 479px;
    width: 620px;
    position: fixed;
    z-index: 4;
    left: 50%;
    top: calc(25px + 50%);
    transform: translateX(-50%) translateY(-50%);
    background-color: white;
    box-shadow: 0 0 9px #00000038;
    overflow: hidden;
    border-radius: 5px;
}

.campaign-setup .finish-list {
    margin-top: 10px;
    width: 100%;
}

.campaign .campaign-setup .main>.title {
    font-weight: bold;
    padding-left: 30px;
    margin-top: 20px;
    color: #2e2e2e;
}

select.populationsort, input.autoinclude,input.campaign-code {
    margin-left: 30px;
}

.campaign-setup .autoinclude .title {
    display: inline-block;
    margin-right: 20px;
}

.campaign-setup .main>.switch {
    margin-top: 10px;
}

.campaign-setup .population {
    display: flex;
    margin-top: 10px;
    margin-left: 40px;
}

.campaign-setup .modifications {
    position: relative;
    width: 90%;
    left: 5%;
    margin-top: 25px;
    max-height: 400px;
    height: 265px;
}

.campaign-setup .mod {
    width: 100%;
    height: 44px;
    background-color: #3ba7ff;
    color: white;
    margin-bottom: 10px;
    position: relative;
}

.campaign-setup .mod>* {
    position: relative;
    top: 50%;
    transform: translateY(-50%);
    margin-left: 20px;
    display: inline-block;
}

.campaign-setup .mod .fa-trash {
    position: absolute;
    right: 20px;
    cursor: pointer;
}

.campaign-setup .automod .fa-plus {
    position: absolute;
    top: 20px;
    right: 30px;
    cursor: pointer;
}

.new-automod {
    position: fixed;
    width: 500px;
    height: 231px;
    background-color: white;
    z-index: 4;
    top: 47%;
    left: 50%;
    transform: translate(-50%,-50%);
    border-radius: 5px;
}

.new-automod .title {
    padding-left: 30px;
    font-weight: bold;
    color: #454545;
    margin-top: 12px;
}

.new-automod select.order-type {
    margin-left: 31px;
    margin-top: 10px;
}

.new-automod select.clarification {
    margin-left: 20px;
}

input.price-change {
    margin-top: 10px;
    margin-left: 32px !important;
}

.new-automod input {
    width: 109px;
    margin-left: 10px;
}

.new-automod .button.finish {
    bottom: 22px;
    left: 50%;
    transform: translateX(-50%);
    position: absolute;
}

.campaign-setup .mod-item {
    height: 100%;
}

.campaign-setup .mod-item .mod-desc {position: absolute;text-align: center;font-size: 10px;margin-top: 2px;white-space: nowrap;left: 50%;transform: translateX(-50%);}

.campaign-setup .automod .mod input {
    top: 50%;
    position: relative;
    transform: translateY(-25%);
    width: 53px;
}

.campaign-setup .button.finish {
    position: absolute;
    bottom: 30px;
    left: 50%;
    transform: translateX(-50%);
}

.sidebar .fa-plus {
    position: absolute;
    right: 30px;
    top: 22px;
    cursor: pointer;
}

.sidebar .header {
    margin-bottom: 20px;
}

.campaign-setup .title-item {
    position: absolute;
    left: 257px;
    top: 85px;
}

input.autoinclude, input.campaign-code {
    margin-top: 17px;
}

.campaign-basic-info,.campaign-actions {
    display: inline-block;
    height: 100px;
    background-color: white;
    color: #3b3b3b;
    width: 300px;
    box-shadow: 0 0 10px #00000026;
    position: relative;
    margin-bottom: 14px;
    border-radius: 4px;
}

.code {
    text-align: center;
    font-weight: bold;
    color: #2a2a2a;
    top: 38%;
    position: absolute;
    width: 100%;
}

.campaign-desc {
    font-size: 10px;
    text-align: center;
    padding-top: 10px;
}

.campaign-card .campaign-basic-info .desc-container {
    bottom: 10px;
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
}

.campaign-basic-info .desc-container .desc-item * {
    display: inline-block;
}

.campaign-basic-info .desc-container .desc-item *:first-of-type {
    margin-right: 2px;
}

.campaign-basic-info .desc-container .desc-item {
    display: inline-block;
    margin-left: 5px;
    margin-right: 5px;
}

.campaign-basic-info i.fa.fa-cog {
    position: absolute;
    margin-left: 10px;
    margin-top: 10px;
    cursor: pointer;
}

.report-tiles {
    margin-left: 20px;
    margin-right: 20px;
    width: -webkit-fill-available;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
}

.report-tiles>.tile {margin-bottom: 20px;margin-right: 20px;}

.report-tiles>.tile.large {
    width: 100%;
    height: 100px;
    margin-bottom: 20px;
}

.report-tiles>.tile.small {
    width: auto;
    height: auto;
}

.campaign-card .actions {
    position: fixed;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    right: 50px;
    top: 20px;
    color: #3b3b3b;
    font-size: 17px;
    z-index: 2;
}

.email-send-dialog {
    width: 500px;
    left: 50%;
    position: absolute;
    top: 50%;
    transform: translate(-50%,-50%);
    height: 300px;
    background-color: white;
    z-index: 3;
    box-shadow: 0 0 9px #0000002e;
}

.load-throbber .fa {
    color: green;
    font-size: 18px;
    position: absolute;
    left: 50%;
    transform: translate(-50%,-12%);
    top: 50%;
}

.throbber.stop {
    animation: unset;
    opacity: 0;
}

.email-send-dialog .check-list .load-throbber {
    transform-origin: 0 0;
    transform: scale(.5,.5) translateY(-50%);
    left: unset;
    position: relative;
}

.check-list {
    width: 80%;
    height: auto;
    position: relative;
    left: 50%;
    transform: translateX(-50%);
    margin-top: 20px;
}

.check-list .check {
    height: 50px;
    position: relative;
    display: flex;
    justify-content: left;
    border-bottom: 1px solid #dfdfdf;
}

.action-text {
    line-height: 50px;
    font-size: 16px;
    text-align: right;
    width: -webkit-fill-available;
    white-space: nowrap;
    padding-right: 10px;
}

.load-throbber .fa-clock-o {
    color: #282828;
}

.email-send-dialog .check-list {
    top: 37%;
    transform: translate(-50%, -50%);
    position: absolute;
}

.email-send-dialog .button.close {
    position: absolute;
    bottom: 30px;
    left: 50%;
    transform: translateX(-50%);
}

.load-throbber .fa-times {
    color: red;
}

.email-send-dialog .button.error-manage,.email-send-dialog .button.error-close {
    position: absolute;
    bottom: 30px;
}

.email-send-dialog .button.error-close {
    left: 50px;
}

.email-send-dialog .error-manage {
    right: 50px;
}

.email-send-dialog .error-container .title {
    text-align: center;
    top: 46px;
    position: absolute;
    color: #800f0f;
    width: calc(100% - 20px);
    font-size: 10px;
    padding-left: 10px;
}

.tag-extra {
    position: absolute;
    color: white;
    border-radius: 3px;
    margin-left: 30px;
    top: 71px;
    font-size: 10px;
    display:flex;
    flex-wrap: wrap;
    max-width: 40%;
    justify-content: left;
}

.tag-extra .tag {
    background-color: #28952c;
    box-shadow: 0 0 3px #00000085;
    padding-top: 6px;
    padding-bottom: 6px;
    padding-left: 10px;
    padding-right: 10px;
    border-radius:3px;
    margin-bottom: 5px;
    margin-right: 10px;
    margin-right: 6px;
}


.content.open-settings .finish-list {
    width: 69%;
}

.campaign-card .actions>* {
    cursor: pointer;
    margin-left: 0px;
    margin-right: 20px;
}

.campaign-bar {
    width: 100%;
    height: 38px;
    left: 50%;
    transform: translateX(-50%);
    position: relative;
    background-color: #ffffff;
    color: #3b3b3b;
    box-shadow: 0px -2px 5px #00000033;
    display: flex;
    justify-content: center;
    margin-bottom: 50px;
    border-bottom: 1px solid #00000024;
}

.campaign-card .actions>*:last-of-type {
    margin-right: unset;
}

.campaign-bar .bar-item {
    position: relative;
    top: 50%;
    transform: translateY(-50%);
    display: inline-block;
    padding: 5px 20px;
    cursor: pointer;
    line-height: 29px;
    min-width: 100px;
    text-align: center;
    border-right: 1px solid #d6d6d6;
}


.campaign-tab {
    width: -webkit-fill-available;
    position: relative;
}

.campaign-tab.population .campaign-pop {
    width: 80%;
    left: 10%;
    position: relative;
    padding-top: 20px;
}

.campaign-pop .customer .name {
    cursor: pointer;
}

.campaign-pop .customer {
    cursor: default;
}

.campaign-actions .button {
    left: 50%;
    position: relative;
    transform: translateX(-50%);
    margin-top: 13px;
}

.campaign-email-send {
    position: fixed;
    width: 762px;
    height: 500px;
    left: 50%;
    top: 50%;
    transform: translate(-50%,-50%);
    background-color: white;
    z-index: 4;
    border-radius: 3px;
    overflow: hidden;
}

.campaign-email-send input.subject-line {
    margin-top: 20px;
    width: 300px;
    margin-left: 30px;
}

.campaign-email-send>.header {
    position: absolute;
    width: 100%;
}

.campaign-email-send .subhead {
    width: 100%;
    text-align: center;
    margin-top: 42px;
}

.campaign-email-send .invalid-emails {
    margin-top: 30px;
    width: 80%;
    left: 10%;
    height: 283px;
    position: relative;
    overflow: scroll;
    overflow-x: hidden;
    padding-right: 20px;
}

.campaign-email-send .finish-list {
    width: 80%;
    margin-top: 11px;
}

.campaign-email-send .list-container {
    overflow: hidden;
    overflow-y: scroll;
    max-height: 251px;
    margin-top: 10px;
}

.campaign-email-send .content:not(.send) .title {
    margin-top: 20px;
    text-align: center;
    font-weight: lighter;
}

.content.attachments .list-container {
    max-height: 303px;
}

.campaign-email-send .email-preview-address {
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    width: 250px;
    top: 27%;
}

.campaign-email-send .preview-address {
    margin-top: 10px;
    width: calc(100% - 20px);
}

.campaign-email-send .email-preview-address .button {
    left: 50%;
    position: relative;
    transform: translateX(-50%);
    margin-top: 22px;
    padding-left: 20px;
    padding-right: 20px;
}

.campaign-email-send .finish {
    left: 50%;
    position: absolute;
    transform: translateX(-50%);
    bottom: 30px;
}

input.schedule-send {
    margin-left: 20px;
}

.campaign-email-send .campaign-email-schedule {
    display: flex;
    position: relative;
    margin-top: 20px;
    margin-left: 40px;
}

.campaign-email-schedule .switch {margin-top: 2px;}

.campaign-email-send .letter.selected {
    background-color: #43a143;
}

.campaign-email-send .letter {
    cursor: pointer;
}

.order-pack .letters {
}

.letter-small.print {
    background-color: gray;
}

.letter-item {
    position: relative;
    width: calc(8.5in * .42);
    height: calc(11in * .42);
    margin-bottom: 20px;
}

.order-pack .button.finish {
    left: 50%;
    transform: translateX(-50%);
    position: relative;
    bottom: 20px;
}

.order-pack .letters .next {
    position: relative;
}

.new-document .preview .letter-item,.new-document .preview-email .letter-item {
    left: 50%;
    transform: translateX(-50%);
    margin-top: 30px;
}

.letter {
    white-space: normal;
}

.settings .print-backings, .choose-backing .print-backings {
    width: 80%;
    left: 10%;
    position: absolute;
    margin-top: 30px;
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
}

.print-backings .backing {
    width: 170px;
    height: 220px;
    box-shadow: 0 0 6px #00000047;
    margin-right: 20px;
    margin-left: 20px;
    margin-bottom: 40px;
    position: relative;
    transition: all 200ms;
    border-radius: 14px;
    overflow: hidden;
}

.print-backings .backing img {
    width: 100%;
    height: 100%;
    overflow: hidden;
    object-fit: cover;
}

.print-backings .backing .title {
    font-size: 11px;
    text-align: center;
    margin-top: 18px;
    position: absolute;
    width: 100%;
    color: white;
    z-index: 2;
}

.print-backings .actions {
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    display: flex;
    z-index: 2;
    color: white;
    top: 45%;
}

.print-backings .actions>* {
    margin-right: 20px;
    margin-left: 20px;
    font-size: 20px;
    cursor: pointer;
}

.print-backings .backing:hover {
}

.print-backings .backing:hover img {
    filter: brightness(0.3);
}

.print-backings .backing:not(:hover) .title {
    display: none;
}

.print-backings .backing:not(:hover) .actions {
    display: none;
}

.setting-page .content>i.fa.fa-plus {
    position: absolute;
    left: 40%;
}

.setting-page .add {
    top: 33px;
}

.new-backing .button {
    position: absolute;
    bottom: 30px;
    left: 50%;
    transform: translateX(-50%);
}

.new-backing input[type='file'] {
    top: 44%;
    width: 200px;
    left: 50%;
    position: absolute;
    transform: translateX(-50%);
}

.new-backing input.backing-name {
    position: relative;
    left: 50%;
    transform: translateX(-50%);
    margin-top: 50px;
    width: 200px;
}

.gift-search>* {
    display: inline-block;
    color: #2c6bdf;
    cursor: pointer;
}

.gift-search {
    padding-left: 5px;
    padding-right: 5px;
    position: relative;
    padding-top: 5px;
    padding-bottom: 5px;
    margin-top: 1px;
    font-size: 15px;
    margin-left: 55px;
    display: inline-block;
}

.gift-search .fa {
    margin-right: 5px;
    font-size: 12px;
    transform: translateY(-6%);
}

.assocview {
}

.assocview>* {
}

.search-sidebar .subtext {
    font-size: 11px;
    text-align: center;
    position: absolute;
    width: 100%;
}

.customer-card .associate {
    right: -30px;
    z-index: 2;
    position: absolute;
    transform: translateX(100%) translateY(-50%);
    top: 50%;
    white-space: nowrap;
}

.gift-giver .fa-trash {
    margin-left: 10px;
    cursor:pointer;
}

.merge-editor-body {
    position: fixed;
    top: 50px;
    width: 100%;
    left: 0px;
    height: calc(100% - 50px);
    background-color: #dadada;
    overflow-y: scroll;
    z-index: 1;
    overflow-x: hidden;
}

.letter-error {
    left: 50%;
    transform: translateX(-50%);
    position: absolute;
    top: 30%;
}

.letter-error i.fa.fa-exclamation-triangle {
    font-size: 50px;
    color: #ba1616;
    left: 50%;
    transform: translateX(-50%);
    position: relative;
}

.letter-error .text {
    margin-top: 20px;
}

.merge-letter-content {
    left: 50%;
    width: fit-content;
    position: relative;
    transform: translateX(-50%);
    margin-top: 60px;
    margin-bottom: 50px;
    outline: unset;
    transform-origin: 0 0;
}

.merge-letter-content.print{
    overflow: unset;
}

.merge-letter-content {}

.merge-letter-content .content {
    background-color: white;
    outline: unset;
    box-shadow: 0 0 9px #00000036;
}

.merge-letter-content .content {
    position: relative;
    overflow-y: scroll;
    overflow-x: hidden;
    margin-bottom: 70px;
}

.merge-editor-body .gbar {
    width: 100%;
    height: 50px;
    background-color: white;
    z-index: 2;
    transition: all 400ms;
    display: flex;
    position: relative;
}

.gbar {}

.merge-editor-body .gbar.shadow {
}

.gbar .action {
    position: relative;
    top: 50%;
    transform: translateY(-50%);
    display: inline-block;
    height: 20px;
    margin-right: 13px;
    padding: 3px;
    border-radius: 3px;
    cursor: pointer;
    color: #383838;
}

.gbar .action:first-of-type {
    margin-left: 20px;
}

.action>* {
    vertical-align: middle;
}

.gbar .action:hover {
    background-color: #e9e9e9;
}

.separator {
    border-radius: 3px;
    width: 1px;
    margin-left: 5px;
    margin-right: 13px;
    height: 24px;
    top: 50%;
    transform: translateY(-50%);
    position: relative;
    background-color: #d0d0d0;
}

.gbar .action.active {
    color: #3f8bff;
}

.ruler-top {
    z-index: auto;
    width: 100%;
    height: 15px;
    top: 100px;
    border-top: 1px solid #bdbdbd;
    border-bottom: 1px solid #bdbdbd;
}

.ruler-side {
    height: 100%;
    position: absolute;
    width: 15px;
    top: calc(50px + 17px);
    border-right: 1px solid #bdbdbd;
    border-left: 1px solid #bdbdbd;
    z-index: 0 !important;
}

.ruler {
    z-index: 2;
    background-color: white;
}

.merge-topbar {
    position: fixed;
    width: 100%;
    box-shadow: 0 0 7px #00000069;
    z-index: 3;
}

.insert-variable, .insert-text,.insert-link {
    width: 400px;
    height: 200px;
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
    background-color: white;
    box-shadow: 0 0 12px #00000047;
    z-index: 4;
    border-radius: 3px;
}

select {}

.insert-variable .button, .insert-text .button,.insert-link .button {
    left: 50%;
    transform: translateX(-50%);
    position: absolute;
    bottom: 30px;
}

.insert-variable input {
    left: 50%;
    transform: translateX(-50%);
    position: relative;
    margin-top: 29px;
}

.insert-text .code, .insert-text .text, .insert-link .code,.insert-link .text {
    width: 200px;
    left: 50%;
    top: 27%;
    transform: translateX(-50%);
    position: absolute;
    text-align: left;
    font-weight: normal;
}

.insert-text .text,.insert-link .text {
    top: 45%;
    width: 84%;
}

.gbar .action#settings {position: absolute;right: 10px;}

.page {
    width: -webkit-fill-available;
    height: -webkit-fill-available;
    outline: unset;
    position: absolute;
    -webkit-margin-collapse: discard;
}

.merge-editor-body .settings {
    height: calc(100% - 117px);
    width: 250px;
    position: fixed;
    top: 117px;
    right: 0px;
    background-color: #507fff;
    box-shadow: 0 0 7px #00000075;
    transition: all 300ms ease-in-out;
}

.merge-editor-body .settings.right {
    transform: translateX(100%);
}

.merge-editor-body .settings .header {
    color: white;
    margin-bottom: 10px;
}

.merge-editor-body .setting-item>* {
    display: inline-block;
    color: white;
    margin-top: 8px;
    vertical-align: middle;
    line-height: 20px;
}

.merge-editor-body .setting-item {
    padding-left: 15px;
    padding-right: 15px;
    display: flex;
    justify-content: space-between;
    margin-top: 8px;
    align-items: center;
}

.merge-editor-body .setting-item select {
    color: black;
}

.merge-editor-body .setting-item .button {
    font-size: 10px;
    width: 45px;
    height: 11px;
    line-height: 11px;
    color: black;
    background-color: white;
    min-width: unset;
}

.merge-editor-body div.setting-item#backing {
}

.merge-editor-body .settings .button.close {
    color: black;
    background-color: white;
    bottom: 30px;
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    font-size: 14px;
}

.merge-letter-content.landscape .content {
    width: 11in;
    height: calc(8.5in - 2in);
}

.choose-backing {
    width: 600px;
    height: 400px;
    left: 50%;
    transform: translate(-50%,-50%);
    position: fixed;
    top: 48%;
    z-index: 4;
    background-color: white;
    border-radius: 3px;
    overflow: scroll;
}

.choose-backing .print-backings {
    margin-top: 30px;
}


.choose-backing .backing {
    cursor: pointer;
}

.merge-letter-content.print .content {height: 11in;}

.merge-editor-body .settings input.letter-name {
    left: 50%;
    transform: translateX(-50%);
    position: relative;
    margin-top: 10px;
    margin-bottom: 20px;
}

.letter-viewer-modal .cmd-bar .fa-download, .letter-viewer-modal .cmd-bar .fa-print {
    color: #5151ff;
    cursor:pointer;
}

input[type="number"] {}

div#font-size input {
    width: 30px;
    text-align: left;
    padding-left: 10px;
    z-index: 3;
}

div#font-size:hover {
    background-color: unset;
}

#font-color .fa-font,#background-color .fa-highlighter {
    transform: translateY(-1px) scale(.88);
    transform-origin: 0 0;
}

#font-color .color-sample,#background-color .color-sample {
    width: 90%;
    height: 2px;
    background-color: #3ecde3;
    transform: translateY(-1.6px) translateX(-57%);
    left: 50%;
    position: relative;
}

.content.preview .fa-download {
    position: absolute;
    top: 20px;
    right: 44px;
    cursor: pointer;
    color: #3a3aff;
}

.user-access-settings {
    position: fixed;
    width: 800px;
    height: 600px;
    left: 50%;
    transform: translate(-50%,-50%);
    background-color: white;
    top: calc(25px + 50%);
    z-index: 4;
    border-radius: 6px;
    padding-bottom: 23px;
    box-shadow: 0 0 6px #0000003d;
    overflow-y: scroll;
}

.user-access-settings .finish-list {
    margin-top: 18px;
    width: 80%;
}

.campaign-tab.population i.fa.fa-download {
    position: absolute;
    right: 12%;
    top: 20px;
    color: #3578f4;
    cursor: pointer;
}

.log .item:nth-of-type(2) {
}

.welcome-dialog {
    width: 100%;
    height: 100%;
    position: fixed;
    top: 0;
    left: 50%;
    transform: translate(-50%,0px);
    background-color: #4892ff;
    box-shadow: 0 0 9px #00000061;
    border-radius: 3px;
    z-index: 3;
}

.welcome-dialog .header {
    color: white;
    font-size: 30px;
    top: 20%;
    position: relative;
}

.welcome-dialog .subhead {
    width: 100%;
    text-align: center;
    color: white;
    margin-top: 10px;
    position: absolute;
    top: calc(20% + 60px);
}

.welcome-dialog .content.main {
}

.welcome-dialog .next {
    background-color: white;
    bottom: 100px;
}

.field-export .main .header {
    padding-bottom: 20px;
    box-shadow: 1px 5px 5px #0000000f;
}

.welcome-dialog .content:not(.main) .header {
    top: 10%;
}

.welcome-dialog .content:not(.main) .subhead {
    top: calc(10% + 50px);
    width: 86%;
    left: 50%;
    transform: translateX(-50%);
}

.welcome-dialog .welcome-content {
    top: 25%;
    height: 75%;
    position: absolute;
    width: 100%;
}

.skip-onboard {
    color: white;
    text-decoration: underline;
    cursor: pointer;
    position: absolute;
    bottom: 50px;
    right: 100px;
    z-index: 1;
}

.welcome-dialog .back {
    color: white;
}

.qr {
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    width: 300px;
    height: 300px;
    background-color: white;
    border-radius: 3px;
    margin-top: 27px;
}

.welcome-dialog .button {
    color: black;
    background-color: white;
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    top: 14%;
}

.contact .welcome-content input {
    display: block;
    margin-bottom: 10px;
    width: 200px;
    padding: 10px;
    left: 50%;
    transform: translateX(-50%);
    position: relative;
}

.contact .welcome-content input:first-of-type {
    margin-top: 100px;
}

.welcome-dialog .button.finish {
    bottom: 100px;
    position: absolute;
    top: unset;
}

.attempt-twofactor-enable {
    background-color: white;
    width: 500px;
    height: 500px;
    z-index: 4;
    position: fixed;
    left: 50%;
    transform: translate(-50%,-50%);
    top: 50%;
    border-radius: 6px;
}

.attempt-twofactor-enable .subhead {
    font-size: 10px;
    text-align: center;
    margin-top: 2px;
    color: #4e4e4e;
    left: 50%;
    width: -webkit-fill-available;
    padding-left: 50px;
    padding-right: 50px;
}

.attempt-twofactor-enable canvas {
    width: 250px;
    height: 250px;
    left: 50%;
    transform: translateX(-50%);
    position: relative;
    margin-top: 41px;
    margin-bottom: 34px;
}

.attempt-twofactor-enable input[type="text"] {
    position: relative;
    left: 20%;
}

.attempt-twofactor-enable input {
    width: 231px;
    margin-top: 30px;
    margin-left: 30px;
}

.attempt-twofactor-enable .button {
    display: inline-block;
    margin-left: 20px;
}

.twofactor-enabled {
    width: 300px;
    left: 50%;
    position: absolute;
    transform: translateX(-50%);
    height: 50px;
    margin-top: 77px;
}

.subhead.twofa-sub {
    white-space: normal;
    max-width: 550px;
    left: 50%;
    transform: translateX(-50%);
}

.key-list .key-item {
    width: 200px;
    height: 64px;
    position: relative;
    color: #3b3b3b;
    padding-left: 20px;
    padding-right: 20px;
    padding-top: 10px;
    padding-bottom: 10px;
    display: flex;
    flex-direction: row;
    margin-bottom: 10px;
    padding: 16px 16px;
    margin: 10px;
    border-radius: 5px;
    box-shadow: 0 0 7px #0000004a;
    align-items: center;
    justify-content: center;
}

.key-list .key-item * {
    font-size: 12px;
}

.api-access .key-list {
    margin-top: 30px;
    flex-direction: row;
    display: flex;
    width: 100%;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
}

.key-list .key-item .private-key {
    min-width: 360px;
    filter: blur(3px);
    cursor: pointer;
    transition: all 200ms;
}

.key-list .key-item .fa-trash {
    cursor: pointer;
}

.key-list .key-item .public-key {
    min-width: 110px;
}

.pager {
    width: 175px;
    left: 0px;
    top: 117px;
    position: fixed;
    height: calc(100% - 117px);
    background-color: white;
    box-shadow: 0 0 4px #00000061;
    overflow: scroll;
    overflow-x: hidden;
    scroll-behavior: unset;
    -ms-overflow-style: none;
    z-index: 2;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: center;
}

.pager__page-item {
    width: 130px;
    margin-top: 11.46px;
    margin-bottom: 11.46px;
    height: 173px;
    background-color: white;
    position: relative;
    box-shadow: 0 0 4px #00000059;
    border-radius: 0px;
    flex-shrink: 0;
    flex-grow: 0;
}

.pager__page-item .title {
    text-align: center;
    padding-top: 10px;
    font-size: 12px;
}

.pager__page-item:last-of-type {
    margin-bottom: 500px;
}

.pager__page-item::-webkit-scrollbar {
    display: none;
}

.pager::-webkit-scrollbar {
    display: none;
}

.pager__page-item.new-page i.fa.fa-plus {
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%,-50%);
    font-size: 22px;
}

.pager__page-item.new-page {
    cursor: pointer;
}

.letter-viewer .pagebreak {
    width: 200%;
    height: 40px;
    left: 50%;
    transform: translateX(-50%);
    position: relative;
    background-color: gray;
}

.letter-viewer .merge-letter-content {
    left: 50%;
    margin-top: unset;
}

.letter-small .merge-letter-content {
    left: 50%;
    margin-top: unset;
}

.pager__page-item .fa-trash {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
    font-size: 20px;
    cursor: pointer !important;
}

.pager__page-item:not(.new-page) {cursor: grab;}

.letter-viewer .letter:not(.print) {
    width: 8in;
    background-color: white;
    padding-left: 1in;
    padding-right: 1in;
    padding-top: 1in;
    padding-bottom: 1in;
    margin-bottom: .5in;
    display: inline-block;
    height: fit-content;
	height: -moz-fit-content;
}

.letter-viewer .letter:not(.print) .pagebreak {
    background-color: unset;
    height: unset;
}

.insert-link .text {
    top: 35%;
}

.color-grid>*:not(.color-indicator) {
    background: linear-gradient(to right, #fff 0%,transparent 100%);
}

.color-grid>*:not(.color-indicator) {
	height: 100%;
	width: 100%;
	position: absolute;
	border-radius: 2px;
}

.to-white {
    background: linear-gradient(to bottom, transparent 0%, #000 100%) !important;
}

.insert-color {
	user-select:none;
	top: 50%;
	width: 200px;
	height: 310px;
	background-color: white;
	position: absolute;
	z-index: 4;
	left: 50%;
	transform: translate(-50%,-50%);
	border-radius: 5px;
}

.insert-color .output-color {
    width: 16px;
    height: 16px;
    background-color: green;
    border-radius: 100%;
}

.insert-color .label {
    padding-left: 12px;
    font-size: 12px;
    font-weight: lighter;
    color: #272727;
    margin-top: 12px;
}

.insert-color .color-output {
    height: 20px;
    margin-bottom: 28px;
    margin-top: 28px;
    display: flex;
    padding-left: 11px;
    position: relative;
}

.insert-color .color-output .label {
    margin-top: unset;
    line-height: 18px;
    padding-right: 10px;
    margin-left: unset;
    margin-right: unset;
    width: unset !important;
    margin-left: 20px;
}

.insert-color input {
    width: 50px;
}

.insert-color .color-grid {
    width: 90%;
    left: 5%;
    position: relative;
    height: 120px;
    border-radius: 4px;
    overflow: hidden;
    background-color: #ff0000;
}

.color-grid .color-indicator {
    position: absolute;
    z-index: 2;
}

.color-indicator {
	transform: translateY(-50%) translateX(-50%);
    height: 16px;
    position: relative;
    width: 16px;
    background-color: white;
    box-shadow: 0 0 7px #00000047;
    border-radius: 100%;
}

.color-grid .color-indicator{
	top:100%;
	left:0px;
}

.color-indicator .indicator {
    width: 12px;
    height: 12px;
	top:50%;
    background-color: #e91e1e;
    border-radius: 100%;
    left: 50%;
    transform: translate(-50%,-50%);
    position: absolute;
}

.insert-color .color-main {
    position: absolute;
    width: 89%;
    height: 12px;
    background-color: blue;
    border-radius: 11px;
    margin-top: 9px;
    left: 50%;
    transform: translateX(-50%);
    background: linear-gradient(to right, red 0%, #ff0 17%, lime 33%, cyan 50%, blue 66%, #f0f 83%, red 100%);
}

.insert-color .button {
    width: 50px;
    bottom: 17px;
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
}

.color-main .color-indicator {
    top: 50%;
}

.account-info:not(.item) {
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    width: 60%;
    margin-top: 18px;
    background-color: #ffffff47;
    box-shadow: 0 0 0px #0000000d;
    margin-bottom: 50px;
}

.account-info .info-item {
    padding-left: 65px;
    margin-top: 14px;
    box-shadow: 0px -1px 7px #00000040;
    border-radius: 4px;
    padding-top: 20px;
    padding-bottom: 30px;
}

.account-info .title {
    font-weight: bold;
    color: #464646;
    margin-bottom: 20px;
}

.account-info .item-block {}

.account-info .text-item {
    margin-top: 10px;
    margin-left: 10px;
}

.account-info .item-block .button {
    margin-top: 10px;
    margin-right: 40px;
}

.item-block.twofa {
}

.item-block.twofa .button.change {
    display: inline-block;
}

.account-info .header {
    font-size: 21px;
    margin-bottom: 51px;
}

.info-item.password .item-block {
    display: flex;
    justify-content: space-between;
}

.disabled-alert {
    color: #700000;
    font-size: 12px;
    margin-top: -10px;
}

.item-block.twofa {}

.item-line-item {
    display: flex;
    justify-content: space-between;
    width: 100%;
    margin-right: 48px;
    margin-bottom: 20px;
}

.info-item.contact .item-block {
    margin-right: 40px;
}

.search-sidebar.widen {
    width: 400px;
}

.advanced-more {
    position: absolute;
    bottom: 0px;
    height: 50px;
    width: 100%;
    background-color: white;
    box-shadow: 1px -4px 4px #00000012;
    overflow: hidden;
}

.advanced-info .advanced-item {
    display: flex;
    justify-content: space-between;
    padding-left: 25px;
    padding-right: 25px;
    margin-top: 11px;
}

.advanced-info .advanced-item .text {
    line-height: 21px;
}

.advanced-info {
    margin-top: 25px;
}

.notifications {
    position: fixed;
    bottom: 30px;
    right: 30px;
    width: 240px;
    height: auto;
    transition: all 200ms;
    z-index: 1301;
}

.notification {
    float: right;
    width: fit-content;
    padding-right: 30px;
    min-width: 100%;
    height: 50px;
    right: 0px;
    position: relative;
    background-color: #703af7;
    background: linear-gradient(45deg, #703af7, #187cd9);
    border-radius: 10px;
    display: flex;
    color: white;
    margin-top: 10px;
    transition: all 200ms;
    justify-content: left;
    align-items: center;
    box-shadow: 0 0 6px #0000003d;
}



.notifications .notification i.fa {
    margin-left: 20px;
    margin-right: 20px;
    font-size: 15px;
}

.notification>* {
    line-height: 49px !important;
    font-size: 12px;
    white-space: nowrap;
}

p {
    margin: unset;
}

.button.change-inv {
    width: 90px;
}

.change-dialog {
    height: 300px;
    width: 500px;
    position: fixed;
    left: 50%;
    transform: translate(-50%,-50%);
    top: 50%;
    background-color: white;
    box-shadow: 0 0 9px #00000033;
    border-radius: 3px;
    z-index: 4;
}

.change-dialog .button {
    position: absolute;
    bottom: 25px;
    left: 50%;
    transform: translateX(-50%);
}

.inventory-change .finish-list {
    margin-top: unset;
    bottom: 65px;
    position: absolute;
    width: 90%;
}

.padding-left {
    margin-top: 10px;
    margin-left: 40px;
}

.padding-left .text {
    margin-bottom: 6px;
}

.button {}

.button.finance-change {
    position: absolute;
    top: 17px;
    right: 30px;
}

.finance .report-tiles {
    margin-top: 30px;
}

.finance-change .padding-left {
    margin-top: 29px;
}

.commerce-items {
    width: 86%;
    left: 7%;
    height: auto;
    position: relative;
    display: flex;
    justify-content: space-evenly;
    margin-top: 30px;
    margin-top: 40px;
    flex-wrap: wrap;
}

.commerce-item {
    width: 125px;
    height: 200px;
    box-shadow: 0 0 6px #0000003b;
    border-radius: 5px;
    overflow: hidden;
    margin-bottom: 20px;
}

.commerce-item img {
    width: 100%;
    height: 100%;
    border: unset;
}

[point-set='installation-topbar'] .options {
    display: flex;
    justify-content: space-around;
    margin-top: 40px;
    flex-wrap: wrap;
    left: 50%;
    transform: translateX(-50%);
    position: relative;
    min-width: 450px;
    width: 500px;
}

[point-set='installation-topbar'] .options .option {
    position: relative;
    width: 200px;
    height: 80px;
    box-shadow: 0 0 7px #0000002e;
    border-radius: 6px;
    text-align: center;
    background-color: white;
    color: #3b3b3b;
    margin-bottom: 30px;
    cursor: pointer;
}

[point-set='installation-topbar'] .options .option i.fa {
    left: 50%;
    transform: translateX(-50%);
    position: absolute;
    margin-top: 16px;
}

[point-set='installation-topbar'] .option .name {
    position: absolute;
    bottom: 20px;
    width: 100%;
}

.payment-list {
    position: relative;
    left: 50%;
    transform: translateX(-50%);
    width: fit-content;
    margin-top: 30px;
}

.payment-item {
    width: 400px;
    height: 50px;
    padding-left: 20px;
    padding-right: 20px;
    background-color: white;
    color: #3b3b3b;
    margin-bottom: 10px;
    border-radius: 6px;
    box-shadow: 0 0 7px #0000004a;
}

.payment-item .exp {float: right;margin-right: 20px;}

.payment-item>* {
    display: inline-block;
    top: 50%;
    transform: translateY(-50%);
    position: relative;
}

.payment-item i.fa.fa-trash {
    float: right;
    cursor: pointer;
}

.payment-item .last-4 {
    margin-left: 20px;
}

.payment-item .new {
    float: right;
}

.payment-item.new {
    cursor: pointer;
}


/* */

form#payment-form {
    position: relative;
    top: 30%;
    width: 80%;
    transform: translate(-50%,-50%);
    left: 50%;
    padding: 20px;
    box-shadow: 0 0 4px #0000003b;
    border-radius: 6px;
}

#payment-form .button {
    position: relative;
    margin-top: 30px;
    left: 50%;
    transform: translateX(-50%);
    width: 200px;
}

div#card-errors {
    color: gray;
    margin-top: 10px;
    position: relative;
}

.StripeElement {
  box-sizing: border-box;

  height: 40px;

  padding: 10px 12px;

  border: 1px solid transparent;
  border-radius: 4px;
  background-color: white;

  box-shadow: 0 1px 3px 0 #e6ebf1;
  -webkit-transition: box-shadow 150ms ease;
  transition: box-shadow 150ms ease;
}

.StripeElement--focus {
  box-shadow: 0 1px 3px 0 #cfd7df;
}

.StripeElement--invalid {
  border-color: #fa755a;
}

.StripeElement--webkit-autofill {
  background-color: #fefde5 !important;
}


/* */

.key-list .key-item .private-key:hover {
    filter: unset;
}

.sub-status-modal {
    position: absolute;
    width: 500px;
    top: 43%;
    transform: translate(-50%,-50%);
    left: 50%;
    height: 300px;
    box-shadow: 0 0 7px #0000004a;
    overflow: hidden;
    border-radius: 6px;
}

.sub-status-modal .subhead {
    text-align: center;
    margin-top: 10px;
    color: #680000;
}

.sub-status-modal .desc-text {
    width: 90%;
    left: 5%;
    position: relative;
    margin-top: 20px;
    color: #3b3b3b;
    text-align: center;
}

.org-settings input {
    width: 170px;
    position: relative;
    left: 50%;
    transform: translateX(-50%);
    display: block;
    margin-bottom: 6px;
}

.org-settings input:first-of-type {
    margin-top: 20px;
}

.org-settings .desc-text {
    color: #232323;
    margin-top: 9px;
}

.legal {
    width: 90%;
    left: 5%;
    position: relative;
    margin-top: 10px;
    font-size: 11px;
}

.agree {
    display: flex;
    line-height: 22px;
    width: 120px;
    justify-content: space-evenly;
    left: 50%;
    transform: translateX(-50%);
    position: relative;
    margin-top: 20px;
}

.button.finish {
    position: absolute;
    bottom: 30px;
    left: 50%;
    transform: translateX(-50%);
}

.start-sub table {
    width: 90%;
    left: 5%;
    position: relative;
    margin-top: 20px;
}

.start-sub table th {padding-bottom: 8px;border-bottom: 1px solid #c3c3c3;color: #5c5c5c;}

.start-sub td {
    padding-top: 5px;
}

.start-sub td:nth-child(2) {
    text-align: right;
}

.button.advanced {
    position: absolute;
    bottom: 30px;
    left: 50%;
    transform: translateX(-50%);
}

.advanced-search {
    width: 1000px;
    height: 700px;
    position: fixed;
    left: 50%;
    top: calc(50% + 25px);
    transform: translate(-50%,-50%);
    background-color: white;
    box-shadow: 0 0 11px #0000004d;
    border-radius: 9px;
    z-index: 4;
    overflow: hidden;
}

.advanced-search .primary-info {
    width: 200px;
    top: calc(50% - 17px);
    transform: translateY(-50%);
    position: absolute;
}

.primary-info {}

.button.apply {
    position: absolute;
    bottom: 30px;
    left: 50%;
    transform: translateX(-50%);
}

.tags:not(.object-container) {
    width: 43%;
    margin-top: 65px;
    margin-left: 20px;
}

.extra-tags {
    width: 43%;
    margin-left: 20px;
    margin-top: 17px;
}

.sort {
    position: absolute;
    top: 65px;
    right: 20px;
    width: 43%;
}

.recent-series-item-large.nonactive {
    background-color: #21c2ff14;
}

.sort select {
    position: relative;
    left: 50%;
    transform: translateX(-50%);
    width: 50%;
}

.sort .header {
    margin-top: unset;
    padding-top: unset;
    margin-bottom: 10px;
}

.billing-settings {
    width: fit-content;
    width: -moz-fit-content;
    left: 50%;
    transform: translateX(-50%);
    position: relative;
    margin-top: 40px;
    padding: 20px;
    box-shadow: 0 0 4px #00000024;
    border-radius: 4px;
}

.billing-settings .info-item {
    margin-top: 10px;
    left: 50%;
    transform: translateX(-50%);
    position: relative;
    width: fit-content;
    width: -moz-fit-content;
}

.billing-settings .button.save {
    margin-top: 20px;
}

.next-bill {
    text-align: center;
    margin-top: 18%;
    width: 70%;
    left: 50%;
    transform: translateX(-50%);
    position: relative;
}

.payment-partner img {
    width: 83px;
}

.payment-partner {
    position: absolute;
    top: 20px;
    left: 26px;
    font-size: 20px;
}

.notification.error {
    /* background-color: red; */
    background: linear-gradient(45deg, rgb(129, 38, 38), #a64c4c);
}

.notification.warn {
    /* background-color: red; */
    background: linear-gradient(45deg, rgb(201 116 16), #e46409);
}

.notification::after {content: " ";width: 100%;height: 2px;position: absolute;bottom: 0px;}

.transaction .fa-flag {
    color: #ffffff;
}

.transaction-view {
    position: fixed;
    width: 600px;
    height: 400px;
    background-color: white;
    left: 50%;
    transform: translate(-50%,-50%);
    z-index: 2;
    top: 50%;
    box-shadow: 0 0 9px #00000061;
    border-radius: 3px;
}

.transaction-view .timestamp {
    position: absolute;
    right: 20px;
    top: 10px;
    color: #2e2e2e;
}

.transaction-view .transaction-type {
    position: absolute;
    top: 10px;
    left: 20px;
    color: #2e2e2e;
}

.transaction:hover .fa-flag {
    display: none;
}

.transaction:not(:hover) .fa-flag{
    display: block;
    color: #e7a11f;
}

.transaction:not(:hover) .fa-check {
    display: none;
}

.transaction:hover .fa-check{
    display:inline-block;
}



.transaction .fa-check {color: #1dd71a;}

.logo {
    cursor: pointer;
    margin-right: 25px;
    margin-left: 25px;
    padding: 5px;
}

.topbar .logo img {
    height: 20px;
}
.sidebar-page.series-items>.main>.header {
    margin-bottom: 50px;
}

.recent-series-item-large i.fa.fa-clock {
    position: absolute;
    left: 50%;
    transform: translate(-50%,-50%);
    top: 50%;
    color: #ffffff94;
    mix-blend-mode: hard-light;
}

i.fa.fa-4x.fa-clock {}

.account-logo {
    width: 125px;
    cursor: pointer;
    height: 125px;
    left: 50%;
    transform: translateX(-50%);
    position: relative;
    margin-top: 25px;
    border-radius: 100%;
    margin-bottom: 10px;
}

.account-logo i.fa.fa-user {
    position: absolute;
    left: 50%;
    transform: translate(-50%,-50%);
    top: 50%;
    color: #2a2a2a;
}

.account-logo i.fa.fa-2x.fa-edit {
    position: absolute;
    color: white;
    left: 50%;
    transform: translate(-50%,-50%);
    top: 50%;
    width: 28px;
}

.account-logo i.fa.fa-2x.fa-edit {
    display: none;
}

.account-logo:hover .account-logo-circle {
    filter: blur(2px) brightness(0.5);
}

.account-logo-circle {
    width: 100%;
    height: 100%;
    background-color: white;
    border-radius: 100%;
    box-shadow: 0 0 7px #00000073;
}

.account-logo:hover i.fa.fa-2x.fa-edit {
    display: block;
}

div.warning {
    width: 80%;
    margin-top: 20px;
    height: 100px;
    margin: auto;
    margin-top: 30px;
    box-shadow: 0 0 6px #00000075;
    border-radius: 10px;
    background-color: #cf4545;
    position: relative;
    display: flex;
    justify-content: left;
    align-items: center;
}

.warning>i.fa {
    margin-left: 20px;
    color: white;
    margin-right: 20px;
}

.warning-body {
    margin-left: 26px;
    width: 64%;
    height: fit-content;
	height: -moz-fit-content;
    position: relative;
    color: white;
    font-size: 13px;
    text-align: initial;
}

.next.white {
    background-color: white;
    color: #2c88f0 !important;
}

.warning .next {
    position: absolute;
    right: 30px;
    left: unset;
    bottom: 50%;
    transform: translateY(50%);
}

.warning .next i {
    color: #cf4545;
}

.user-detail i.fa.fa-exclamation {
    position: relative;
    padding-right: 7px;
    padding-left: 10px;
    color: #cf4545;
}

.content-block {
    width: 500px;
    position: relative;
    margin: auto;
    margin-top: 50px;
    box-shadow: 0 0 6px #00000057;
    border-radius: 4px;
    padding-bottom: 25px;
    margin-bottom: 50px;
}

.content-block .header {
    text-align: left;
    margin-left: 30px;
}

.content-block p {
    margin-left: 31px;
    font-size: 12px;
    margin-top: 10px;
}

.content-block .button {
    margin-top: 17px;
    margin-left: 30px;
    display: inline-block;
}

.content-block.twofa {
}

.content-block .button.disable {
    background-color: #b32b2b;
}

.content-block.twofa .desc {
    display: inline-block;
    margin-left: 20px;
}

.sidebar.accounts {
    z-index: 1;
}

.access-item {
    height: 20px;
    position: relative;
    display: flex;
    margin-top: 5px;
    font-size: 14px;
    align-items: center;
    justify-content: left;
}

.content-block.access p {margin-bottom: 20px;}

.content-block.access .access, .dot {
    height: 10px;
    width: 10px;
    margin-left: 30px;
    background-color: #9e0000;
    border-radius: 100%;
}

.access-item>* {margin-left: 20px;}

.access.none {
    background-color: #b91111 !important;
}



.content-block.editable p {
    margin-bottom: 28px;
    text-align: center;
}

.label {
    display: inline-block;
    margin-left: 30px;
    width: 122px;
}

.content-block.editable i.fa.fa-pencil-alt, .content-block.editable i.fa.fa-check {
    position: absolute;
    right: 20px;
    top: 20px;
    cursor: pointer;
}

.content-block.editable i.fa.fa-check {
    color: green;
}

.content-block.notification-settings .finish-list {
    margin-top: 30px;
}

.content[page='assignments'] .finish-item .button {
    width: 110px;
    height: 17px;
    font-size: 13px;
    position: absolute;
    right: 16px;
    transform: translateY(-50%);
    top: 50%;
}

.letter-selector {
    position: absolute;
    width: 730px;
    height: 519px;
    left: 50%;
    top: 50%;
    transform: translate(-50%,-50%);
    background-color: white;
    box-shadow: 0 0 6px #00000075;
    z-index: 9;
    overflow: scroll;
    border-radius: 5px;
}

.letter-selector .header {margin-bottom: 20px;}

.letter-selector .letter {
    cursor: pointer;
}

.push-enable {
    width: 400px;
    height: 400px;
    background-color: white;
    z-index: 5;
    position: fixed;
    left: 50%;
    top: 50%;
    transform: translate(-50%,-50%);
    box-shadow: 0 0 8px #0000005e;
    border-radius: 6px;
}

.push-enable i.fa.fa-bell {
    position: relative;
    left: 50%;
    transform: translate(-50%,-50%);
    margin-top: 31%;
    font-size: 100px;
    color: #4892ff;
    text-shadow: 0px 2px 4px #00000057;
}

.push-enable .header {
    font-size: 19px;
    margin-top: -20px;
}

.button {
}

.push-enable .button.cancel {
    background-color: #b63e3e;
}

.push-enable .next {
    bottom: 40px;
}

.push-enable i.fa.fa-times {
    position: absolute;
    right: 30px;
    top: 19px;
    font-size: 21px;
    cursor: pointer;
}

.subscriptions, .settings .documents, .product-management .products, .donor-management .acknowledgement-tiers, .customer-settings .setting-types {
    margin-top: 30px;
    display: flex;
    flex-direction: column;
    justify-content: start;
    align-items: center;
    width: 90%;
    position: relative;
    flex-wrap: wrap;
    justify-content: center;
}

.subscription, .settings .document-type {
    width: 410px;
    height: 210px;
    background-color: white;
    box-shadow: 0 0 7px #0000004a;
    border-radius: 6px;
    position: relative;
    padding: 3px 21px;
    margin: 20px;
}

.subscriptions .subscription>.header,.document-type.header {
    font-size: 14px;
    margin-bottom: 2px;
    margin-top: 10px;
}

.subscription i.fa.fa-edit, .document-type i.fa.fa-edit {
}

div#subscription-series-items {}

div.subscription-list-item {
    font-size: 13px;
    font-weight: lighter;
}

.subhead {
    width: 100%;
    text-align: center;
    margin-top: 0;
    font-size: 13px;
}

.subscription .subhead,.document-type .subhead {
    margin-bottom: 10px;
}


.subscription .descriptor, .document-type .descriptor {
    font-size: 10px;
    margin-top: 7px;
    margin-left: 0px;
    position: absolute;
}

.subscription .finish-list, .document-type .finish-list {
    margin-top: 20px;
    font-size: 13px;
}

.edit-subscription .basic-info {
    padding-bottom: 30px;
    position: relative;
    width: 337px;
    height: fit-content;
	height: -moz-fit-content;
    display: inline-block;
}

.info-item {
    width: fit-content;
    left: 50%;
    position: relative;
    transform: translateX(-50%);
    margin-top: 10px;
}

.edit-subscription .header {
    margin-bottom: 20px;
}

input.sub-name, input.document-name {
}

.edit-subscription .series-info {
    height: fit-content;
	height: -moz-fit-content;
    width: 341px;
}

.topline {
    display: flex;
    align-items: baseline;
    margin-top: 40px;
    width: 90%;
    left: 50%;
    transform: translateX(-50%);
    position: relative;
    justify-content: space-around;
    border-bottom: 2px solid #ececec;
    flex-wrap: wrap;
}

.series-info .finish-list {
    margin-bottom: 15px;
}

.letter-list {
    width: 70%;
    height: fit-content;
	height: -moz-fit-content;
    padding-bottom: 40px;
    font-size: 14px;
    font-weight: lighter;
}

.assignment .assignment-data {margin-right: 6px;}

.assignment .button {
    width: 69px;
    padding: 5px;
    font-size: 10px;
    height: 14px;
    margin-left:20px;
}

.finish-item .assignment {
    display: flex;
    align-items: center;
    cursor: inherit;
}

.assignment .fa-search {
    cursor: pointer;
    color: #2d2d2d;
}

.edit-subscription .next {
}

.edit-subscription .button.save, .edit-document .button.save {
    position: fixed;
    right: 40px;
    top: 75px;
    z-index: 1;
}

.assignment i.fa.fa-times {
    margin-left: 15px;
    cursor: pointer;
}

.finish-item>.value .fa {margin-left: 20px;}

.edit-document .button.new {
    left: 50%;
    transform: translateX(-50%);
    position: relative;
    margin-top: 21px;
}

.field-editor {
    width: 500px;
    height: 300px;
    z-index: 4;
    background-color: white;
    position: absolute;
    left: 50%;
    transform: translate(-50%,-50%);
    top: 47%;
    border-radius: 6px;
}

.field-editor .finish-list {
    width: 90%;
    margin-top: 15px;
}

.field-editor .button {
    bottom: 30px;
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
}

.new-transaction .mini-subscription, .new-document .mini-document {
    width: 230px;
    padding-bottom: 20px;
    box-shadow: 0 0 7px #0000004a;
    border-radius: 6px;
    position: relative;
    margin: 10px;
    cursor: pointer;
    transition: all 200ms;
}

.new-transaction .mini-subscription .grouping {
    position: absolute;
    right: 10px;
    font-size: 9px;
    top: 5px;
}

.new-transaction .subscription-selection .container, .new-document .document-selection .container {
    display: flex;
    justify-content: center;
    margin-top: 16px;
    flex-wrap: wrap;
    width: 100%;
    left: 50%;
    transform: translateX(-50%);
    position: relative;
    padding-bottom: 30px;

}



.new-transaction .mini-subscription .header {
    margin-top: 3px;
}

.new-transaction .subscription-selection .title {
    text-align: center;
    margin-top: 13px;
    font-size: 13px;
    font-weight: lighter;
}

.new-transaction .mini-subscription:hover, .new-document .mini-document:hover {background-color: #3d84ff;color: white !important;}

.new-transaction .mini-subscription:hover *, .new-document .mini-document:hover * {
    color: white;
}

.new-transaction .subscription-selection .container:not(:last-of-type) {
    border-bottom: 1px solid #00000021;
}

.new-document .document-selection .container {
    width: 80%;
    max-height: 300px;
    top: 45%;
    transform: translate(-50%,-50%);
    position: absolute;
}

.new-document .main .finish-list.last {
    margin-bottom: 80px;
}

.new-document .next {
    position: fixed;
}

.new-document .mini-document:last-of-type {
    margin-bottom: 40px;
}

.product, .flow {
    margin: 21px;
    width: 330px;
    border-radius: 7px;
    position: relative;
    overflow: hidden;
    display: flex;
    align-items: center;
    flex-direction: column;
    justify-content: space-between;
    box-shadow: 0 0 4px #0000003d;
    padding: 20px 20px;
    height: 330px;
}

.products .product .header, .flows .flow .header {
    font-size: 10px;
    margin-left: 9px;
    margin-right: 10px;
    width: unset;
    height: 15px;
}

.product .product-image {
    width: fit-content;
    height: 180px;
    z-index: 0;
    display: flex;
    justify-content: center;
    border-radius: 4px;
    flex-shrink: 0;
    width: 230px;
    margin-right: unset;
    margin-top: 20px;
}



.product-image img, .system-image img {
    border-radius: 5px;
    overflow: hidden;
    object-fit: cover;
    height: 100%;
    /* box-shadow: 0 0 7px #0000003b; */
}

.product .price {
    font-size: 12px;
    bottom: 15px;
    position: absolute;
    margin-left: 15px;
}

.products .product .actions {
    bottom: 15px;
    position: absolute;
    right: 15px;
    display: flex;
    align-items: center;
}

.product .actions .fa {
    color: #323232;
}

.product .prod-id {
    position: absolute;
    left: 10px;
    top: 6px;
    font-size: 9px;
    font-weight: lighter;
}

.bottom-bar {
    height: 41px;
    position: absolute;
    width: 100%;
    left: 0px;
    bottom: 0px;
    background-color: white;
    display: flex;
    align-items: center;
}

.create-product, .edit-donor-tier, .edit-customer-setting, .create-series-item {
    width: 600px;
    height: 400px;
    background-color: white;
    z-index: 3;
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%,-50%);
    border-radius: 7px;
    overflow: hidden;
}

.create-product .product-image{
    width: 140px;
    margin-left: 40px;
}

.create-product .upload-bottom {
    margin-left: 30px;
    width: 150px;
}

.create-product .upload-bottom input {
    width: calc(100% - 20px);
    margin-top: 18px;
}

.create-product i.fa.fa-times {
    position: absolute;
    right: 25px;
    font-size: 19px;
    top: 15px;
    cursor: pointer;
}

.create-product .product-image::-webkit-scrollbar, .edit-series-item .product-image::-webkit-scrollbar {
  display: none;
}


.create-product .combine {
    top: 50%;
    transform: translateY(-50%);
    position: absolute;
}

.settings-group:last-of-type {
    margin-bottom: 100px;
}

.series-list {margin-top: 30px;display: flex;align-items: center;justify-content: center;flex-wrap: wrap;}





.descriptor {
    position: absolute;
    font-size: 10px;
    margin-top: 5px;
    margin-left: 11px;
}

.series .actions {
    width: fit-content;
    display: flex;
    position: absolute;
    top: 10px;
    right: 9px;
    flex-direction: column;
    font-size: 13px;
}

.series i.fa.fa-edit {
    cursor: pointer;
}

.subscription:last-of-type, .settings .document-type:last-of-type {
    margin-bottom: 100px;
}

.series-settings .finish-list {
    width: 80%;
    margin-top: 30px;
}

.edit-donor-tier .finish-list {
    margin-top: 30px;
}

.donor-management .acknowledge-tier, .customer-settings .setting-type {
    flex-direction: row;
    width: 400px;
    height: 40px;
    background-color: white;
    box-shadow: 0 0 7px #0000004a;
    border-radius: 4px;
    align-items: center;
    margin-bottom: 12px;
    display: flex;
    position: relative;
}

.acknowledge-tier>* {
    position: relative;
    margin-left: 30px;
}

.acknowledge-tier .acknowledge-amount {
    float: right;
    right: 87px;
    position: absolute;
}

.action-list {
    position: absolute;
    right: 0px;
    margin-right: 14px;
}

.action-list>* {
    margin-right: 5px;
    cursor: pointer;
}

.ack-generator {
    width: 500px;
    height: 300px;
    left: 50%;
    top: 50%;
    transform: translate(-50%,-50%);
    position: fixed;
    box-shadow: 0 0 5px #00000045;
    border-radius: 5px;
    z-index: 4;
    background-color: white;
}

.ack-generator .header {
    font-size: 14px;
    font-weight: normal;
}

.ack-generator .finish-list {
    margin-top: 20px;
}

.donor-management .container-item.link {
    margin: auto;
    text-align: center;
    margin-top: 30px;
    width: 200px;
}

.open-settings .finish-list {
    margin-top: 29px;
}

.open-settings .title {
    text-align: center;
    margin-top: 43px;
    font-weight: bold;
    color: #2e2e2e;
}

.content.open-settings .finish-list.sorting {
    margin-top: 24px;
}

.customer-settings .setting-type {
    width: 500px;
    display: flex;
    align-items: center;
    position: relative;
}

.setting-type>* {
    margin-left: 30px;
}

.setting-type .switch, .setting-type input {
    position: absolute;
    right: 90px;
}

.setting-type {}

.setting-type:first-of-type {
    margin-top: 40px;
}

.ack-generator input {
    width: 140px;
}

.edit-customer-setting .finish-list {
    margin-top: 30px;
}

.advanced-search .filters.finish-list {
    margin-top: 10px;
    width: 100%;
}

.advanced-search .title, .category-header .title {
    text-align: center;
    font-weight: lighter;
    display: flex;
    justify-content: space-around;
    width: 100%;
    margin: auto;
    border-bottom: 1px dotted #3f3f3f;
    padding-bottom: 5px;
}

.advanced-search .filter-block:first-of-type {
    margin-top: 64px;
}

.title {}

.advanced-search .title .fa-plus, .category-header .title .fa-plus {
    cursor: pointer;
}

.advanced-search .title>div, .category-header .title>div {
    min-width: 200px;
    text-align: left;
}

.advanced-search .content.main {
}

.advanced-search .filter-block, .category-header {
    box-shadow: 0 0 5px #00000030;
    padding: 5px 4px;
    width: 70%;
    margin: auto;
    margin-top: 2px;
    margin-bottom: 0px;
    border-radius: 6px;
}

.advanced-search .main .header {
    margin-bottom: 40px;
}

.white-back {
    width: 100%;
    height: 16%;
    bottom: 0px;
    position: fixed;
    background-color: white;
    left: 0px;
    z-index: 2;
    box-shadow: 0 0 8px #0000001a;
}

.advanced-search .main .container {
    height: 84%;
    overflow-y: scroll;
    position: relative;
    width: 100%;
    z-index: 4;
}

.advanced-search .subhead {
    font-weight: lighter;
}

.advanced-search .content:not(.main) .finish-list, .new-mailing .segment-filter-list .finish-list {
    margin-top: 22px;
    width: 82%;
    user-select: none; -webkit-user-select: none;
}

.advanced-search .content:not(.main) .finish-item:hover, .new-mailing .segment-filter-list .finish-item:hover {
    cursor: pointer;
    border-radius: 5px;
}

.advanced-search i.fa.fa-check, .new-mailing .segment-filter-list i.fa.fa-check {
    color: #009c0d;
}

.advanced-search .content:not(.main) .finish-item:hover .fa, .new-mailing .segment-filter-list .finish-item:hover .fa {
}

.advanced-search .search, .new-mailing .search {
    position: absolute;
    display: flex;
    align-items: center;
    width: 200px;
    justify-content: space-evenly;
    right: 20px;
    top: 72px;
}

.advanced-filter-info {
    position: absolute;
    bottom: 73px;
    text-align: center;
    width: 100%;
    font-size: 12px;
    font-weight: lighter;
}

.customer-list i.fa.fa-file-export {
    position: relative;
}

.customer-list .action-list {
    right: 40px;
    top: 19px;
}

.customer-list .action-list .fa {
    font-size: 20px;
    cursor: pointer;
    color: #2260eb;
}

.search-sidebar .action-block {
    position: absolute;
    font-size: 14px;
    right: 10px;
    top: 10px;
    cursor: pointer;
    display: flex;
    width: 46px;
    justify-content: space-around;
}

.search-sidebar .header {
    margin-top: 10px;
}

.customer-list .subhead {
    position: absolute;
    font-size: 10px;
    margin-top: 3px;
}

.transaction-preview {
    width: 80%;
    height: 250px;
    position: fixed;
    left: 50%;
    transform: translateX(-50%);
    border-radius: 4px;
    background-color: white;
}

.transaction-preview .transaction-desc {
    font-size: 12px;
    margin-top: 6px;
    margin-left: 8px;
    position: absolute;
}

.transaction-preview .absolute-typing {
    position: absolute;
    right: 10px;
    font-size: 12px;
}

.transaction-preview .transaction-type-desc {
    width: fit-content;
    text-align: center;
    margin-top: 25px;
    position: relative;
    left: 50%;
    transform: translateX(-50%);
}

.transaction-preview .subhead {
    font-size: 10px;
    font-weight: lighter;
    margin-top: 2px;
}

.transaction-amount {
    position: absolute;
    font-size: 12px;
    font-weight: lighter;
    left: 8px;
    top: 22px;
    display: flex;
    color: #232323;
    align-items: center;
}

.transaction-tag-data {
    position: absolute;
    right: 9px;
    display: flex;
    top: 7px;
    font-size: 12px;
}

.transaction-tag-data>* {
    color: #0054bc;
    cursor: pointer;
    margin-left: 9px;
}

.transaction-amount .fa {
    font-size: 10px;
    margin-left: 5px;
}

.transaction-preview .finish-list {
    font-size: 12px;
    font-weight: lighter;
    width: 78%;
}

.transaction-preview .finish-item .fa {
    color: #0054bc;
}

.transaction-preview .finish-item {
    padding: 3px 6px 3px 6px;
}

.transaction-preview .custom-data {
    position: absolute;
    display: flex;
    flex-direction: column;
    width: 100%;
    left: 50%;
    transform: translateX(-50%);
    height: 78px;
    border-top: 1px solid #e5e5e5;
    padding-top: 7px;
    padding-bottom: 7px;
    bottom: 0px;
    overflow-x: scroll;
}

.transaction-preview .custom-data .data {
    font-weight: lighter;
    margin-top: 20px;
}

.finish-content .transaction-preview {
    margin-top: 40px;
}

.donation-data .finish-list {
    width: 90%;
    margin-top: 30px;
}


.series-info .period-series-items {
    width: 50px;
}

.transaction .item.amount {
    margin-left: 10px;
    font-weight: lighter;
    min-width: 80px;
}

.item.transaction-time {
    right: 10px;
    position: absolute;
    padding-right: 10px;
}

.item.receipt {
    margin-left: calc(10% - 75px);
    height: 100%;
    white-space: pre-wrap;
    max-width: 34%;
    font-size: 11px;
}

.item.type {
    min-width: 180px;
}

.transaction .transaction-tag-data {
    transform: scale(.7);
    transform-origin: right;
    right: 20px;
    top: 4px;
}

.customer.last {
    margin-bottom: 50px;
}

.advanced-search li .value input {
    width: 140px;
    text-align: left;
    padding-right: 19px;
}

.edit-document .basic-info {
    width: 300px;
}

.log .item.time {
    position: absolute;
    right: 0px;
    padding-right: 25px;
}

.log .item.action {
    min-width: 105px;
}

.campaign-bar .bar-item:hover {
    background-color: #dfdfdf;
}

.campaign-bar .bar-item:first-of-type {
    border-left: 1px solid #d6d6d6;
}

.campaign-bar .bar-item.open {
    background-color: #2c88f0;
    color: white;
}

.campaign-topbar i.fa.fa-cog {
    position: absolute;
    right: 25px;
    cursor: pointer;
}

.topbar .display-item {
    cursor: inherit;
}

.campaign-card .topbar, .white.topbar {
    position: relative;
    background-color: white;
    z-index: 3;
}

.campaign-card .topbar>*, .topbar.white>* {
    color: #383838;
}

.campaign-topbar .campaign-name {
    margin-left: 57px;
    font-weight: 500;
    text-overflow: ellipsis;
    overflow: hidden;
}

.campaign-settings {}

.campaign-topbar i.fa.fa-cog {
    position: absolute;
    right: 25px;
    cursor: pointer;
}

.topbar .display-item {
    cursor: inherit;
    padding-right: 30px;
    margin-right: 33px;
    margin-left: 15px;
    border-right: 1px solid #00000021;
}

.campaign-page {
    position: absolute;
    width: 100%;
    height: calc(100% - 50px);
    background-color: #f6f6f6;
    overflow: scroll;
    overflow-x: hidden;
}

.campaign-page.settings .finish-list {
    width: 450px;
    margin-top: 20px;
}

.finish-item>.button {
    text-align: center;
    display: block;
}

.campaign-page.settings .button.save {
    position: relative;
    margin: auto;
    margin-top: 40px;
}

.campaign-page .items, .items.campaign-wide-items.items, .demon-wide-items.items {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    margin-top: 33px;
}

.campaign-page .items>.item, .campaign-wide-items.items>.item, .demon-wide-items>.item {
    width: 300px;
    height: 200px;
    background-color: white;
    box-shadow: 0 0 7px #0000002e;
    border-radius: 5px;
}

.campaign-page .line-item, .campaign-wide-items.items .line-item, .demon-wide-items.items .line-item {
    height: 70px !important;
    display: flex;
    align-items: center;
    padding: 0px 22px;
    color: #3b3b3b;
    position: relative;
    margin-bottom: 20px;
    cursor: pointer;
}

.items .item.line-item>.fa {
    font-size: 22px;
}

.items .line-item>* {
    margin-right: 10px;
}

.line-item>.continue, .campaign-wide-items.items .line-item>.continue,.demon-wide-items.items .line-item>.continue  {
    position: absolute;
    right: 20px;
    display: flex;
    align-items: center;
}

.items .line-item>.continue>.fa {
    cursor: pointer;
}

.items .line-item>.continue>* {
    margin-left: 12px;
}

.campaign-page .item .button {
    width: 90px;
    margin-right: unset;
    right: 22px;
    position: absolute;
    padding: 5px;
}

.log i.fa {
    margin-right: 10px;
}

.log .fa-link {
    margin-left: 10px;
}

.product-selection .itemlist, .add-manual-history-items .itemlist {
    position: absolute;
    top: 75px;
}

.itemlist .item>.item-display, .product-container .item>.item-display {
    box-shadow: 0 0 5px #00000047;
    width: 100%;
    height: 100%;
    border-radius: 4px;
    background-color: white;
    position: relative;
    display: flex;
    flex-direction: row;
    justify-content: center;
    transition: all 200ms;
    overflow: hidden;
}

.itemlist .item:last-of-type,.product-container .item:last-of-type {padding-right: 40px;}

.itemlist .logo {
    position: fixed;
    top: 12px;
    left: 12px;
    color: #3b3b3b;
    font-size: 12px;
    margin: unset;
}

.itemlist .contents {
    display: flex;
    height: 100%;
    align-items: center;
    justify-content: left;
    overflow-y: hidden;
    overflow-x: scroll;
    position: absolute;
    top: 0;
    left: 0;
    width: -webkit-fill-available;
    padding-left: 40px;
    padding-top: 0px;
    padding-right: 40px;
    width: -moz-available;
}

.itemlist i.icon.fa.fa-shopping-cart {
    color: #3b3b3b63;
    position: absolute;
    top: 11px;
    left: 13px;
    font-size: 10px;
}

.itemlist .contents .item-image-container:hover .item-name, .product-container .item-image-container:hover .item-name {
    position: absolute;
    z-index: 2;
    color: white;
    text-align: center;
    margin-top: 5px;
    left: 50%;
    transform: translateX(-50%);
    font-size: 11px;
    width: 95%;
}

.itemlist .item:hover .item-display {
}

.itemlist .contents .item-image-container:not(:hover) .item-name,.product-container .item .item-image-container:not(:hover) .item-name {
    display: none;
}

.mod-transaction .main>.actions {
    position: absolute;
    font-size: 11px;
    top: 25px;
    right: 30px;
}

.itemlist .item .actions, .product-container .item .actions {
    position: absolute;
    width: 100%;
    height: calc(100% - (63% + 20px));
    justify-content: space-evenly;
    align-items: center;
    display: flex;
    bottom: 0;
    color: #3b3b3b;
    z-index: 2;
    background-color: white;
}

.itemlist .item .actions>*, .product-container .item .actions>* {
    margin: unset;
}

.itemlist .actions .fa-plus,.itemlist .actions .fa-minus {
    cursor: pointer;
    color: inherit;
}

.itemlist .item:hover .actions {
}

.itemlist .item .item-display .item-image-container, .product-container .item .item-display .item-image-container {
    height: 63%;
    width: 100%;
    transition: 200ms;
    position: relative;
    display: flex;
    justify-content: center;
    padding-top: 10px;
    padding-bottom: 10px;
    overflow: hidden;
}

.itemlist .item-image-container:hover, .product-container .item-image-container:hover {
    background-color: #545454;
    z-index: 2;
    box-shadow: inset 0 0 20px #00000054;
}

.itemlist .item-image-container:hover img, .product-container .item-image-container:hover img {
    filter: brightness(0.4);
    transform: scale(1.25) translate(0,0%);
}

.itemlist .actions .count, .product-container .actions .count {
    cursor: default;
    user-select: text;
}

.itemlist .item-image-container:hover i.fa.fa-trash {
    position: absolute;
    bottom: 10px;
    color: white;
    z-index: 2;
    font-size: 14px;
    cursor: pointer;
    display: block;
}

.itemlist>.actions {
    display: flex;
    position: absolute;
    right: 13px;
    top: 11px;
    flex-direction: row-reverse;
    color: #3b3b3b;
    font-size: 12px;
    z-index: 2;
}

.itemlist>.actions>* {margin-left: 13px;}

.itemlist .item-image-container i.fa.fa-trash {
    display: none;
}

.category-header {
    box-shadow: unset;
    cursor: pointer;
    width: 90%;
}

.new-transaction .category-header:first-of-type {
    margin-top: 30px;
}

.new-transaction .product-listings .subhead, .add-manual-history-items .product-listings .subhead {
    margin-bottom: 15px;
}

.category-header .category {
    margin-top: 15px;
    display: flex;
    justify-content: top;
    flex-wrap: nowrap;
    flex-direction: column;
    align-items: center;
}

.product-item {
    width: auto;
    max-width: 130px;
    height: 150px;
    box-shadow: 0 0 5px #0000004f;
    border-radius: 6px;
    overflow: hidden;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-right: 15px;
    margin-bottom: 15px;
    margin-left: 15px;
}

.product-item img {
    height: 100%;
    position: relative;
    transition: all 200ms;
    border-radius: 6px;
}

.product-item .product-name {
    position: absolute;
    z-index: 2;
    color: white;
    text-align: center;
    transform: translateY(-50%);
    display: none;
    transition: all 200ms;
}

.product-item:hover .product-name {
    display: block;
}

.product-item:hover img {
    filter: brightness(0.5);
}

.category-header:last-of-type {
    margin-bottom: 50px;
}

.product-item i.fa.fa-check {
    position: absolute;
    color: #50ff50;
    z-index: 2;
    font-size: 34px;
}

.product-item:hover  i.fa.fa-check {
    margin-top: 26px;
}

.item.receipt .product-item {
    height: 80%;
    margin: unset;
    border-radius: 3px;
    margin-right: 9px;
}

.item.receipt .product-item img {
    border-radius: 3px;
}

.advanced-search .filter-block {
    margin-top: 20px;
    margin-bottom: 20px;
}

.transaction-preview .product-item {
    height: 100%;
    width: fit-content;
    flex-shrink: 0;
    margin: unset;
    padding-left: 10px;
    padding-right: 10px;
    box-shadow: unset;
}

.series .actions>* {
    margin-bottom: 10px;
}

.transaction-tag-data .fas {
    transform: translateY(10%);
}

.recent-series-item-large .actions>* {
    margin-left: 5px;
    color: #3b3b3b;
}

.recent-series-item-large .actions>* {
    color: #3b3b3b;
    margin-left: 15px;
}

.recent-series-item-large .ordered-number {
    position: absolute;
    right: 10px;
    top: 6px;
    color: #3b3b3b;
}

left {
}

.series-settings .naming-scheme {
    padding: 10px;
    width: 300px;
    height: 35px;
    box-shadow: 0 0 7px #00000045;
    border-radius: 4px;
    text-align: left;
    font-size: 10px;
    overflow-y: scroll;
}

.series-settings .finish-item.large {
    height: 57px;
}

.button.save {
    position: relative;
    margin: auto;
    margin-top: 20px;
}

.series-exports .finish-list {
    width: 70%;
    margin-top: 30px;
}

.order-fill .itemlist {
    width: 500px;
    margin: unset;
    z-index: 0;
    position: relative;
    margin: auto;
}

.pager-position {
    position: absolute;
    display: flex;
    top: 20px;
    left: 50%;
    transform: translateX(-50%);
}

.pager-position>div {
    width: 10px;
    height: 10px;
    border-radius: 10px;
    background-color: white;
    margin-right: 5px;
    margin-left: 5px;
    cursor: pointer;
    box-shadow: 0 0 3px 1px #0000005e;
    transition: all 200ms;
}

.active {}

.pager-position>div.active {
    background-color: #008c00;
}

.order-fill .transaction-preview {
    left: unset;
    width: 450px;
    transform: scale(.35);
    right: 0px;
    transform-origin: top right;
    margin-top: 15px;
    margin-right: 15px;
    transition: all 200ms;
    border-radius: 10px;
    z-index: 2;
}

.order-fill .transaction-preview:hover {
    transform: scale(.8);
    border-radius: 5px;
}

.order-fill .content .subhead {
    margin-bottom: 60px;
}

.order-fill .itemlist-title {
    width: 500px;
    margin: auto;
    margin-bottom: 7px;
    font-weight: lighter;
    font-size: 11px;
}

.order-fill .letters .letter-list {
    margin: auto;
    border-top: 1px solid #00000026;
}

.letter-fill-item {
    width: -webkit-fill-available;
    height: 50px;
    padding: 0px 13px;
    display: flex;
    align-items: center;
    box-shadow: 0 0 5px #0000004d;
    border-radius: 5px;
}

.order-fill .letter-fill-item>* {
    margin-left: 6px;
}

.order-fill .letter-fill-item>i {margin-left: 16px;}

.order-fill .letter-list table {
    width: 100%;
    padding-top: 10px;
}

.order-fill table tr i {
    margin-right: 7px;
}

.order-fill .letters table tr:not(:first-of-type) {height: 30px;background-color: #0000000a;}

.order-fill .letters table tr:first-of-type {
    height: 26px;
    text-align: left;
}

.order-fill .letter-list .header {
    text-align: center;
}

.order-fill .letters table tr:not(:first-of-type) td {
    padding: 0px 10px;
    position: relative;
}

.order-fill .letters .letter-list .throbber {
}

.order-fill .letter-list .load-throbber {
    transform: scale(.4) translate(-50%,-50%);
    transform-origin: 0 0;
    position: absolute;
    top: 50%;
    left: 50%;
}

.order-fill .note {
    width: 500px;
    margin: auto;
    margin-top: 40px;
}

.order-fill .note .subhead {
    margin-bottom: 20px;
}

.order-fill .customer-tag {
    display: flex;
    position: absolute;
    top: 20px;
    left: 20px;
    cursor: pointer;
    align-items: center;
}

.order-fill .customer-tag>* {
    margin-right: 9px;
}

.section-title i.fa.fa-plus {
    position: absolute;
    right: 40px;
    cursor: pointer;
}

.section-title.line-title {
    position: relative;
    border-bottom: 1px solid #0000002e;
    padding-bottom: 4px;
}

.letter-list .finish-item .text .fa-trash {
    margin-right: 5px;
    color: #3b3b3b;
    font-size: 10px;
    cursor: pointer;
}

.edit-subscription .letter-list .finish-item .text {
    min-width: 200px;
}

.edit-subscription .letter-list {
    width: 90%;
}

.mailing-labels .letter-list {
    margin: auto;
    margin-top: 46px;
}

div#print-letter-list-header {}

.product-listings .series {
    margin-bottom: 25px;
}

.merge-letter-content>.content {
    width: 8.5in;
    height: 11in;
    margin: auto;
    margin-bottom: 70px;
    margin-right: 20px;
    margin-left: 20px;
    overflow-wrap: break-word;
}

.setting-item .size-container {
    display: flex;
}

.setting-item .size-container input {
    width: 33px;
    padding-right: 10px;
    margin-right: 8px;
}

.merge-content-main {
    position: absolute;
    top: 66px;
    left: 175px;
    width: calc(100% - 175px);
    overflow-x: scroll;
}

.letter-viewer .letter:after {
    content: '';
    position: absolute;
}

.product-container {width: -webkit-fill-available;}

.product-container, .add-manual-history-items .product-container {
    margin-left: 20px;
    margin-right: 20px;
    display: flex;
    flex-direction: row;
    justify-content: center;
    flex-wrap: wrap;
    margin-top: 30px;
    margin-bottom: 30px;
}

.new-transaction .product-container .item, .add-manual-history-items .product-container .item {
    padding: 10px;
}

.product-container i.fa.fa-times {
    color: #902323;
    font-size: 20px;
}

.product-container i.fa.fa-plus {
    color: #3b3b3b;
    font-size: 20px;
}

.open-product-history .product-container {
    display: flex;
    justify-content: center;
    transform-origin: 0 0;
    width: 500px;
    margin: auto;
    margin-top: 50px;
    flex-wrap: wrap;
}

.open-product-history .product-container .item {
    padding: 15px;
}

.completion-frame iframe {
    width: 100%;
    height: 100%;
    border: unset;
}

.add-manual-history-items {
    /* display: none; */
}

.add-manual-history-items .button.complete {
    position: absolute;
    bottom: 25px;
    left: 50%;
    transform: translateX(-50%);
}

.series .header {
    margin: 0px 34px;
    padding-top: 25px;
    left: 50%;
    font-size: 12px;
    transform: translateX(-50%);
    margin-left: 0px;
    position: relative;
}

.new-mailing {
    position: fixed;
    width: 520px;
    height: 420px;
    background-color: white;
    border-radius: 3px;
    box-shadow: 0 0 7px #00000042;
    z-index: 3;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
    overflow: hidden;
    transition: all 400ms;
}

.new-mailing .finish-list {
    margin-top: 25px;
}

.new-mailing .email-setup .campaign-wide-items.items {
    margin-top: 35px;
    flex-direction: column;
}

.new-mailing .campaign-wide-items.items {
    margin: auto;
    margin-top: 10px;
    flex-direction: column;
    align-items:center;
    justify-content:center;
    width:fit-content;
}


.next.disabled {
    background-color: #bdbdbd;
}

.button.disabled {
    background-color: #bdbdbd;
}

.new-mailing .population-descriptor {
    font-size: 10px;
    margin-right: 16px;
}

.new-mailing .complete.true {
    margin-right: 20px;
    color: #00b400;
}

.new-mailing .complete {
    margin-right: 20px;
    color: #8e0e0e;
    transition: all 100ms;
}

.new-mailing .complete.true .fa-check {display: block;}

.new-mailing .complete:not(.true) .fa-check {
    display: none;
}

.new-mailing .complete.true .fa-exclamation {
    display: none;
}

.new-mailing .complete:not(.true) .fa-exclamation {
    display: block;
}

.variables {
    position: relative;
    width: 420px;
    height: 400px;
    margin-right: 30px;
    margin-left: 90px;
    background-color: white;
    z-index: 4;
    box-shadow: 0 0 10px 0px #0000004d;
    border-radius: 6px;
    overflow: scroll;
}

.letter-viewer-modal .variables .finish-list {
    font-size: 11px;
}

.letter-viewer-modal .cover {
    width: 100%;
    height: 100%;
    position: absolute;
    background-color: #00000052;
    z-index: 3;
    box-shadow: 0 0 15px transparent;
    border-radius: 3px;
}

.letter-viewer-modal .cmd-bar .fa-bug {
    color: #3b3b3b;
    cursor: pointer;
}

.letter-viewer-modal.debug {
    position: absolute;
    height: 400px;
}

.new-mailing .email-setup .campaign-wide-items.items {
    margin-top: 35px;
}

.email-setup .letter-descriptor {
    margin-right: 20px;
}

.new-mailing .section-title {
    width: 100%;
    padding: unset;
    text-align: center;
    margin-left: 30px;
}

.new-mailing .segment i.fa.fa-plus {
    position: absolute;
    top: 26px;
    right: 35px;
    cursor: pointer;
}

.new-mailing .segment-filters .campaign-wide-items {
    margin-top: 40px;
}

.segment-filters .item .continue .selected {
    margin-right: 12px;
    font-size: 10px;
    transform: translateY(-1px);
}

.new-mailing .finish-list[aggregate], .new-mailing .finish-list[email],.new-mailing .finish-list[export] {
    margin-top: 0px;
    border-top: 1px solid #ececec8f;
    padding-top: unset;
}

.new-mailing .search {
    top: 56px;
}

.new-mailing .mailing-desc {
    font-size: 10px;
}

.new-mailing .segment .finish-list {
    width: 93%;
    margin-bottom: 30px;
}

.new-mailing .segment-filter-list .finish-list {
    width: 90%;
}

.new-mailing .letter:hover {
    color: #3b3b3b;
    background-color: #f9f9f9;
    cursor: pointer;
}

.new-mailing .letter.selected {
    background-color: #2e78ff;
    color: white;
}

.new-mailing .letter.selected:hover {
    background-color: #2e78ff;
    color: white;
}

span.brace {
    color: #3876ff;
    padding-left: 0px;
    padding-right: 0px;
    font-size: inherit;
    background-color: #e6e6e6;
    border-radius: 2px;
}

[scheduled-time] input {
    width: 88px;
    margin-left: 10px;
}

.content.mailings .mailing-stats {
    position: absolute;
    font-size: 8px;
    top: 11px;
    left: 23px;
    display: flex;
    color: #3b3b3b;
}

.content.mailings .mailing-stats>* {
    margin-right: 6px;
}

.mailings .mailing-stats .fa {
    margin-right: 4px;
}

.customer-list>.actions {
    display: flex;
    flex-direction: column;
    position: fixed;
    right: 35px;
    margin-top: 5px;
    z-index: 5;
    font-size: 20px;
}

.field-export {
    position: fixed;
    width: 600px;
    height: 500px;
    background-color: white;
    z-index: 3;
    top: 50%;
    transform: translate(-50%,-50%);
    left: 50%;
    border-radius: 6px;
    box-shadow: 0 0 6px #00000057;
    overflow: hidden;
}

.field-export .field-list {
    width: 90%;
    padding: 0px 30px;
    margin-top: 20px;
    height: calc(100% - 155px);
    overflow: scroll;
}

.field-export .fa-list, .field-export .fa-plus {
    margin-right: 15px;
}

.field-export .model-desc {
    position: absolute;
    top: 10px;
    right: 18px;
    font-size: 10px;
}

.field-export .finish-item:not([new]) .text {
    cursor: grab;
}

.field-export [new] {
    cursor: pointer;
    justify-content: center;
}

.field-export .finish-item:last-of-type {
    margin-bottom: 30px;
}

.field-export .finish-item {
    user-select: none; -webkit-user-select: none;
}

.field-export .continue-export {
    width: 100%;
    height: 79px;
    box-shadow: 0 0 5px #00000054;
}

.field-export .finish .button {
    position: absolute;
    bottom: 35px;
    left: 50%;
    transform: translateX(-50%);
}

.field-export .finish .finish-list {
    margin-top: 20px;
}

.edit-product .left-content {}

.dual-content {
    display: flex;
    justify-content: space-around;
}

.field-editor {
    position: absolute;
    z-index: 3;
    width: 400px;
    height: 300px;
    left: 50%;
}

.custom-field-editor {
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%,-50%);
    width: 500px;
    height: 343px;
    background-color: white;
    box-shadow: 0 0 6px #0000004d;
    z-index: 3;
    border-radius: 5px;
    overflow: hidden;
}

.custom-field-editor .finish-list {
    margin-top: 25px;
}

.custom-field-editor .custom-field-preview {
    width: 100%;
}

.finish-list.select-options .finish-item {
    justify-content: space-between;
    width: 65%;
    left: 50%;
    transform: translateX(-50%);
}

.custom-field-editor .select-options {
    margin-top: 10px;
}

.dropdown {
}

.finish-list.select-options {
    height: 135px;
    overflow: scroll;
}

.section-title {
    display: flex;
}

.preview .finish-list .finish-item {
    background-color: #ffffff;
    border-radius: 5px;
    border: 1px solid #0000003b;
    width: 61%;
    top: 40%;
    left: 50%;
    transform: translateX(-50%);
}

.preview .finish-list {
    margin-top: 85px;
}


.product-management .products {
    flex-direction: row;
    margin: auto;
    margin-bottom: 30px;
    margin-top: 30px;
    flex-wrap: wrap;
}

.product .content.secondary {
}


.product .finish-list, .flow .finish-list, .document .finish-list {
    margin-top: 25px;
    font-size: 11px;
}

.finish-item input {}

.finish-item select {
    font-size: inherit;
}

.product .fa.fa-arrow-left.back {
    font-size: 15px;
    top: 14px;
    left: 16px;
}


.product-detail .finish-list {
    width: 80%;
    margin-top: 171px;
    font-size: 12px;
}

.product-detail .product-image {}

.products-small-list {
    transform: scale(.6) translateX(-50%);
    transform-origin: 0 0;
    position: absolute;
    left: 50%;
    margin-top: 17px;
}

.edit-api-key .scopes .finish-list {
    margin-bottom: 30px;
}

.button.add {}

.itemlist .contents .item-image-container:hover .item-name {
    width: 95%;
}

.create-series {
    width: 500px;
    height: 330px;
    background-color: white;
    position: fixed;
    top: calc(50%);
    left: 50%;
    transform: translate(-50%,-50%);
    box-shadow: 0 0 9px #00000040;
    border-radius: 6px;
    z-index: 3;
    overflow: hidden;
}

.create-series .main .finish-list {
    margin-top: 20px;
}

.item.receipt .product-item:first-of-type {
    margin-left: 5px;
}

/* */

.subscription-editor {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
    width: 600px;
    height: 460px;
    background-color: white;
    z-index: 3;
    box-shadow: 0 0 9px #00000030;
    border-radius: 5px;
    overflow: hidden;
}

.subscription-editor .finish-list.basic {
    margin-top: 15px;
}

.subscription-editor .export-definition {
    margin-top: 15px;
}

.export-definition.series-definition {}

.subscription-editor .export-definition .finish-list {
    margin-top: 0px;
}

.subscription-editor .finish-list.series-select {
}

.subscription-editor .finish-list.series-options {
    width: 80%;
}

.subscription-editor .title {
    text-align: center;
}

.subscription-editor .series-options .finish-item {
    padding-top: 8px;
    padding-bottom: 8px;
}

.subscription-editor .letter-list {
    width: 95%;
    margin-top: 30px;
    left: 50%;
    transform: translateX(-50%);
    position: relative;
}

.subscription-editor .letter-list .finish-item .text {
    min-width: 145px;
}

.subscription-editor .series-list {
    border-bottom: unset;
    margin-top: 40px;
}

.edit-subscription .letter-list {
    padding: 0px 2.5%;
    height: 67%;
    overflow: scroll;
    box-shadow: inset 0 0 4px #00000045;
}

.activate-series-item .ordered-number {
    position: absolute;
    z-index: 2;
    color: #3b3b3b;
    right: 14px;
    top: 10px;
    display: flex;
}

.ordered-number .ord {
    margin-right: 5px;
}

.demondms-pref .demon-wide-items.items {
    margin-top: 10px;
}

.demon-large-item {
    width: auto;
    max-width: 770px;
    min-height: 200px;
    margin: 0px 65px;
    margin-left: auto;
    margin-right: auto;
    background-color: white;
    box-shadow: 0 0 6px #00000029;
    border-radius: 5px;
    position: relative;
    margin-bottom: 30px;
    overflow: hidden;
}

h2 {
    font-size: 20px;
    font-weight: lighter;
    color: #3b3b3b;
    margin-left: 30px;
    margin-top: 20;
    margin-top: 20px;
}

h1,h2,h3,h4,h5,h6 {
    font-weight: lighter;
    color: #3b3b3b;
    margin-left: 30px;
}

.demon-large-item h1 {
    top: 80px;
    margin-right: 50px;
}

p {
    font-weight: lighter;
}

p.explanation {
    margin-left: 30px;
    color: #7b7b7b;
    max-width: 90%;
}

.demon-large-item:first-of-type {
    margin-top: 0px;
}

.demon-large-item.credits {
    margin-top: 0px;
}

.charge-table {
    left: 50%;
    transform: translateX(-50%);
    position: relative;
    color: #3b3b3b;
    margin-top: 20px;
    margin-bottom: 10px;
}

.charge-table .finish-item.category .value {
    font-weight: bold;
}

.text {}

.charge-table .finish-item:not(.category), .charge-final .finish-item:not(.category) {
    margin-left: 8px;
    color: #4c4c4c;
}

.charge-final {
    width: 51%;
    position: relative;
    float: right;
    min-height: 30px;
    margin-bottom: 25px;
    margin-right: 2.5%;
    min-width: 360px;
}

.demon-large-item h2 {
}

.star-content {
    float: right;
}

.charge-final .finish-item:not(.category) {
    margin: unset;
}

.demon-large-item.credits i.fa.fa-plus {
    float: right;
    margin-right: 30px;
    cursor: pointer;
}

.add-credit {
    position: fixed;
    height: 350px;
    width: 560px;
    left: 50%;
    top: 50%;
    transform: translate(-50%,-50%);
    background-color: white;
    box-shadow: 0 0 7px #00000047;
    z-index: 3;
    border-radius: 3px;
    overflow: hidden;
}

.add-credit {}

.add-credit .select {
    display: flex;
    float: right;
    width: 237px;
    justify-content: flex-end;
    cursor: pointer;
}

.add-credit .select * {
    margin-left: 20px;
}

.add-credit center {
    margin-top: 30px;
}

.left-header {
    margin-left: 60px;
    margin-top: 19px;
}

.add-credit .content.cards .payment-item {
    position: relative;
    left: 50%;
    transform: translateX(-50%);
    margin-top: 5px;
    transition: 100ms ease-in;
}

.add-credit .payment-methods {
    height: 255px;
    overflow: scroll;
    box-shadow: inset 0px 3px 3px #00000017;
}

.add-credit .payment-item:first-of-type {
    margin-top: 20px !important;
}

.add-credit .payment-item:last-of-type {
    margin-bottom: 20px !important;
}

.add-credit .content.cards .payment-item:hover {
    background-color: #2a89ff;
    color: white;
    cursor: pointer;
}

iframe.three_d_secure {
    position: fixed;
    z-index: 4;
    border: unset;
    width: 530px;
    height: 610px;
    top: calc(50% + 25px);
    left: 50%;
    transform: translate(-50%,-50%);
    box-shadow: 0 0 4px #0000002e;
}

.edit-api-key {
    position: fixed;
    width: 500px;
    height: 300px;
    background-color: white;
    left: 50%;
    top: 50%;
    transform: translate(-50%,-50%);
    z-index: 3;
    border-radius: 4px;
    box-shadow: 0 0 9px #0000004d;
    overflow: hidden;
}

.edit-api-key .whitelist i.fa.fa-plus {
    top: 50%;
    float: right;
    float: right;
    margin-right: 30px;
	cursor:pointer;
}

.key-item .key-data {
    position: relative;
    width: 91%;
    padding-bottom: 7px;
    padding-top: 8px;
}

.key-item .key-data {
    display: flex;
    justify-content: space-between;
}

.key-list .key-item i.fa.fa-edit {
    cursor: pointer;
}

.key-item .actions {
    position: absolute;
    right: 13px;
    top: 10px;
}

.key-item .actions>* {
    margin-left: 10px;
}

.donor-list p {
    margin-left: 60px;
}

.edit-document {
    position: fixed;
    width: 900px;
    height: 600px;
    left: 50%;
    top: 50%;
    transform: translate(-50%,-50%);
    z-index: 3;
    background-color: white;
    box-shadow: 0 0 5px #0000003b;
    border-radius: 5px;
    overflow: hidden;
}

.content.assignment .finish-list.document-letters {
    width: 90%;
    margin-top: 20px;
}

.edit-document .content.fields i.fa.fa-plus {
    font-size: 16px;
    top: 50%;
    transform: translateY(-50%);
    position: absolute;
    right: 40px;
}

.edit-document .fields h2 {
    position: relative;
}

.edit-document .fields .finish-list {
    width: 90%;
}

.customer-settings .finish-list.settings {
    width: 500px;
    margin-top: 50px;
}

center>h6,center>h5, center>h4, center>h3, center>h2, center>h1 {
    margin-left: unset;
}

.transaction-preview .custom-data .fa {
    font-size: 10px;
    line-height: 16px;
    margin-left: 10px;
    margin-right: 10px;
    color: #3b3b3b;
}

.itemlist>h4 {
    text-align: center;
    position: absolute;
    width: 100%;
    margin: unset;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-100%);
    color: #b7b7b7;
}

.search-sidebar .primary-info input:not(:placeholder-shown) {
    background-color: #def0ff;
}

.card-names i.fa.fa-pencil-alt.editing {
    color: red;
}

.pii-container i.fa.fa-backspace {
    position: absolute;
    top: 50%;
    color: #3b3b3b;
    right: -40px;
    transform: translateY(-50%);
    cursor: pointer;
}

.customer-info.pii i.fa.fa-backspace {
    position: absolute;
    right: 15px;
    top: 18px;
    font-size: 12px;
    cursor: pointer;
}

.customer[noclick].selection-addition {
    cursor: copy;
}

.customer.highlight-selected .customer-header {
    background-color: #802ef0;
}

.customer.population-selected .customer-header {
    background-color: #2c71f0;
}

.population-list-export {
    position: fixed;
    width: calc(100% - 250px);
    left: 250px;
    height: 70px;
    padding-bottom: 3px;
    bottom: 0px;
    background-color: white;
    z-index: 1;
    box-shadow: 0 0 7px #989898;
    display: flex;
    justify-content: left;
    align-items: center;
}

.campaign-population-view .next {}

.population-list-export .next {
    position: relative;
    margin-right: 20px;
    left: unset;
    bottom: unset;
}

.population-list-export .next.cancel {
    background-color: #c93b3b;
    margin-left: auto;
    margin-right: 20px;
}

.subscription-editor .finish-list.letter-data {
    height: 270px;
    overflow: scroll;
    border-bottom: 1px solid #d5d5d5;
    margin-top:0px;
    padding-top:10px;
}

.order-fill .recipient-block h3 {
    border-bottom: 1px solid #e5e5e5;
    display: flex;
    align-items: flex-end;
}

.order-fill .recipient-block {
    margin-right: 30px;
}

.order-fill .recipient-block small {
    font-size: 12px;
    margin-left: 10px;
    margin-right: 20px;
}

.order-fill .letter-item {
    width: auto;
    height: 40px;
    display: flex;
    background-color: #ffffff;
    margin-left: 30px;
    box-shadow: 0 0 7px #00000042;
    border-radius: 5px;
    align-items: center;
    padding-left: 20px;
    padding-right: 20px;
    margin-bottom: 10px;
}

.order-fill .letter-item p {
    margin-left: 15px;
}

.order-fill .letter-item .actions {
    position: absolute;
    right: 20px;
}

.mod-transaction {
    width: 630px;
    height: 450px;
    background-color: white;
    position: fixed;
    left: 50%;
    top: 50%;
    transform: translate(-50%,-50%);
    box-shadow: 0 0 8px #00000059;
    border-radius: 6px;
    z-index: 3;
    overflow: hidden;
    transition: all 200ms ease-in;
}

.mod-transaction small {
    font-size: 10px;
    margin-right: 20px;
    margin-left: 20px;
    transform: translateY(-10%);
}

.mod-transaction .mod-column {
    display: inline-flex;
    flex-direction: column;
    position: relative;
    margin-left: 31px;
    text-align: right;
}

.view-transaction .main h2 {
    margin-bottom: 6px;
    display: flex;
    align-items: center;
}

.mod-transaction .warning p {color: white;}

.mod-transaction .sidebar {
    top: 0px;
    height: 100%;
    width: 225px;
    border-radius: 0;
}

.mod-transaction .sidebar h3 {
    margin-right: 30px;
    text-align: center;
}

.mod-transaction .content.main.shortened {
    left: 225px;
    width: calc(100% - 225px);
}

.mod-transaction h5 {
    margin-bottom: 14px;
}

.mod-transaction .itemlist {
    width: 70%;
    left: 50%;
    transform: translateX(-50%) scale(.9);
    margin-top: -20px;
    margin-bottom: 27px;
}

.mod-transaction h6 {
    margin-top: unset;
    margin-left: 33px;
}

.mod-transaction .finish-list {
    width: 80%;
    font-size: 14px;
    padding-bottom: 30px;
}

.transaction-preview .custom-data p {width: 85%;padding-left: 6px;left: 50%;transform: translateX(-50%);position: relative;color: black;text-align: left;}

.item.receipt.product-list {
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: flex-start;
    overflow: scroll;
    height: fit-content;
    height: -moz-fit-content;
    max-height: 100%;
    width: 300px;
    font-size: 10px;
    flex-shrink: 0;
}

.item.receipt.product-list p {
    padding-top: 1px;
    padding-bottom: 1px;
}

.mod-transaction .fa-pencil-alt, .mod-transaction .fa-plus {
    margin-left: 10px;
}

.mod-transaction .warning {
    width: 70%;
    height: 45px;
    font-size: 12px !important;
    margin-top: 15px;
    color: white !important;
    align-items: center;
    margin-bottom: 20px;
}

.mod-transaction .warning .fa {
    font-size: 12px;
}

.mod-transaction .fa-arrow-right {
    font-size: 8px;
    margin: 0px 10px;
}

.mod-transaction center p {
    display: flex;
    justify-content: center;
    align-items: center;
}

.new-transaction .manual {
    position: absolute;
    font-size: 10px;
    color: #3b3b3b;
    top: 20px;
    right: 30px;
    cursor: pointer;
}

.new-transaction .manual-subscription .finish-list {
    width: 90%;
    margin-top: 30px;
}

input[type="date"] {
    min-width: 150px;
}

.new-transaction .manual-subscription input {
    width: 200px;
}

.mod-transaction p.transaction-note {
    width: 70%;
    left: 15%;
    position: relative;
    margin-bottom: 40px;
    border-top: 1px solid #e4e4e4;
    padding-top: 8px;
    padding: 8px 10px;
}

.transaction-note {
    width: 70%;
    left: 50%;
    transform: translateX(-50%);
    position: relative;
    padding: 10px 30px;
    padding-left: 20px;
    box-shadow: 0 0 1px black;
    display: flex;
    margin-bottom: 10px;
    margin-top: 20px;
}

.mod-transaction .main .fa-sticky-note {
    margin-right: 20px;
    color: #3b3b3b;
    align-self: center;
}

.mod-transaction .transaction-note i.fa.fa-edit {
    position: absolute;
    right: 10px;
    font-size: 10px;
    cursor: pointer;
    top: 5px;
}

.mod-transaction .edit-option-list {
    display: flex;
    width: 86%;
    margin: auto;
    margin-top: 40px;
    flex-wrap: wrap;
    justify-content: center;
}

.mod-transaction .edit-option, .block-option {
    width: 150px;
    height: 70px;
    padding-bottom: 7px;
    color: #3b3b3b;
    box-shadow: 0 0 6px #0000002e;
    border-radius: 5px;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    margin: 15px;
    cursor: pointer;
}

.mod-transaction .edit-option p, .block-option p {
    text-align: center;
    font-size: 11px;
    margin-top: 15px;
}

.mod-transaction .edit-transaction-note .note-editing {
    width: 80%;
    left: 50%;
    min-height: 200px;
    transform: translateX(-50%);
    margin-top: 30px;
    position: relative;
    box-shadow: 0 0 3px #00000059;
    padding: 10px 10px;
}

.mod-transaction .edit-acknowledgement .finish-list,.mod-transaction .edit-campaigns .finish-list {
    margin-top: 40px;
}

.mod-transaction .edit-desc {
    width: 84%;
    margin: auto;
    margin-top: 50px;
}

.account-info-block i.fa.fa-exclamation-triangle {
    margin-left: 40px;
    font-size: 35px;
}

.sidebar-page {
    width: 100%;
    height: 100%;
    position: absolute;
    overflow-y: scroll;
}

.mod-transaction.right {
    left: calc(50% + (250px / 2));
}

.transaction-sidebar.history-sidebar {
    z-index: 4;
    height: 100%;
    top: 0px;
}

.customer .name-container {
    margin-left: 30px;
    display: flex;
    flex-direction: column;
    width: 45%;
}

.customer .item.company {
    font-size: 10px;
}

.paragraph-input {
    padding: 10px;
    border-radius: 3px;
    border: none;
    box-shadow: 0 0 2px #00000073;
    border-radius: 4px;
    text-align: left;
    font-size: 10px;
    overflow-y: scroll;
    background-color: white;
    min-width: 200px;
    height: fit-content;
	height: -moz-fit-content;
    max-width: 210px;
    color: #3b3b3b !important;
    min-height: 12px;
}

.campaign .content>p {
    margin-left: 30px;
}

.open-campaigns .finish-list {
    width: 90%;
}


.subscriptions .actions {
    position: absolute;
    margin-top: 6px;
    right: 16px;
}

.sidebar.orders .item:last-of-type {
    margin-bottom: 40px;
}

.log .name, .log .company {
    display: block;
}

.item {}

.log .item.company {
    font-size: 10px;
}

.log .name-container * {
}

.log .item.name {
    height: 18px;
}

body.scaled {
    transform: translateX(250px);
    box-shadow: 0 0 8px black;
    box-shadow: 0 0 8px #0000006e;
}

.dms-overlay-left {
    position: fixed;
    left: 0px;
    width: 250px;
    transform: translateX(-100%);
    background-color: #ffffff;
    height: 100%;
    z-index: 8;
    top: 0px;
    box-shadow: inset 0 0 10px #00000059;
}

.dms-overlay-top {
    position: fixed;
    width: 100%;
    background-color: white;
    height: 25%;
    top: -25%;
    z-index: 9;
    box-shadow: 4px 2px 5px #00000047;
}

.darken.scaled {
    z-index: 8;
}

.scaled .darken {
    z-index: 8;
}

.dms-overlay-left .item {
    width: 60%;
    padding-left: 30px;
    padding-right: 30px;
    position: relative;
    display: flex;
    justify-content: center;
    flex-direction: column;
    align-items: center;
    box-shadow: 0 0 6px #00000033;
    border-radius: 9px;
    margin: auto;
    margin-bottom: 15px;
    cursor: pointer;
    color: #3b3b3b;
}

.dms-overlay-left .item>* {
    padding-bottom: 13px;
    text-align: center;
}

.dms-overlay-left .item>*:first-child {
    padding-top: 13px;
}

.dms-overlay-left center {
    margin-bottom: 40px;
}

a {
    text-decoration: none;
}

.topic-sidebar {
    font-size: 15px;
}

.topbar .open {
    outline: 1px solid #ffffff75;
}

.help-main {
    position: absolute;
    overflow: scroll;
    left: 250px;
    width: calc(100% - 250px);
    height: calc(100% - 50px);
    top: 50px;
}

.content .article {
    width: 360px;
    height: 100px;
    background-color: white;
    box-shadow: 0 0 4px #00000075;
    margin: 10px;
    position: relative;
    cursor: pointer;
    border-radius: 6px;
    display: flex;
    flex-wrap: nowrap;
    justify-content: flex-start;
    align-items: center;
}

.help-main .content {
    justify-content: space-between;
    c(100% - 0px);
}

.help-main .help-articles {
    padding: 0px;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    flex-direction: row;
    align-items: center;
}

.help-articles .article p {margin-right: 20px;text-align: left;}

.help-articles .article p>i {
    margin-right: 12px;
    font-size: 17px;
    vertical-align: middle;
    transform: translateY(-2px);
}

.article>i {margin-left: 40px;margin-right: 40px;}

.help-articles .construction {
    position: absolute;
    font-size: 10px;
    top: 8px;
    right: 10px;
    color: #5d0606;
}

.help-main .content[articleid] p {
    padding: 0px 60px;
    margin-top: 39px;
}

.submission {
    width: 500px;
    height: 400px;
}

.modal {
    background-color: white;
    z-index: 8;
    box-shadow: 0 0 9px #0000002e;
    position: fixed;
    border-radius: 4px;
    left: 50%;
    top: 50%;
    transform: translate(-50%,-50%);
    overflow: hidden;
    overflow-y: scroll;
}

.submission input[type="text"] {
    width: 400px;
    margin-top: 20px;
}

.submission .paragraph-input {
    margin-top: 14px;
    width: 400px;
    max-width: unset;
    min-height: 100px;
    max-height: 140px;
}

.modal>p {
    margin-left: 40px;
    margin-top: 15px;
}

.plain .search-sidebar {
    height: 100%;
    top: 0px;
}

.plain .customer-list {
    height: 100%;
    top: 0px;
}

iframe.population {
    width: 100%;
    height: 100%;
    top: 0px;
    position: absolute;
    border: unset;
}

.plain .actions {
    display:none;
}

.customer.population-selected i.fa {color: white !important;}
.customer.highlight-selected i.fa {color: white;}

.customer[noclick].last {
    margin-bottom: 100px;
}

.inventory {
    width: 700px;
    height: 450px;
}

.inventory .main .finish-list {
    width: 90%;
}

h6 {
    margin-top: 7px;
    margin-bottom: 7px;
}

.inventory .main h2 {
    margin-bottom: 5px;
}

.inventory .product-description, .statistics .product-description {
    position: absolute;
    right: 15px;
    font-size: 10px;
    top: 10px;
    max-height: 16px;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: 240px;
    overflow:hidden;
    text-align: right;
}

.inventory .options {
    justify-content: center;
}

.inventory .content.all .sidebar {
    top: 0;
    height: 100%;
    width: 200px;
    z-index: 1;
}

h4 {
    margin-top: 15px;
    margin-bottom: 15px;
}

.inventory .all .sidebar .item {
    font-size: 12px;
}

.inventory .all .sidebar h4 {
    margin-top: 22px;
    margin-left: 27px;
}

.inventory .sku .finish-list {
    width: 75%;
}

.inventory .manage-sku .finish-list {
    margin-top: 40px;
    width: 70%;
}

.inventory .manage-sku .finish-item i {
    width: 29px;
    text-align: center;
    margin-right: 5px;
    margin-left: 5px;
}

.inventory .manage-sku .finish-item {
    cursor: pointer;
}

.inventory .manage-sku h2 {
    max-width: 82%;
    margin-top: 30px;
}

.manage-sku-inventory .finish-item {
    cursor: pointer;
    width: 80%;
    margin: auto;
}

.advanced-search .content li[index] {
    font-size: 14px;
}

.advanced-search .content .finish-item[index] p {
    max-width: 79%;
}

.sidebar .item p {
    margin-left: 0px;
    max-width: 88%;
}

.flip-card-body, .flip-card-face{
    height: 100%;
    top: 0px;
    position: absolute;
    width: 100%;
}

.flip-card-face.front {
}

.flip-card-body {
    transition: transform 0.8s;
    transform-style: preserve-3d;
}

.flipped .flip-card-body {
    transform: rotateX(180deg);
}

.flip-card-face{
    position: absolute;
    width: 100%;
    height: 100%;
    -webkit-backface-visibility: visible;
    -webkit-backface-visibility: hidden; /* Safari */
    backface-visibility: hidden;
    background-color: white;
    -webkit-transform-style: preserve-3d;
    box-shadow: 0 0 9px #0000002e;
    border-radius: 5px;
}

.flip-card-face.back{
    transform: rotateX(180deg);
}

.flip-card {
    perspective: 1000px;
}

.hover-flip-card:hover .flip-card-body{
    transform:rotateX(180deg)
}

.new-user .finish-list {
    width: 80%;
}

.user-list {}

.user-access-settings.modal center h2 {
    margin-bottom: 5px;
}

.user-access-settings.modal center p {
    font-size: 13px;
}

.add p {
    display: inline-block;
}

.new-document .finish-list .finish-item {
    cursor: pointer;
}

.notification .load-throbber {
    position: absolute;
    width: 20px;
    height: 20px;
    top: unset;
    transform: unset;
    right: 20px;
    left: unset;
}

.notification.task {
    background: unset;
    background-color: white;
    color: inherit !important;
    padding-right: 60px;
    min-width: calc(100% - 30px);
}

.notification.task i.fa.fa-check {
    position: absolute;
    right: 23px;
    margin: unset;
    color: #44aa44;
}

.notification.task i.fa.fa-times {
    position: absolute;
    right: 23px;
    margin: unset;
    color: #7c0000;
}


.notifications {
    perspective: 984px;
}

.notification {
    cursor: pointer;
}

.advanced-search .add {
    position: absolute;
    right: 40px;
    width: fit-content;
    width: -moz-fit-content;
    left: unset;
    transform: translateY(6px);
}

.advanced-search hr {
}

.advanced-search .main center {
    padding-bottom: 10px;
    padding-top: 20px;
}

.advanced-search .main center h2 {
    margin-top: unset;
}

.advanced-search .main .finish-list {
    margin-top: unset;
    height: 71%;
    overflow: scroll;
}

.advanced-search .operator {
}

.advanced-search .finish-item .value {
    cursor: default;
}

.advanced-search .main .finish-item[or] {
    padding-left: 30px;
}

.advanced-search .main .finish-item {user-select: none; -webkit-user-select: none;}

.advanced-search .white-back .option-button, .advanced-search .white-back i.interact-button {
    position: absolute;
    right: 30px;
    width: -moz-fit-content;
    margin-top: unset;
    top: 50%;
    transform: translateY(-50%);
    right: 100px;
    left: unset;
    cursor: pointer;
    font-size: 21px;
}

.advanced-search [handler] li i.fa.fa-plus {
    padding: 0px 5px;
    cursor: pointer;
}

.advanced-search .white-back .interact-button {
    right: unset;
    left: 100px;
}

.advanced-search .content[handler] .value {
    padding-left: 30px;
}

.advanced-search .content[handler] .finish-list {
    padding-bottom: 40px;
}

[relate='product-management'] .sidebar {
    top: 0px;
    z-index: 2;
    height: 100%;
}

.sidebar-page {
    width: calc(100% - 250px) !important;
    left: 250px;
    height: 100%;
    position: absolute;
    transition: all 300ms;
    z-index: 1;
    overflow-x: hidden;
}

.sidebar-retractable.sidebar-retracted {
    transform: translateX(-80%);
}

.sidebar-page.sidebar-retracted-page {
    left: calc(250px * .2);
    width: calc(100% - (250px * .2)) !important;
}

.sidebar.sidebar-retractable.sidebar-retracted i.fa.fa-mouse {
    position: absolute;
    right: calc(50px / 2 - 7px);
    top: 15px;
}

.sidebar:not(.sidebar-retracted) i.fa.fa-mouse {
    display:none;
}

.sidebar.sidebar-retracted i[lock] {
    display:none;
}

.sidebar.sidebar-retracted i[lock] {
    display:none;
}

.modal.modal-presentation {
    width: 100%;
    height: 100%;
    background-color: #0000005e;
    border-radius: 0;
    box-shadow: unset;
    outline: 10px solid #0000005e;
    z-index: 1300;
    overflow: hidden;
}

.confirm.modal p {
    margin-top: 40px;
}

.popover {
    position: absolute;
    background-color: white;
    z-index: 5;
    box-shadow: 0 0 7px #00000059;
    padding: 15px 15px;
    border-radius: 5px;
    width: fit-content !important;
    width: -moz-fit-content !important;
}

.popover:after {
    content: "";
    position: absolute;
    width: 10px;
    height: 20px;
    top: 50%;
    left: 0px;
    background-color: white;
    transform: translateY(-50%);
}
.popover:before {
    content: unset;
    position: absolute;
    width: 12px;
    height: 12px;
    top: 50%;
    left: -6px;
    background-color: white;
    transform: translateY(-50%) rotate(45deg);
    box-shadow: 0 0 3px #00000052;
}

ul {
    list-style: none;
    padding-left: unset;
    margin-top: unset;
    margin-bottom: unset;
}

.popover ul li {
    padding: 7px 11px;
}

.popover ul li:last-of-type {
    border-bottom: unset;
}

.popover ul {
    margin-bottom: 0px;
    margin-top: 0px;
}

.popover ul li {
    cursor: pointer;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.popover.top-center-arrow:after {
    left: 50%;
    transform: translate(-50%, 0%);
    top: 0;
    width: 20px;
    height: 13px;
}

.popover.top-center-arrow:before {
    top: 2px;
    right: 50%;
    transform: translateY(-50%) translateX(50%) rotate(45deg);
    left: unset;
    border-radius: 3px;
}

.popover.bottom-center-arrow:after {
    left: 50%;
    transform: translate(-50%, 0%);
    bottom: 0px;
    width: 20px;
    height: 10px;
    top: unset;
}

.popover.bottom-center-arrow:before {
    top: 100%;
    right: 50%;
    transform: translateY(-50%) translateX(50%) rotate(45deg);
    left: unset;
}

.popover.right-center-arrow:after {
    right: 0px;
    left: unset;
}

.popover.right-center-arrow:before {
    left: unset;
    right: 0px;
    transform: translate(50%, -50%) rotate(45deg);
}

.series-menu {
    padding: 46px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
}

.dashboard .tile h2 i.fa {
    margin-right: 14px;
    width: 26px;
}

.dashboard .tile {
    padding-top: 10px;
    padding-bottom: 61px;
    box-shadow: 0 0 6px #00000052;
    border-radius: 5px;
    width: 250px;
    position: relative;
    margin: 20px;
}

.dashboard .tile center>i {
    position: absolute;
    right: 18px;
    top: 12px;
}

.button i {
    margin-left: 8px;
    vertical-align: middle;
}

.subscription-editor .settings .finish-item p {
    min-width: 151px;
    display: flex;
    justify-content: space-between;
}

.series-popup {
    width: 250px;
    height: 100px;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    color: #3b3b3b !important;
}

.series-popup>div {
    height: 100%;
    position: relative;
}

.series-popup .next {
    bottom: 0;
    transform: translateX(-50%) scale(.8);
    transform-origin: center;
}

.series-popup img {
    width: 100px;
    height: 100%;
    object-fit: contain;
}

.series-popup p {
    margin-top: 7px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    width: 112px;
}

.sidebar-full-height{
    top:0px;
    height: 100%;
}

.statistics.modal {
    width: 90%;
    height: 90%;
}

.statistics .product-description {
    width: 400px;
}

.sidebar.sidebar-retractable i[lock]{
    position: absolute;
    right: calc(50px / 2 - 7px);
    top: 15px;
    cursor:pointer;
    color: #5c5c5c;
}

.tile {
    box-shadow: 0 0 4px #00000061;
    border-radius: 6px;
    margin: 20px;
    padding: 20px 20px 80px 20px;
    position: relative;
}

.tile.no-next {
    padding-bottom: 30px;
}

.statistics .report-tiles {
    margin-top: 38px;
}

.advanced-search .finish-list.fields{
    margin-top:200px !important;
}

i.fa.fa-angle-left {
    left: 10px;
    position: fixed;
    top: 22px;
    cursor: pointer;
    z-index: 1;
}


.advanced-search.modal.large {
    width: 95%;
    height: 95%;
}

.advanced-search .main.content .finish-item {
    background-color: white;
}

.advanced-search .main.content .finish-item:first-of-type {
    margin-top:5px;
}

.advanced-search .main.content .finish-item:last-of-type {
    margin-bottom:5px;
}

.create-transaction {
    width: 1000px;
    height: 650px;
}

input#amount, input#extra, select#payment_type {
    margin-right: 22px;
}

input#amount, input#extra {
    width: 90px;
    margin-right: 9px;
}

.create-transaction .main .finish-list {
    margin-top: 25px;
}

.create-transaction .main .advanced {
    position: absolute;
    right: 35px;
    top: 20px;
    font-size: 19px;
    cursor: pointer;
}

.create-transaction input#date, .create-transaction input#time {}

input#create_time, input#create_date {
    margin-left: 15px;
}

.create-transaction .finish-list#types {
    width: 80%;
    margin-top: 50px;
    cursor: pointer;
}

.create-transaction .transaction-preview {
    width: 450px;
    margin-top: 50px;
}

.create-transaction .create-options-list.finish-list {
    width: 80%;
    margin-top: 25px;
}

.create-transaction div#sale-items {
    width: 75%;
    margin: auto;
    margin-top: 55px;
}

.create-transaction .assign-gift {
    padding: 5px 20px;
    margin-left: 20px;
}

.merge-block {
    padding: 5px 10px;
    width: fit-content;
    width: -moz-fit-content;
    box-shadow: 0 0 5px #0000004a;
    margin-bottom: 8px;
    border-radius: 5px;
    padding-top: 5px;
    margin-top: 11px;
    margin-left: 15px;
    height: fit-content;
    display: flex;
    align-items: center;
}

.view-code-structure {
    width: 80%;
    height: 520px;
    padding: 20px;
}



.merge-block>span.merge-display {
    margin-right: 20px;
    font-weight: lighter;
    color: #5959ff;
    padding-top: 5px;
    padding-bottom: 5px;
}

.merge-block.conditional-data,.merge-block.body {
    flex-direction: column;
    align-items: flex-start;
}

.finish-list[disabled] * {
    color: #a6a6a6;
    cursor: default !important;
}


.secondary-list {
    height: calc(83% - 70px);
    overflow: scroll;
    box-shadow: inset 0 0 6px #0000003d;
}

.create-series-item input.ord {
    margin-right: 20px;
}

center>h2 i.fa.fa-plus {
    position: absolute;
    right: 50px;
    font-size: 15px;
    top: 50%;
    transform: translateY(-50%);
    cursor: pointer;
}

center {position: static;}

.custom-field-editor .dropdown-page .finish-item {
    background-color: white;
    cursor: grab;
}

.custom-field-editor .dropdown-page>center {
    position: relative;
}


.custom-field-editor .preview h2 {margin-bottom: 0px;}

.content.secondary center {
    position: relative;
}

.change-margin {
    width: 600px;
    height: 400px;
}

.change-margin input.margin-input {
    width: 62px;
    text-align: center;
}

.margin-page {
    width: 100px;
    height: 132px;
    margin: 16px 37px;
    box-shadow: 0 0 9px #00000052;
}

.mailings .next.create-mailing {
    right: 20px;
    bottom: 0;
    top: 0;
    margin: auto;
    left:unset;
    transform:unset;
}

.csv-export.modal {
    width: 600px;
    height: 400px;
}

.items.campaign-wide-items {}

.item.line-item {}

.new-mailing div#sub-population {
    margin-top: 50px;
}

.new-mailing iframe {
    top: 0;
    position: absolute;
    width: 100%;
    height: 100%;
    border: unset;
}

.new-mailing.modal.expand {
    width: 93%;
    height: 90%;
}

.key-item i.fa.fa-fingerprint {
    position: absolute;
    top: 12px;
    left: 12px;
}

.modal.view-credential {
    width: 1000px;
    height: 700px;
}

.dot.true {
    background-color: green !important;
}

article {
    margin-bottom: 90px;
}

code.replaceable {
    color: #1f8000;
}

.transaction:first-of-type {
    margin-top: 40px;
}

.customer-card .main .add:not(button) {
    left: unset;
}

.customer-card .campaigns, .customer-card .transactions {
    margin-bottom: 0px;
    padding-bottom: 10px;
    padding-top: unset;
}


.demon-large-item.history, .demon-large-item.credit-changes {
    min-height: 62px;
    cursor: pointer;
}

.demon-large-item.history i.fa.fa-arrow-right, .demon-large-item.credit-changes i.fa-arrow-right {
    position: absolute;
    font-size: 23px;
    right: 60px;
    top: 50%;
    transform: translateY(-50%);
}


.invoice.invoice-year {
    width: 500px;
    padding: 20px;
    border-radius: 5px;
    box-shadow: 0 0 4px #0000004f;
    display: flex;
    flex-direction: column;
    margin-bottom: 30px;
}

.invoices:not(.content) {
    display: flex;
    align-items: center;
    flex-direction: column;
    margin-top: 50px;
}

.invoice .finish-item {
    cursor: pointer;
}

.finish-item.selectable:hover, li[selectable]:hover {
    background-color: #f3f3f3;
    cursor: pointer;
}

.invoice.invoice-year.minified {
    height: 50px;
    overflow: hidden;
    padding-bottom: 30px;
}

.invoice h2 {
    cursor: pointer;
}

.invoice.minified .finish-list {
    margin-top: 40px;
}

.invoice.content .demon-large-item {
    margin-top: 65px !important;
}

.credit-changes .finish-list {
    margin-top: 50px;
    width: 80%;
}

.credit-changes .finish-item.ui-list-item:last-of-type {
    margin-bottom: 50px;
}

.series-options-page .finish-list {
    width: 80%;
    min-width: 200px;
    max-width: 600px;
    margin-top: 50px;
}

.series-options.modal {
    width: 600px;
    height: 400px;
}

.add-to-campaign.modal {
    width: 700px;
    height: 500px;
}

body.left-bias {
    width: calc(100% - 320px);
}

.left-bias .topbar {
    width: calc(100% + 320px);
}

.remote-entry-data {
    position: absolute;
    width: 275px;
    left: unset;
    right: -270px;
    height: 400px;
    transform: translate(0,-50%);
}

.left-bias-data {
    width: 320px;
    right: -320px;
    height: calc(100% - 50px);
    top: 50px;
    position: fixed;
    z-index: 1;
    overflow: hidden;
    border-left: 1px solid #00000036;
}

.left-bias-data .order-data {
    width: 300px;
    height: 468px;
    position: relative;
    transform: translate(-50%,0%);
    top: 3%;
}

i.fa.fa-times {}

i.fa.fa-times.close {
    position: absolute;
    margin-top: 14px;
    margin-left: 12px;
    font-size: 19px;
    right: 0px;
    cursor: pointer;
}

.left-bias-data .transaction-preview {
    left: unset;
    width: 450px;
    transform: scale(.6666);
    right: 10px;
    transform-origin: top right;
    margin-top: 44px;
    transition: all 200ms;
    border-radius: 10px;
    z-index: 2;
    position: absolute;
    box-shadow: 0 0 9px #0000002e;
}

.controls {
    position: absolute;
    bottom: 30px;
    width: calc(100% - 80px);
    height: 48px;
    background-color: #f6f6f6;
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
    padding: 0px 20px;
    margin-left: 20px;
}

.left-bias-data .controls i {
    cursor: pointer;
}

.content.overflow {
    overflow: visible;
}

.left-bias .modal.modal-presentation {
    width: calc(100% + 320px);
    transform: translate(0,-50%);
    left: unset;
}

.left-bias-data center.empty {
    position: relative;
    top: 36%;
}


.finish-list.tab .finish-item {padding-left: 50px;}

.finish-list.collapse {
    height: 0;
}

.embedded.finish-list {
    margin-top: unset;
    margin-left: 10px;
}

.data-item {
    margin-top: 20px;
    width: 90%;
    margin: auto;
    margin-top: 20px;
    margin-bottom: 20px;
    height: 125px;
    box-shadow: 0 0 6px #00000030;
    border-radius: 5px;
    position: relative;
    overflow: hidden;
    display: flex;
    justify-content: space-between;
    align-items: center;
    cursor: grab;
}

.customer-card .personal-info .add {
    position: relative;
}

.data-item .data-label {
    font-weight: lighter;
    margin-left: 7px;
    margin-top: 5px;
    font-size: 12px;
}

.address .address-line {
    position: relative;
    margin-left: 15px;
    font-weight: lighter;
    max-width: 65%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.data-item .modify {
    margin-right: 12px;
    font-size: 11px;
    white-space: nowrap;
    transform: translateY(-5%);
}

.data-item .modify>* {
    margin-left: 6px;
    cursor: pointer;
    padding: 0 5px;
}

.pii-container .notes {
    width: 500px;
    min-height: 250px;
    margin-bottom: 20px;
    margin: auto;
    margin-top: 20px;
    overflow: hidden;
    box-shadow: 0 0 8px #00000029;
    border-radius: 5px;
    padding: unset;
}

.customer-info {
    position: relative;
    width: 400px;
    padding-bottom: 29px;
    margin-left: 20px;
    margin-right: 20px;
    z-index: 1;
    height: fit-content;
    margin-top: 20px;
    height: -moz-fit-content;
    padding: 0px 20px 0px;
}

.personal-data {
    width: 500px;
    padding-bottom: 33px;
    margin-left: auto;
    margin-right: auto;
    box-shadow: 0 0 8px #00000029;
    border-radius: 5px;
    overflow: hidden;
}

.personal-data input {
    width: 150px;
    text-align: left;
}

.account-data-container {
    margin-left: auto;
    margin-right: auto;
}

.personal-info {
    margin-top: 60px;
    display: flex;
    justify-content: center;
    align-items: center;
    margin-bottom: 60px;
    flex-wrap: wrap;
    padding: 0px 0px;
}

.personal-info .telephones, .personal-info .emails, .personal-info .addresses, .personal-info .tags, .personal-info .attributes {
    width: 440px;
    height: 275px;
    padding: 0px 0px;
    overflow-y: scroll;
    overflow-x: hidden;
    position: relative;
    align-self: baseline;
    margin: 10px;
    box-shadow: 0 0 8px #00000029;
    border-radius: 5px;
}

.data-item.phone, .data-item.email {
    height: 50px;
}

.phone-line, .email-line {padding-left: 13px;max-width: 64%;overflow: hidden;text-overflow: ellipsis;}

.modify {
    font-size: 12px;
}

.modify>* {
    margin-left: 10px;
    cursor: pointer;
}

.personal-info .finish-list p {
    max-width: 87%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.edit-email, .edit-phone, .edit-address, .add-tag, .edit-note, .edit-attribute {
    width: 600px;
    height: 400px;
}

.edit-email .finish-list {
}

.personal-info .finish-list small {
    font-size: 12px;
    text-align: center;
}

.personal-info .flex-v.special>i, .object-container .flex-v.special>i {
    font-size: 10px;
    color: black;
}

.edit-address.modal {
    height: 560px;
    width: 740px;
}

.lookup-result {
    display: inline-block;
    margin-right: 20px;
    font-size: 11px;
    max-width: 190px;
    overflow: hidden;
    text-align: right;
    text-overflow: ellipsis;
}

.lookup-result-container{
	align-items: center;
  display: flex;
}

.partial-address {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 160px;
    position: absolute;
    transform: scale(.75);
    transform-origin: center right;
    right: 55px;
    top: 21px;
}

.personal-info .finish-list {
    padding-bottom: 20px;
    margin-top: unset;
}

[handler] li .value * {
    margin-left: 20px;
}

.label-item {
    text-align: center;
    margin-top: 30px;
    font-weight: 100;
    font-size: 17px;
    margin-bottom: 7px;
    border-bottom: 1px solid #eaeaea;
    padding-bottom: 5px;
}

.customer-list center h2 {
    margin-bottom: 6px;
}

div {}

.warnings {
    font-size: 12px;
    position: relative;
    width: fit-content;
    width: -moz-fit-content;
    border: 1px solid gray;
    padding: 5px;
    cursor: pointer;
    transition: all 100ms;
    border-radius: 5px;
    margin-top: 20px;
}

.warnings .fa {
    margin-left: 12px;
    margin-right: 12px;
    font-size: 10px;
}

.warnings:hover {
    background-color: #ab0006;
    color: white;
    border: 1px solid transparent;
}

.modal.warnings-ui {
    width: 700px;
    padding-bottom: 25px;
    min-height: 300px;
}

.customer.ui-list-item .finish-list {
    width: 100%;
    margin-top: unset;
}

.customer.ui-list-item .customer-header, .campaign.ui-list-item .campaign-header, .large-object .object-header {
    width: 100%;
    position: relative;
    height: 40px;
    display: flex;
    left: 0;
    align-items: center;
    padding-top: 4px;
    padding-bottom: 4px;
    z-index: 2;
    border-bottom: 1px solid lightgrey;
    flex-shrink: 0;
    cursor: pointer;
}

.customer.ui-list-item .customer-name {
    margin-left: 15px;
    white-space: nowrap;
    text-overflow: ellipsis;
    max-width: 82%;
    overflow: hidden;
}

.large-object.ui-list-item .finish-list .finish-item {
    padding-left: 10px;
    padding-right: 10px;
}

.customer-body-section, .object-body-section {
    position: relative;
    left: 0;
    padding: 0px 0px;
    height: calc(100% - 49px);
    width: 100%;
    margin: auto;
    max-height: 185px;
    overflow-y: scroll;
    overflow-x: hidden;
    padding-bottom: unset;
}

.customer:not(.empty):hover {
    background-color: #1a62bf03;
}

.customer.new.ui-list-item {
    /*height: 15px;*/
}


.customer.population-selected .customer-header {
    color: white;
    border-bottom: 1px solid #ffffffb3;
}
.customer.highlight-selected .customer-header {
    color: white;
    border-bottom: 1px solid #ffffffb3;
}

.customer.population-selected {
    background-color: white;
    box-shadow: 0 0 0px 2px #2c71f0;
}

.customer.highlight-selected {
    background-color: white;
    /*box-shadow: 0 0 0px 2px #802ef0;*/
}

.modal.bulk-customer-actions {
    width: 700px;
    height: 500px;
}


.pii-row-item {
    margin: 10px;
    margin-top: 20px;
}

.edit-address .finish-item i.fa.fa-arrow-right {
    margin-left: 20px;
}

.iso-lookup-tab.modal {
    width: 700px;
    height: 530px;
}

.system-page {
    width: 100%;
    height: calc(100% - 50px);
    margin-top: 50px;
    position: absolute;
}

.campaign-list {
    display: flex;
    margin: auto;
    margin-top: 20px;
    max-width: 900px;
    justify-content: center;
}

.campaign.ui-list-item {
}

.campaign-code {
    margin-top: 0;
    font-weight: lighter;
    font-size: 11px;
}

.campaign-name {}

.system-page .sidebar {
    top: 0;
    height: 100%;
}


.transaction-item {
    width: 500px;
    box-shadow: 0 0 4px #0000003d;
    border-radius: 6px;
    margin: auto;
    position: relative;
    margin-bottom: 20px;
    cursor: pointer;
    overflow: hidden;
    z-index: 2;
}

.transaction-item:first-of-type {
    margin-top: 20px;
}

.transaction-item .object-header {
    height: 45px;
    border-bottom: 1px solid #0000002b;
    display: flex;
    padding: 0px 20px;
    align-items: center;
    justify-content: left;
    font-size: 12px;
    background-color: white;
}

.transaction-item .dates {
    text-align: right;
}

.object-body {
    height: fit-content;
    position: relative;
    width: 100%;
    overflow-y: scroll;
    background-color: #fbfbfb;
}

.dates.flex-right {
    margin-left: auto !important;
}

.object-header>*:not(:first-of-type) {
    margin-left: 25px;
}

.transaction-item .object-header .fa {
    font-size: 10px;
    margin-left: 4px;
}

.icon-tags {
    position: absolute;
    bottom: 8px;
    right: 10px;
    display: flex;
    color: #000000cf;
    font-size: 12px;
    align-items: center;
    flex-direction: row-reverse;
}

.icon-tags>i {
    margin-left: 8px !important;
}

.transaction-item.small {
    height: 45px;
}

.transaction-item.small .object-header {
    border-bottom: unset;
}

.object-header .icon-tags {
    position: relative;
    bottom: unset;
    right: unset;
    margin-left: 10px;
}

.transaction-item:hover {box-shadow: 0 0 0px 1px #2c71f0;}

.object-header .type {
    min-width: 70px;
    max-width: 70px;
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
}


.object-body div.itemlist {height: 200px;width: 100%;padding: unset;border-radius: unset;box-shadow: unset;border: unset;border-top: 1px solid #ececec8f;}


.object-body i.icon.fa.fa-shopping-cart {
    font-size: 8px;
    top: 7px;
    left: 7px;
}

.transaction-item .object-header i.has-action {
    color: #4d82ef;
    transition: all 200ms;
}

.transaction-item .object-header i.has-action:hover {
    transform-origin: center center;
}

.parallel-customer-container{
	width: 95%;
	margin: auto;
	display: flex;
	flex-wrap: wrap;
	justify-content: space-evenly;
	margin-bottom: 100px;
}

.transaction-item.medium {
}

center {}

.transaction-item .sub-range {
    text-align: center;
    font-size: 15px;
    display: flex;
    align-items: center;
}

.transaction-item .sub-range i {
    margin: 0px 10px;
    font-size: 7px;
}

.remote-order-screen {
    width: 700px;
    height: 500px;
}

.topbar.remote-entry-topbar.main-topbar {
}

.topbar .next.white.exit {
    margin-left: auto;
}

.encapsulation-topbar .next, .topbar .next, .next.right {
    top: unset;
    left: unset;
    margin-right: 20px;
    margin-left: auto;
    transform: unset;
    position: relative;
    bottom: unset;
    transform: translate(8px, 0px) scale(0.8);
}

.topbar div.first {
    margin-left: 30px;
}

.topbar>* {
    position: relative;
}

.next:not(.error):hover {
    box-shadow: 0 0 5px #00000059;
}

.topbar .item {
    margin-left: 5px;
    margin-right: 5px;
}

.item.search {
}

.view-transaction {
	width: 1200px;
	height: 750px;
}

.view-transaction .transaction-item {
    margin: auto;
    margin-top: 80px;
}

.view-transaction .main>.finish-list {
    width: 90%;
    bottom: 20px;
    position: absolute;
}

.view-transaction .content .finish-item>i {
    margin-right: 20px;
}

.view-transaction .content>.finish-list {
    width: 90%;
}

.red {
}

.create-transaction .transaction-item {
    margin-top: 0px !important;
    flex-grow: 0;
    margin-bottom: 0px;
}

.create-transaction .vertical-middle {
    height: 80%;
    position: absolute;
    width: 100%;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.transaction-item .finish-item:last-of-type {
    margin-bottom: 5px;
}

.transaction-item.limited .object-body {
    max-height: calc(244px - 45px);
}

.edit-transaction .finish-item p i {
    margin-right: 20px;
}

.view-transaction i.fa.fa-question-circle {
    margin-right: 13px;
}

.active-indicator {
    width: 4px;
    height: 4px;
    border-radius: 100%;
    position: absolute;
    top: calc(45px / 2);
    left: 9px;
    transform: translate(0,-50%);
    z-index: 2;
}

.green {
}

.active-indicator.active {
    background-color: green;
}

.active-indicator.inactive {
    background-color: red;
}

.live-object.order-item {
    height: fit-content;
    width: auto;
    padding: 35px 20px 10px 20px;
    display: flex;
    justify-content: left;
    border-bottom: 1px solid #00000029;
    position: relative;
    transition: all 200ms;
}

.live-object .monitors {
    height: 100%;
    width: fit-content;
    display: flex;
    flex-direction: column;
    align-items: center;
}

.live-object .monitors>* {
    margin-top: 2px;
    margin-bottom: 2px;
    font-size: 9px;
}

.live-object .monitors>.inactive {
    color: #00000021;
}

.live-object .body {
    width: -webkit-fill-available;
    padding-left: 16px;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.live-object .order-item .type {
    font-weight: 100;
}

.live-object.order-item {
    font-weight: lighter;
    cursor: pointer;
}

.order-item .type {
    font-size: 16px;
    position: absolute;
    top: 10px;
    left: 20px;
}

.order-item .time {
    position: absolute;
    top: 7px;
    right: 12px;
    font-size: 10px;
}

.live-object.order-item:hover {background-color: #fafafa;}

.order-item .person {
    font-size: 12px;
}

.yellow {
    color: #f37916;
}

.queue-item .transaction-item.minimize {
    position: absolute;
    margin: unset;
    top: 20px;
    right: 20px;
    transition: all 200ms;
    transform: scale(.4);
    transform-origin: top right;
}

.queue-item .transaction-item.minimize:hover {
    transform: scale(1);
}

.queue-item .finish-list.order-options {
    width: 580px;
    bottom: 160px;
    position: absolute;
}

.queue-column {
    width: 500px;
}

.note {
    max-width: 270px;
}

.queue-item>.itemlist {
    width: 500px;
    margin: auto;
    margin-top: 170px;
}

.queue-item .transaction-item:not(.minimize) {
    margin-top: 110px;
}

.product .product-info, .flow .flow-info {
    width: -webkit-fill-available;
    margin-right: auto;
    height: 100%;
    margin-top: 20px;
}

.product .product-info h2 {
		margin-top: 0;
		margin-left: 0;
		text-align: center;
		overflow: hidden;
		white-space: nowrap;
		max-width: 100%;
		text-overflow: ellipsis;
		margin: auto !important;
		margin-bottom: 10px;
}

.product-image {
    width: 200px;
}

.product .product-info i.fa.fa-arrow-right {
}

.product:hover {}

.topbar>i.fa.fa-arrow-left.back {
    z-index: 2;
    font-size: 17px;
    position: relative;
    margin-left: unset;
    top: 0;
    left: 0;
    margin-left: 35px;
    margin-right: -14px;
}

.topbar i.fa.fa-arrow-left.back {
    position: relative;
    top: 0;
    left: 0;
    margin-left: 35px;
    margin-right: 0px;
}

.product-image, .system-image {
    width: 200px;
    height: 200px;
    justify-content: center;
    display: flex;
    margin-right: 40px;
    position: relative;
}

.product-card .product-options .finish-list {
}

.variant .flex, .flex {
    display: flex;
    flex-direction: row;
}

.product-card .flex.product-head {
    padding: 40px;
    justify-content: space-around;
    border-bottom: 1px solid #00000012;
    height: 220px;
}

.product-card .product-options, .product-card .product-tags {
    width: -webkit-fill-available;
    width: 382px;
    position: relative;
}

.product-card .title {
    margin-bottom: -20px;
    margin-left: 40px;
    font-size: 24px;
    color: #4e4e4e;
}

.product-options h3, .product-tags h3 {
    margin-top: 15px;
    margin-bottom: 25px;
}

.product-card .variants-list {
    margin: auto;
    width: 700px;
    margin-top: 40px;
    position: relative;
}

.variant {
    width: 370px;
    height: 350px;
    box-shadow: 0 0 4px #0000003d;
    border-radius: 4px;
    margin: 20px;
    position: relative;
    display: flex;
    flex-direction: column;
    padding-top: 40px;
}

.variant .product-image {
    height: 130px;
    width: 130px;
    justify-content: center;
    display: flex;
    margin-right: 0;
}

.variant .data-body {
    font-family: monospace;
}

.variant .table {
    margin-left: 1px;
    font-size: 10px;
    font-family: monospace;
    width: 160px;
    margin-right: 10px;
}

.variant input {
    width: 95px;
    border-radius: 0;
}

.variant .modify {
    margin-left: auto;
    margin-right: 40px;
    font-size: 20px;
}

.variant .variant-option-data {
    margin-left: 0px;
    font-size: 13px;
    width: fit-content;
    min-width: 100px;
    text-transform: capitalize;
    margin-top: 20px;
    position: absolute;
    top: 0px;
}

.variant .table.sku {
    margin-left: auto;
    margin-right: 20px;
    width: 180px;
}


.product-image.editable:hover img {
    filter: brightness(0.5);
}

.product-image .modify {
    display: none;
    position: absolute;
    z-index: 12;
}

.product-image:hover modify {
    display: block;
}

.product-image.editable:hover .modify {
    display: flex;
    flex-direction: column;
    top: 50%;
    transform: translate(0,-50%);
    font-size: 30px;
    color: white;
}

.product-image .fa {
    padding: 20px;
}

.variant-count .fa-plus {
    font-size: 18px;
    float: right;
    margin-right: 38px;
    cursor: pointer;
}

.variants-list .add {
    position: absolute;
    right: 40px;
    left: unset;
    margin-top: 4px !important;
}

.variant:last-of-type {
}

.edit-variant {
    width: 900px;
    height: 570px;
}

.edit-variant .finish-list.variant-options {
}

.edit-variant .variant-head {
    display: flex;
}

.edit-variant .variant-head {
    margin-top: 35px;
    margin-left: 40px;
    margin-right: 40px;
    justify-content: center;
    align-items: start;
    padding-bottom: 40px;
    border-bottom: 1px solid #0000000d;
}

.edit-variant .other.finish-list {
    margin-top: 30px;
    width: 80%;
}

.topbar.white .item.open {
    outline: 1px solid #00000029;
}

.tab-list {
    height: 50px;
    box-shadow: 0px 2px 4px #0000001a;
    display: flex;
    align-items: center;
}

.tab-list .item {
    width: fit-content;
    padding: 16px 50px;
    overflow: hidden;
    border-right: 1px solid #0000000f;
}

.tab-list .item:hover {
    background-color: #00000005;
    cursor: pointer;
}

.tab-list .item:last-of-type {
    border-right: unset;
}

.tab-page {
    position: relative;
    overflow: hidden;
    width: 100%;
}

.variant .data-body {
    height: 80px;
    display: flex;
    align-items: center;
    text-transform: uppercase;
    flex-wrap: wrap;
}

.variant-option-data {}

.variant .data-body .data {
    margin-right: 40px;
    height: 16px;
}

.variant-sub-data {
    height: 32px;
    margin-top: 20px;
    align-items: start;
    justify-content: center;
    display: flex;
    flex-wrap: wrap;
    flex-direction: column;
}

.variant .data-body .data:first-of-type {
}

.d-label {display: inline-block;width: 40px;}

.edit-variant .product-image {
    width: 280px;
    height: 200px;
    display: flex;
}

.notice {
    text-align: center;
    margin-top: 50px;
    font-weight: lighter;
}

.product-selector, .document-selector {
    width: 710px;
    height: 560px;
}

.product-boxed .product-image {
    width: 200px;
    height: 200px;
    margin-right: unset;
}

.product-boxed {
    width: 250px;
    height: 280px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    padding: 15px;
    position: relative;
    overflow: hidden;
    cursor: pointer;
}

.product-boxed p {
    width: 100%;
    height: 16px;
    overflow: hidden;
    margin-left: unset;
    white-space: nowrap;
    margin-top: 30px;
    text-align: center;
    text-overflow: ellipsis;
}

center {}

.product-boxed:hover .product-image {filter: brightness(0.5);}

.product-selector .products {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    margin: auto;
    margin-top: 40px;
    margin-bottom: 40px;
}

.product-small {
    width: 200px;
    height: 218px;
}

.product-small .product-image {
    width: 180px;
    height: 125px;
    margin-top: 0px;
}

.product-small .product-info h2 {font-size: 11px;}

.product-small .modify {
    margin-right: 10px;
    font-size: 13px;
    flex-shrink: 0;
}

.detail .product-image {
    height: 250px;
    width: 250px;
}

.detail .detail-head {
    margin: 40px;
    display: flex;
    align-items: center;
}

.detail-head .finish-list {
    width: 55%;
    left: unset;
    position: relative;
    transform: unset;
    margin: auto;
}

.next.error {
    background-color: #e83c3cc9 !important;
}

.next.error i.fa {
    top: 49%;
}

.series-card .topbar i.fa.fa-edit {
    margin-left: auto;
}

.series-card .topbar i.fa.fa-trash {
    margin-right: 30px;
}

.series-card .topbar i {
    cursor:pointer;
}

.topbar i.fa.fa-angle-left.back {
    position: relative;
    top: 0;
    left: 0;
    margin-left: 15px;
    margin-right: -30px;
}

.object-list{
    margin-top: 30px;
    display: flex;
    flex-direction: column;
    justify-content: start;
    align-items: center;
    width: 90%;
    position: relative;
    flex-wrap: wrap;
    justify-content: center;
    flex-direction: row;
    margin: auto;
    margin-bottom: 30px;
    margin-top: 30px;
    flex-wrap: wrap;
}

.flow i.fa.fa-project-diagram {font-size: 25px;margin-top: 0;margin-bottom: 60px;}

.flow .flow-info {
    margin-top: 0px;
    margin-bottom: 20px;
}

.block-editor {
    width: 100%;
    height: calc(100% - 50px);
}

.flow.ui-list-item {
    height: 113px;
}

.flow h2 {
    margin: 5px;
}


.page .add:not(button) {
    margin-top: 30px;
}

.modal.edit-flow {
    width: 600px;
    height: 400px;
}

.modal.manage-flow {
    width: 600px;
    height: 400px;
}

.modal.flow-point-select {
    width: 700px;
    height: 500px;
}

.flow-point-select .search {
    margin-right: 30px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 220px;
}

.modal.upload-flow-script {
    width: 570px;
    height: 350px;
}

.upload-flow-script input[type="file"] {
    width: 240px;
}


.modal.customer-select {
    width: 95%;
    height: 85%;
    overflow: hidden;
    background-color: #2196f3;
}

.modal.customer-select iframe {
    width: 100%;
    height: calc(100% - 50px);
    border-radius: 3px;
    overflow: hidden;
    border: unset;
}

.customer-select .topbar .next {
    margin-left: 30px;
}

body.plain > .customer-card {
    top: 0px;
    height: 100%;
}

.search-sidebar h2 {
    margin-bottom: 3px;
    margin-top: 23px;
    margin-left: auto;
}

.create-transaction .customer.ui-list-item {transform-origin: top right;transform: scale(.6);position: absolute;right: 60px;}

.create-transaction .name-container {
    height: 135px;
}


.customer-card.flagged .card-name:not(.add-name) {
}

.customer-card .main>.status {
    right: unset;
    left: 20px;
    top: 25px;
    color: #3d3d3d;
    display: flex;
    flex-direction: column;
    justify-content: start;
    background-color: white;
    border-radius: 6px;
    border: 1px solid #3b3b3b;
}

.customer-card .status>* {
    margin-bottom: 17px;
}

.revision.flagged.open {
    background-color: #ff9720;
    color: white;
}

.revision.flagged {
    background-color: #ff97205c;
}

.customer.flagged .customer-header {
    background-color: #ff8800;
    color: white;
}

.customer.flagged i.fa {
    color: white;
}

.customer.flagged.population-selected {
    box-shadow: 0 0 0px 2px #ff8800;
}

.customer.flagged i.fa-flag {
    margin-left: auto;
    margin-right: 20px;
    font-size: 13px;
}

.flagged *:not(.pii-container)>.card-names>.card-name[contenteditable] {
    background-color: #ff9720bf;
}

.customer-card .finish-item.flagged-object {
    background-color: #ffa0004d;
    border-radius: 6px;
}

.transaction-item.flagged-object {
    box-shadow: 0 0 0px 1px #ffa000;
}
.modal.revision-menu {
    width: 900px;
    height: 600px;
}

.page {
    overflow-y: scroll;
    overflow-x: hidden;
    height: calc(100% - 50px);
    position: relative;
    z-index: 1;
    transition: all 300ms;
}

.encapsulate.encapsulate-presentation {
    width: 100%;
    height: 100%;
    position: fixed;
    background-color: white;
    z-index: 4;
    top: 0;
}

.flag-select .customer-card {
    position: absolute;
    transform: rotate(0deg);
    width: calc(100% - 250px);
    left: 250px;
    height: calc(100%);
}

.flag-action-bar {}

.flag-action-bar {
    background-color: white;
    position: absolute;
    position: absolute;
    height: calc(100% - 50px);
    bottom: 0px;
    width: 60px;
    right: 0px;
    box-shadow: 0 0 5px 0 #00000033;
    display: flex;
    flex-direction: column;
    align-items: center;
    z-index: 1;
    transition: all 200ms;
    transform: translateX(0px);
}

.flag-action-bar.right {
    transform: translateX(110%);
}

.encapsulate .page {
    height: 100%;
}

.next.relative {
    bottom: unset;
    transform: unset;
    left: unset;
}

.relative {
    position: absolute;
}

.next.flag-queue {
    margin: auto;
    margin-bottom: 10px;
}

.central-actions {
    width: 200px;
    margin-right: auto;
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
}

.modal.flag-select {
    width: 1246px;
    height: 700px;
}

.flag-select .next.release {
    background-color: green;
}

.notification.move-left {
    transform: translateX(95%);
}

.status i.fa.fa-flag.has-action:hover {
    transform: scale(1.1);
    transition: all 200ms;
    cursor: pointer;
    filter: invert(1);
}

.splash {
    width: 100%;
    height: 100%;
    position: fixed;
    background-color: #2196f3;
    z-index: 1000;
    display: flex;
}

.splash img {
    width: 100px;
    object-fit: cover;
    position: relative;
    margin: auto;
    transform: translateY(-55px);
}

[point-set='access-management-topbar'][point='users'] .finish-list {
    width: 60%;
    margin-top: 30px;
}

[point-set='access-management-topbar'][point='keys'] .finish-list {
    width: 60%;
    margin-top: 30px;
}

.topbar.white.retract {margin-top: -60px; margin-bottom:10px;}

.modal.invoice {
    width: 10in;
    height: 6in;
}

.modal.invoice .demon-large-item {
    box-shadow: unset;
    margin-top: 30px;
    margin-bottom: 20px !important;
    margin: 8px 20px 30px 20px;
}

.population-list-export .next.clear {
    background-color: #3f51b5;
}

.freeze * {
  -webkit-transition: none !important;
  -moz-transition: none !important;
  -o-transition: none !important;
  -ms-transition: none !important;
  transition: none !important;
}

.page.extend {
    height: 100%;
}

.modal.onboard-first {
    width: 1000px;
    height: 600px;
}

.page.content {
    position: absolute;
    top: 50px;
}

.user-detail i.fa.fa-user {
    margin-right: 7px;
}

.user-detail {
    padding: 6px 14px;
    border-radius: 5px;
    overflow: hidden;
    white-space: nowrap;
    flex-shrink: 0;
}

.modal.user-actions {
    width: 600px;
    height: 400px;
}

[point='overview'] .demon-large-item {
}

[point='modules'] .finish-list {
    margin-top: 0px;
}

.product-list, .object-list {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: center;
    margin-top: 40px;
    margin-bottom: 40px;
}


.topbar i.fa-plus.add {
    margin-left: auto;
    margin-right: 30px;
    cursor: pointer;
    left: unset;
    top: unset;
    margin-top: unset;
}

.sequenced-item {
    width: 600px;
    height: 260px;
    margin: 20px auto;
    display: flex;
    flex-direction: row;
    box-shadow: 0 0 4px #0000003d;
    padding: 20px;
    border-radius: 6px;
}

.sequenced-item:first-child {
}

.sequenced-item .product-small {
    box-shadow: unset;
    margin: unset;
    width: 250px;
}

.sequenced-item .finish-list i {
    margin-left: 15px;
}

.edit-series-item {
    width: 700px;
    height: 500px;
}

.nothing-to-show {
    text-align: center;
    position: absolute;
    left: 50%;
    transform: translate(-50%, -50%);
    top: 38%;
    white-space: nowrap;
}

.nothing-to-show h2 {
    margin: unset;
}

.nothing-to-show .fa {
    margin-bottom: 20px;
}

.nothing-to-show * {
    color: #4d4d4d !important;
}

.edit-variant .variant-options {
    position: relative;
    height: 200px;
    width: -webkit-fill-available;
    border-radius: 6px;
}

.topbar-push {
    margin-left: auto;
    margin-right: 30px;
}

.action {
    cursor: pointer;
}

.modal.edit-image {
    width: 700px;
    height: 500px;
}

.edit-image [point='address'] .system-image {
    margin-left: 30px;
}

.edit-image .flex {
    margin-top: 30px;
}

[point='address'] input {
    width: 212px;
}

.variant-options .nothing-to-show {top: 48%;}

.variant .body {
    width: 300px;
    margin-top: 20px;
}

.variant .finish-list {
    margin-top: unset;
    font-size: 12px;
}

.variant .flex {
    justify-content: space-around;
    margin-bottom: 10px;
}

.campaign h2 {
		margin-left: 0;
		text-align: center;
		overflow: hidden;
		white-space: nowrap;
		text-overflow: ellipsis;
		/*margin-bottom: 10px;
		/margin-top: 20px;*/
		margin: 10px auto;
		max-width: 100%;
		margin-bottom: 7px;
}

.campaign {
    margin: 21px;
    width: 380px;
    border-radius: 7px;
    position: relative;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    box-shadow: 0 0 4px #0000003d;
    height: 375px;
    position: relative;
}

[point-set='campaign-card-sidebar'] iframe {
    width: 100%;
    height: 100%;
    border: unset;
    display: block;
}


.campaign-mailing {
    margin: 20px;
    width: 330px;
    border-radius: 7px;
    position: relative;
    overflow: hidden;
    display: flex;
    align-items: center;
    flex-direction: column;
    box-shadow: 0 0 4px #0000003d;
    padding: 20px 20px;
    height: 120px;
}

.campaign-mailing>h2 {
    margin-left: unset;
}

[point-set='campaign-mailing-sidebar'] iframe {
    width: 100%;
    height: 100%;
    display: block;
    border: unset;
}




[point-set='campaign-mailing-sidebar'] iframe {
    width: 100%;
    height: 100%;
    display: block;
    border: unset;
}


.user {
    margin: 21px;
    width: 195px;
    position: relative;
    overflow: hidden;
    display: flex;
    align-items: center;
    flex-direction: column;
    box-shadow: 0 0 4px #0000003d;
    padding: 20px 20px;
    height: 241px;
    border-radius: 6px;
}

.user.key h2 {
    margin-top: 5px;
}

.user.key {
}

.user.key small {
    font-size: 11px;
}

.user h2 {
    margin-top: 10px;
}

.mailing-item {
    margin: 21px;
    width: 380px;
    border-radius: 7px;
    position: relative;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    box-shadow: 0 0 4px #0000003d;
    height: 375px;
    position: relative;
}

.mailing-item:first-child {
}

.mailing-item .finish-item i {
}

.switch.disabled {filter: grayscale(.6);cursor: no-drop;}

.switch.disabled::after {
    background-color: white;
}

.mailing-results-small {
    width: 250px;
    position: relative;
}

.mailing-item h2 {
    margin: unset;
    margin-bottom: 15px;
}

.mailing-item .finish-list {
    font-size: 13px;
}

.mailing-item .fa-check {
    color: green;
}

.mailing-item .flex>div>p {
}

.linear-list {
    margin-top: 60px;
    margin-bottom: 60px;
}

.create-transaction .desc {
    text-align: right;
}

.select-campaign.modal {
    width: 800px;
    height: 600px;
}

.select-address.modal {
    width: 800px;
    height: 600px;
}

.document {
    width: 330px;
    margin: 21px;
    width: 185px;
    border-radius: 7px;
    position: relative;
    overflow: hidden;
    display: flex;
    align-items: center;
    flex-direction: column;
    box-shadow: 0 0 4px #0000003d;
    padding: 20px 20px;
    height: 230px;
}

.document>.fa {
    font-size: 58px;
    margin-top: 30px;
    margin-bottom: 30px;
}

.document h2 {
    margin: 0 auto;
    margin-top: 10px;
    text-align: center;
    overflow: hidden;
    white-space: nowrap;
    max-width: 100%;
    text-overflow: ellipsis;
    margin-bottom: 10px;
    font-size: 15px;
}

.document .document-info {
    width: -webkit-fill-available;
    margin-right: auto;
    height: 100%;
    margin-top: 20px;
}

.document .fa-cog {
    font-size: unset;
    position: absolute;
    bottom: 2px;
    right: 20%;
}

div#html-container {
    height: 100%;
}



.tox-toolbar-overlord {
    margin-top: -1px !important;
}

.tox-toolbar__primary {
    position: fixed !important;
    width: 100% !important;
}

.tox-sidebar-wrap {
    margin-top: 38px !important;
}

.custom-page-size.modal {
    width: 500px;
    height: 300px;
}

.page-setup.modal {
    width: 1000px;
    height: 600px;
}

.modal.merge-menu {
    width: 700px;
    height: 500px;
    z-index: 68;
}

.subscription-model {
    width: 500px;
    height: 300px;
    box-shadow: 0 0 4px #0000003d;
    border-radius: 6px;
    margin: 20px auto;
    overflow: hidden;
}

.subscription-model>p {
    margin-left: 30px;
    font-size: 16px;
}

.subscription-model i.fa.fa-cog {
    margin-left: auto;
    margin-right: 30px;
    cursor: pointer;
}

.edit-series-subscription-model {
    width: 800px;
    height: 500px;
}

.bulk-actions-menu.modal {
    width: 700px;
    height: 500px;
}

.create-mailing.modal {
    width: 600px;
    height: 400px;
}

.customer[noclick] {
    cursor: no-drop;
}

.customer i.fa-minus-circle {
    margin-left: auto;
    margin-right: 20px;
    color: red;
    font-size: 12px;
    cursor: pointer;
}

.topbar.white {
    padding: 0px 0;
}

.display-item.no-sep {
    border-right: unset;
}

.personal-info li, .object-container:not(.basic) li:not([category]) {padding-left: 40px !important;}

.iso-lookup-tab .finish-list {
    margin-top: 0px;
}

.finish-item.selectable.warn {
    background-color: #ffc04c;
    padding-left: 50px;
}

.finish-item.selectable.warn i.fa-exclamation-triangle {
    margin-right: 5px;
    margin-bottom: 5px;
    position: absolute;
    top: 50%;
    transform: translate(-31px, -50%);
}
.customer-info.notes .finish-list {
    margin-top: 0px;
}

datalist {
    display: none !important;
}

.user i.fa.fa-user, .user i.fa.fa-key {
    font-size: 35px;
    margin-top: 34px;
}

.view-credential .finish-list {
    width: 80%;
    margin-top: 30px;
    margin-bottom: 60px;
}

.modal.create-restriction {
    width: 600px;
    height: 400px;
}

.modal.refactor-product-variants {
    width: 950px;
    height: 650px;
}

.refactor-product-variants .finish-item .fa.action {
    transform: translateY(2px);
}


.refactor-product-variants div#options {
    transform: unset;
    left: unset;
    margin-top: unset;
}

.refactor-product-variants .finish-item {
    padding-top: 4px;
    padding-bottom: 4px;
    font-size: 13px;
}

.refactor-product-variants .finish-list {
    left: unset;
    transform: unset;
    margin-top: unset;
}

.refactor-product-variants input[type="text"] {
    width: 130px;
    font-size: inherit !important;
    padding: 3px;
    padding-right: 10px;
}

input[type="datetime-local"] {
    width: 220px !important;
    padding-left: 10px !important;
}


.campaign .display-item {
    max-width: 300px;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.campaign.small-campaign-card {
    height: 50px;
    width: 700px;
    margin: 5px;
    box-shadow: 0 0 2px 0 #00000054;
    border-radius: unset;
    padding: 2px;
    border-radius: 3px;
}

.campaign.small-campaign-card>.topbar {
    box-shadow: unset;
}
.campaign-mailing.small-mailing-card>.topbar {
    box-shadow: unset;
}

.campaign-mailing.small-mailing-card {
    height: 50px;
    width: 700px;
    margin: 5px;
    box-shadow: 0 0 2px 0 #00000054;
    border-radius: unset;
    padding: 2px;
    border-radius: 3px;
}


.modal.customer-toolbox {
    width: 700px;
    height: 500px;
}

.modal.merge-customers {}

.modal.merge-customers {
    width: 600px;
    height: 400px;
}

input[type="radio"] {
    width: unset;
    height: unset;
    padding: unset;
    -webkit-appearance: radio;
    cursor: default;
    border: unset !important;
    outline: none !important;
    border-radius: unset;
}

input[type="checkbox"] {
    width: unset;
    height: unset;
    padding: unset;
    -webkit-appearance: checkbox;
    cursor: default;
}

.flag-select .page>.finish-list {
    margin-top: unset;
}

.flag-select .history-sidebar i.fa.fa-arrow-left.back {
    display: none !important;
}

.checklist {
}

.path-vertical .checklist {
    text-align: left;
    padding-top: 13px;
    padding-bottom: 13px;
    margin-left: 40px;
    position: relative;
    transition: all 100ms;
    display: flex;
    align-items: center;
    user-select: none; -webkit-user-select: none;
}

.flow-bubble {
    width: 30px;
    height: 30px;
    background-color: #353535;
    border-radius: 100%;
    position: relative;
    transform: translate(-50%, 0px);
    z-index: 2;
    margin-right: 10px;
    box-shadow: 0 0 18px 2px #0000003b;
    transition: all 100ms;
    flex-grow: 0;
    flex-shrink: 0;
}

.flow-line {
    position: absolute;
    width: 17px;
    background-color: #adc8ff;
    left: 0px;
    top: 50%;
    height: 100%;
    transform: translate(-50%, 0px);
    box-shadow: 0 0 6px 0 #00000030;
    transition: all 100ms;
}

.checklist:not(.open):not(.active) .flow-line-top {
}

.checklist.open .flow-line, .checklist:not(.open):not(.active) .flow-line {
    background-color: #f2f2f2;
    outline: 2px dotted;
    outline-offset: -2px;
}

.active .flow-bubble {
    background-color: #adc8ff;
}

h3 {}

.checklist h3 {
    margin: unset;
}

.checklist i.fa.fa-lock {
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    color: #cccccc;
    font-size: 12px;
}

.checklist.open .flow-bubble {
    background-color: #558dff;
}

.checklist.open .fa, .checklist.active .fa {
    display: none;
}

.checklist.active .fa {}

.checklist.locked {
    cursor: not-allowed;
}

.checklist {
    cursor: pointer;
    position: relative;
}

.checklist:not(.locked):hover .flow-bubble{
    background-color: #75a2ff;
}

.checklist.locked:hover .flow-bubble .fa{
    color: white;
}

.checklist.locked:hover .flow-bubble{
    background-color: #262626;
}

.checklist.outline-hover-path .flow-line {
    outline: 2px solid #adc8ff !important;
    background-color: #adc8ff !important;
}

.checklist.outline-hover .flow-bubble {
    background-color: #adc8ff;
}

.checklist.outline-hover-path .flow-bubble{
    background-color: #adc8ff;
}

.checklist.outline-hover-exclude .flow-line, .checklist.outline-hover .flow-line {
    filter: opacity(.6);
    /*outline: 2px dotted;
    outline-offset:-2px;*/
}

.checklist.outline-hover-exclude .flow-bubble {
    background-color:#353535;
}

.checklist.outline-unreachable {
    cursor: not-allowed !important;
}

.checklist.outline-unreachable:hover .flow-bubble {
    background-color: #353535;
}

.sidebar-retracted i.fa.fa-arrow-right {
    position: absolute;
    top: 0;
    right: 0;
    width: 50px;
    height: 10000%;
    text-align: right;
    cursor: pointer;
    transform: translate(0px, 0px);
}

.sidebar.sidebar-retractable:not(.sidebar-retracted) i.fa.fa-arrow-right {
    display: none;
}

.sidebar-retracted .fa-arrow-right::before {
    position: relative;
    top: 20px;
    right: 18px;
}

.sidebar-retracted i.fa.fa-arrow-right:hover {
    background-color: #00000008;
}

[path-set='fulfill-path'] .itemlist {
    width: 70%;
    margin: auto;
    margin-top: 60px;
}

.path {
    position: relative;
    margin: auto;
    display: flex;
    flex-direction: row;
    align-items: center;
    width: fit-content;
    margin-top: 20px;
    padding-bottom: 30px;
    margin-bottom: 20px;
}

.path .checklist .flow-line {
    height: 17px;
    width: 100%;
    left: 15px;
    transform: translate(0%, -50%);
}

.path .checklist {
    padding-right: 40px;
    align-items: center;
    display: flex;
}

.path .flow-bubble {
    margin-right: unset;
    transform: translate(0px);
}

.path .checklist:last-of-type {
    padding-right: unset;
    width: 30px;
}

.path .checklist h3 {
    position: relative;
    transform: translate(calc(-50% + -15px), 30px);
    white-space: nowrap;
}

.checklist.list-in .flow-line {
    transform: rotate(-17deg);
}

.checklist.list-out .flow-line {
    transform: rotate(17deg) translate(-100%, 0);
}

.sidebar .checklist:hover {
    border-right: 3px solid #75a2ff;
}

.sidebar .checklist.locked:hover {
    border-right: none;
}

.queue-select .page>.itemlist {
    width: 70%;
    margin: auto;
    margin-top: 105px;
}

.checklist.list-tabbed {
    margin-left: 57px;
}

.modal.edit-product {
    width: 800px;
    height: 500px;
}

.create-transaction [point-set="subscription-config-topbar"] .itemlist {
    width: 80%;
    margin: auto;
    margin-top: 80px;
}

.modal.migrate-transaction {
    width: 500px;
    height: 300px;
}

.transaction-item.highlight {
    box-shadow: 0 0 0px 1px #2c6ff0;
}

.modal.edit-transaction-cart {
    width: 700px;
    height: 480px;
}

.modal.edit-transaction-cart .itemlist {
    width: 80%;
    margin: auto;
    margin-top: 50px;
}

.create-document.modal {
    width: 800px;
    height: 500px;
}

.modal.create-communication {
    width: 600px;
    height: 400px;
}

.modal.set-communication-recipients {
    width: 500px;
    height: 300px;
}

.payment-methods {
    height: 500px;
}

.modal.add-payment-method {
    width: 900px;
    height: 550px;
}

.modal.billing-information {
    width: 750px;
    height: 500px;
}

.demon-large-item.notification-settings .finish-list {
    margin-top: 30px;
    width: 95%;
}

ul {
    font-weight: lighter;
}

li, li[openable]>.open {}

.popover ul li:hover {outline: 1px solid #e8e8e8;}

ul[list] li {
    display: flex;
    justify-content: space-between;
    padding: 0.83em 30px;
    align-items: center;
    border-bottom: 1px solid #ececec8f;
    position: relative;
    align-items: center;

}

ul[list] li:last-of-type {
    border-bottom: unset;
}

li[openable], li[category] {display: block !important;cursor: pointer;user-select: none; -webkit-user-select: none;padding: 0px 0px !important;}

li[openable]>ul, li[category]>ul {border-left: 1px dashed #666666;width: calc(100% - 21px);margin-left: 20px;transform: unset;}

li[openable]>.open, li[category]>.category {left: 0;top: 0;position: relative;display: flex;justify-content: space-between;align-items: center;padding: .8em 30px;}

li[openable] .open:hover {
    background-color: #f3f3f3;
    cursor: pointer;
}

li[openable][open]>.open>.fa-angle-right {
    transform: translate(-2px, 0px) rotate(90deg);
    transition: all 200ms;
}

li[openable]>.open>.fa-angle-right {
    transform: translate(-2px, 0) rotate(0);
    transition: all 200ms;
}

li[openable][open] {
    height: fit-content;
}

li[openable]:not([open])>ul {
    display: none;
}

li[category][hidden]>ul {
    display: none;
}

li[openable]>ul>li:first-of-type, li[category]>ul>li:first-of-type {
    border-top: 1px solid #00000008;
}

.edit-address-component.modal {
    width: 800px;
    height: 600px;
}

.popover li>i {
    margin-left: 20px;
    width: 20px;
    text-align: center;
}

p.preview {
    margin-right: 30px;
    margin-left: auto;
}

.topbar.white.large-topbar {
    transform: unset;
    padding: unset;
    height: 70px;
}

.advanced-search .topbar h2 {
    margin-left: auto;
    margin-right: auto;
}

.advanced-search i.fa.fa-info-circle {
    margin: 0px 10px 0px 0px;
}

.popover.right-top-arrow:before {
    left: unset;
    right: 1px;
    transform: translate(50%, -50%) rotate(45deg);
    top: 11px;
}

.popover.right-top-arrow:after {right: 1px;left: unset;top: 12px;}

.variant .flex {
    flex-direction: column;
    align-items: center;
    margin-top: 15px;
    height: 240px;
    justify-content: space-evenly;
}
.advanced-search ul li {
    background-color: white;
}

.advanced-search .main .value>* {
    margin-left: 10px;
    margin-right: 10px;
}

.advanced-search .main ul {
    max-height: calc(100% - 16% - 70px);
    overflow: scroll;
    margin-bottom: unset;
    margin-top: unset;
}
.object-selector {
    width: 200px;
    height: 20px;
    border: 1px solid #2a9bff;
    padding: 2px 5px 2px 5px;
    border-radius: 4px;
}

.object-select {
    min-width: 20px;
    transition: all 200ms;
    height: 22px;
    display: inline-flex;
    align-items: center;
    background-color: #4caf50;
    border: 1px dashed #4caf50;
    padding: 5px 20px 5px 15px;
    border-radius: 5px;
    white-space: nowrap;
    overflow: hidden;
    cursor: pointer;
}

.object-select:focus, .object-select:hover  {
}

.object-select i {
    margin-right: 13px;
}

.object-select span {
    width: calc(100%);
    overflow: hidden;
    text-overflow: ellipsis;
}

.object-select[required]:not([set]) {
    background-color: #ff57220f;
    border: 1px dashed #ff8686;
}

.object-select:not([required]):not([set]) {
    background-color: #fbfbfb;
    border: 1px dashed #b7b7b7;
}

.object-select[required]:not([set]) i.fa.fa-stroopwafel {

    color: #792020;
}

.object-select:not([required]):not([set]) i.fa.fa-stroopwafel{
    color:#474747;
}

.object-select[reqired]:not([set]) span {
    color: #b4a9a9;
}

.object-select[set] {
    color: white;
}

.object-select[set] i.fa.fa-ban {
    display: block;
    color: #293b2a42;
}

.object-select i.fa.fa-ban {
    display: none;
}

.object-select[set] i.fa.fa-stroopwafel {
    display: none;
}

.object-select i.fa.fa-stroopwafel {}

.object-select[set]:not([disabled]):hover i.fa.fa-ban {
    color: white;
}

.object-select[set]:not([no-change]):hover {
    background-color: #70b873;
    border: 1px solid #70b873;
}

.object-select:not([reqired]):not([set]) span {
    color: Gray;
}

.object-select:not([required]):not([set]):not([disabled]):hover {
    border: 1px solid #00000087;
}

.object-select[required]:not([set]):not([disabled]):hover {
    border: 1px solid #ff8686;
}

.graph {
    width: 500px;
    height: 250px;
}

.graph {
    border: 1px solid #00000014;
    position: relative;
    flex-grow: 0;
    flex-shrink: 0;
    margin: 10px;
}

.graph {}

.graph .load-throbber {
    top: 50%;
    position: absolute;
}

.topbar.white.fix-pad {
    padding: 0px 20px;
    transform: translateX(-40px);
    width: calc(100% + 20px);
}

.graph .page {
    padding: 20px;
}

[point='usage'] .graph:last-of-type {
    margin-bottom: 30px;
}

.modal.quick-product-information {
    width: 800px;
    height: 600px;
}

.modal.customer-communications {
    width: 1050px;
    height: 700px;
}

.modal.new-customer-communication {
    width: 650px;
    height: 450px;
}

.modal.pdf-preview {
    width: 90%;
    height: 90%;
}

.modal.email-preview {
    width: 90%;
    height: 80%;
}




/* Email Client UI */

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

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

.dropdown, .dropleft, .dropright, .dropup {
    position: relative;
}

svg {
    overflow: hidden;
    vertical-align: middle;
}

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

.flex-wrap {
    -ms-flex-wrap: wrap!important;
    flex-wrap: wrap!important;
}


@media (min-width: 992px) {
    .inbox-wrapper .email-aside .aside-content {
        padding-right: 10px;
    }
}

.inbox-wrapper .email-aside .aside-content .aside-header {
    padding: 0 0 5px;
    position: relative;
}

.inbox-wrapper .email-aside .aside-content .aside-header .title {
    display: block;
    margin: 3px 0 0;
    font-size: 1.1rem;
    line-height: 27px;
    color: #686868;
}

.inbox-wrapper .email-aside .aside-content .aside-header .navbar-toggle {
    background: 0 0;
    display: none;
    outline: 0;
    border: 0;
    padding: 0 11px 0 0;
    text-align: right;
    margin: 0;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    position: absolute;
}

@media (max-width: 991px) {
    .inbox-wrapper .email-aside .aside-content .aside-header .navbar-toggle {
        display: block;
    }
}

.inbox-wrapper .email-aside .aside-content .aside-header .navbar-toggle .icon {
    font-size: 24px;
    color: #71738d;
}

.inbox-wrapper .email-aside .aside-content .aside-compose {
    text-align: center;
    padding: 14px 0;
}

.inbox-wrapper .email-aside .aside-content .aside-compose .btn,
.inbox-wrapper .email-aside .aside-content .aside-compose .fc .fc-button,
.fc .inbox-wrapper .email-aside .aside-content .aside-compose .fc-button,
.inbox-wrapper .email-aside .aside-content .aside-compose .swal2-modal .swal2-actions button,
.swal2-modal .swal2-actions .inbox-wrapper .email-aside .aside-content .aside-compose button,
.inbox-wrapper .email-aside .aside-content .aside-compose .wizard > .actions a,
.wizard > .actions .inbox-wrapper .email-aside .aside-content .aside-compose a {
    padding: 11px;
}

.inbox-wrapper .email-aside .aside-content .aside-nav {
    visibility: visible;
    padding: 0 0;
}

.inbox-wrapper .email-aside .aside-content .aside-nav.collapse {
    display: block;
}

@media (max-width: 991px) {
    .inbox-wrapper .email-aside .aside-content .aside-nav.collapse {
        display: none;
    }
}

@media (max-width: 991px) {
    .inbox-wrapper .email-aside .aside-content .aside-nav.show {
        display: block;
    }
}

.inbox-wrapper .email-aside .aside-content .aside-nav .title {
    display: block;
    color: #3d405c;
    font-size: 12px;
    font-weight: 700;
    text-transform: uppercase;
    margin: 20px 0 0;
    padding: 8px 14px 4px;
}

.inbox-wrapper .email-aside .aside-content .aside-nav .nav li {
    width: 100%;
}

.inbox-wrapper .email-aside .aside-content .aside-nav .nav li a {
    display: -webkit-flex;
    display: flex;
    -webkit-align-items: center;
    align-items: center;
    position: relative;
    color: #71748d;
    padding: 7px 14px;
}

.inbox-wrapper .email-aside .aside-content .aside-nav .nav li a:hover {
    text-decoration: none;
    background-color: rgba(114, 124, 245, 0.1);
    color: #727cf5;
}

.inbox-wrapper .email-aside .aside-content .aside-nav .nav li a .icon svg {
    width: 18px;
    margin-right: 10px;
}

.inbox-wrapper .email-aside .aside-content .aside-nav .nav li a .badge {
    margin-left: auto;
}

.inbox-wrapper .email-aside .aside-content .aside-nav .nav li a svg {
    width: 18px;
    margin-right: 10px;
}

.inbox-wrapper .email-aside .aside-content .aside-nav .nav li.active a {
    color: #ff3366;
    background: rgba(255, 51, 102, 0.1);
}

.inbox-wrapper .email-aside .aside-content .aside-nav .nav li.active a .icon {
    color: #ff3366;
}

.inbox-wrapper .email-content .email-inbox-header {
    background-color: transparent;
    padding: 18px 18px;
}

.inbox-wrapper .email-content .email-inbox-header .email-title {
    display: -webkit-flex;
    display: flex;
    -webkit-align-items: center;
    align-items: center;
    font-size: 1rem;
}

.inbox-wrapper .email-content .email-inbox-header .email-title svg {
    width: 20px;
    margin-right: 10px;
    color: #686868;
}

.inbox-wrapper .email-content .email-inbox-header .email-title .new-messages {
    font-size: .875rem;
    color: #686868;
    margin-left: 3px;
}

.inbox-wrapper .email-content .email-inbox-header .input-search .input-group-btn .btn,
.inbox-wrapper .email-content .email-inbox-header .input-search .input-group-btn .fc .fc-button,
.fc .inbox-wrapper .email-content .email-inbox-header .input-search .input-group-btn .fc-button,
.inbox-wrapper .email-content .email-inbox-header .input-search .input-group-btn .swal2-modal .swal2-actions button,
.swal2-modal .swal2-actions .inbox-wrapper .email-content .email-inbox-header .input-search .input-group-btn button,
.inbox-wrapper .email-content .email-inbox-header .input-search .input-group-btn .wizard > .actions a,
.wizard > .actions .inbox-wrapper .email-content .email-inbox-header .input-search .input-group-btn a {
    border-radius: 0;
    padding: 4.5px 10px;
}

.inbox-wrapper .email-content .email-inbox-header .input-search .input-group-btn .btn svg,
.inbox-wrapper .email-content .email-inbox-header .input-search .input-group-btn .fc .fc-button svg,
.fc .inbox-wrapper .email-content .email-inbox-header .input-search .input-group-btn .fc-button svg,
.inbox-wrapper .email-content .email-inbox-header .input-search .input-group-btn .swal2-modal .swal2-actions button svg,
.swal2-modal .swal2-actions .inbox-wrapper .email-content .email-inbox-header .input-search .input-group-btn button svg,
.inbox-wrapper .email-content .email-inbox-header .input-search .input-group-btn .wizard > .actions a svg,
.wizard > .actions .inbox-wrapper .email-content .email-inbox-header .input-search .input-group-btn a svg {
    width: 18px;
}

.inbox-wrapper .email-content .email-filters {
    padding: 20px;
    border-bottom: 1px solid #e8ebf1;
    background-color: transparent;
    width: 100%;
    border-top: 1px solid #e8ebf1;
}

.inbox-wrapper .email-content .email-filters > div {
    display: -webkit-flex;
    display: flex;
    -webkit-align-items: center;
    align-items: center;
}

.inbox-wrapper .email-content .email-filters .email-filters-left .btn-group,
.inbox-wrapper .email-content .email-filters .email-filters-left .fc .fc-toolbar.fc-header-toolbar .fc-left .fc-button-group,
.fc .fc-toolbar.fc-header-toolbar .fc-left .inbox-wrapper .email-content .email-filters .email-filters-left .fc-button-group,
.inbox-wrapper .email-content .email-filters .email-filters-left .fc .fc-toolbar.fc-header-toolbar .fc-right .fc-button-group,
.fc .fc-toolbar.fc-header-toolbar .fc-right .inbox-wrapper .email-content .email-filters .email-filters-left .fc-button-group {
    margin-right: 5px;
}

.inbox-wrapper .email-content .email-filters .email-filters-left input {
    margin-right: 8px;
}

.inbox-wrapper .email-content .email-filters .email-filters-right {
    text-align: right;
}

@media (max-width: 767px) {
    .inbox-wrapper .email-content .email-filters .email-filters-right {
        width: 100%;
        display: flex;
        justify-content: space-between;
    }
}

.inbox-wrapper .email-content .email-filters .email-filters-right .email-pagination-indicator {
    display: inline-block;
    vertical-align: middle;
    margin-right: 13px;
}

.inbox-wrapper .email-content .email-filters .email-filters-right .email-pagination-nav .btn svg,
.inbox-wrapper .email-content .email-filters .email-filters-right .email-pagination-nav .fc .fc-button svg,
.fc .inbox-wrapper .email-content .email-filters .email-filters-right .email-pagination-nav .fc-button svg,
.inbox-wrapper .email-content .email-filters .email-filters-right .email-pagination-nav .swal2-modal .swal2-actions button svg,
.swal2-modal .swal2-actions .inbox-wrapper .email-content .email-filters .email-filters-right .email-pagination-nav button svg,
.inbox-wrapper .email-content .email-filters .email-filters-right .email-pagination-nav .wizard > .actions a svg,
.wizard > .actions .inbox-wrapper .email-content .email-filters .email-filters-right .email-pagination-nav a svg {
    width: 18px;
}

.inbox-wrapper .email-content .email-filters .be-select-all.custom-checkbox {
    display: inline-block;
    vertical-align: middle;
    padding: 0;
    margin: 0 30px 0 0;
}

.inbox-wrapper .email-content .email-list .email-list-item {
    display: -webkit-flex;
    display: flex;
    -webkit-align-items: center;
    align-items: center;
    border-bottom: 1px solid #e8ebf1;
    padding: 10px 20px;
    width: 100%;
    cursor: pointer;
    position: relative;
    font-size: 14px;
    cursor: pointer;
    transition: background .2s ease-in-out;
}

.inbox-wrapper .email-content .email-list .email-list-item:hover {
    background: rgba(114, 124, 245, 0.08);
}

.inbox-wrapper .email-content .email-list .email-list-item:last-child {
    margin-bottom: 5px;
}

.inbox-wrapper .email-content .email-list .email-list-item .email-list-actions {
    width: 40px;
    vertical-align: top;
    display: table-cell;
}

.inbox-wrapper .email-content .email-list .email-list-item .email-list-actions .form-check {
    margin-bottom: 0;
}

.inbox-wrapper .email-content .email-list .email-list-item .email-list-actions .form-check i::before {
    width: 15px;
    height: 15px;
}

.inbox-wrapper .email-content .email-list .email-list-item .email-list-actions .form-check i::after {
    font-size: .8rem;
}

.inbox-wrapper .email-content .email-list .email-list-item .email-list-actions .favorite {
    display: block;
    padding-left: 1px;
    line-height: 15px;
}

.inbox-wrapper .email-content .email-list .email-list-item .email-list-actions .favorite span svg {
    width: 14px;
    color: #686868;
}

.inbox-wrapper .email-content .email-list .email-list-item .email-list-actions .favorite:hover span {
    color: #8d8d8d;
}

.inbox-wrapper .email-content .email-list .email-list-item .email-list-actions .favorite.active span svg {
    color: #fbbc06;
}

.inbox-wrapper .email-content .email-list .email-list-item .email-list-detail {
    display: -webkit-flex;
    display: flex;
    -webkit-justify-content: space-between;
    justify-content: space-between;
    -webkit-flex-grow: 1;
    flex-grow: 1;
    -webkit-flex-wrap: wrap;
    flex-wrap: wrap;
}

.inbox-wrapper .email-content .email-list .email-list-item .email-list-detail .from {
    display: block;
    font-weight: 400;
    margin: 0 0 1px 0;
    color: #000;
}

.inbox-wrapper .email-content .email-list .email-list-item .email-list-detail .msg {
    margin: 0;
    color: #71738d;
    font-size: .8rem;
}

.inbox-wrapper .email-content .email-list .email-list-item .email-list-detail .date {
    color: #000;
}

.inbox-wrapper .email-content .email-list .email-list-item .email-list-detail .date .icon svg {
    width: 14px;
    margin-right: 7px;
    color: #3d405c;
}

.inbox-wrapper .email-content .email-list .email-list-item.email-list-item--unread {
    background-color: rgba(114, 124, 245, 0.09);
}

.inbox-wrapper .email-content .email-list .email-list-item.email-list-item--unread .from {
    color: #000;
    font-weight: 800;
}

.inbox-wrapper .email-content .email-list .email-list-item.email-list-item--unread .msg {
    font-weight: 700;
    color: #686868;
}

.rtl .inbox-wrapper .email-aside .aside-content .aside-header .navbar-toggle .icon {
    position: absolute;
    top: 0;
    left: 0;
}

.rtl .inbox-wrapper .email-aside .aside-content .aside-nav .nav {
    padding-right: 0;
}

.rtl .inbox-wrapper .email-aside .aside-content .aside-nav .nav li a .icon svg {
    margin-right: 0;
    margin-left: 10px;
}

.rtl .inbox-wrapper .email-aside .aside-content .aside-nav .nav li a .badge {
    margin-left: 0;
    margin-right: auto;
}

.rtl .inbox-wrapper .email-aside .aside-content .aside-nav .nav li a svg {
    margin-right: 0;
    margin-left: 10px;
}

.rtl .inbox-wrapper .email-content .email-inbox-header .email-title svg {
    margin-right: 0;
    margin-left: 10px;
}

.rtl .inbox-wrapper .email-content .email-inbox-header .email-title .new-messages {
    margin-left: 0;
    margin-right: 3px;
}

.rtl .inbox-wrapper .email-content .email-filters .email-pagination-indicator {
    margin-right: 0;
    margin-left: 13px;
}

.rtl .inbox-wrapper .email-content .email-list .email-list-item .email-list-detail .date .icon svg {
    margin-right: 0;
    margin-left: 7px;
}

.email-head {
    background-color: transparent;
}

.email-head-subject {
    padding: 25px 25px;
    border-bottom: 1px solid #e8ebf1;
}

@media (max-width: 767px) {
    .email-head-subject {
        padding: 25px 10px;
    }
}

.email-head-subject .title {
    display: block;
    font-size: .99rem;
}

.email-head-subject .title a.active .icon {
    color: #fbbc06;
}

.email-head-subject .title a .icon {
    color: silver;
    margin-right: 6px;
}

.email-head-subject .title a .icon svg {
    width: 18px;
}

.email-head-subject .icons {
    font-size: 14px;
    float: right;
}

.email-head-subject .icons .icon {
    color: #000;
    margin-left: 12px;
}

.email-head-subject .icons .icon svg {
    width: 18px;
}

.email-head-sender {
    padding: 13px 28px;
}

@media (max-width: 767px) {
    .email-head-sender {
        padding: 25px 10px;
    }
}

.email-head-sender .avatar {
    float: left;
    margin-right: 10px;
}

.email-head-sender .date {
    float: right;
    font-size: 12px;
}

.email-head-sender .avatar {
    float: left;
    margin-right: 10px;
}

.email-head-sender .avatar img {
    width: 36px;
}

.email-head-sender .sender > a {
    color: #000;
}

.email-head-sender .sender span {
    margin-right: 5px;
    margin-left: 5px;
}

.email-head-sender .sender .actions {
    display: inline-block;
    position: relative;
}

.email-head-sender .sender .actions .icon {
    color: #686868;
    margin-left: 7px;
}

.email-head-sender .sender .actions .icon svg {
    width: 18px;
}

.email-body {
    background-color: transparent;
    border-top: 1px solid #e8ebf1;
    padding: 30px 20px;
}

@media (max-width: 767px) {
    .email-body {
        padding: 30px 10px;
    }
}

.email-attachments {
    background-color: transparent;
    padding: 25px 28px 5px;
    border-top: 1px solid #e8ebf1;
}

@media (max-width: 767px) {
    .email-attachments {
        padding: 25px 10px 0;
    }
}

.email-attachments .title {
    display: block;
    font-weight: 500;
}

.email-attachments .title span {
    font-weight: 400;
}

.email-attachments ul {
    list-style: none;
    margin: 15px 0 0;
    padding: 0;
}

.email-attachments ul > li {
    margin-bottom: 5px;
}

.email-attachments ul > li:last-child {
    margin-bottom: 0;
}

.email-attachments ul > li a {
    color: #000;
}

.email-attachments ul > li a svg {
    width: 18px;
    color: #686868;
}

.email-attachments ul > li .icon {
    color: #737373;
    margin-right: 2px;
}

.email-attachments ul > li span {
    font-weight: 400;
}

.rtl .email-head-subject .title a .icon {
    margin-right: 0;
    margin-left: 6px;
}

.rtl .email-head-subject .icons .icon {
    margin-left: 0;
    margin-right: 12px;
}

.rtl .email-head-sender .avatar {
    margin-right: 0;
    margin-left: 10px;
}

.rtl .email-head-sender .sender .actions .icon {
    margin-left: 0;
    margin-right: 7px;
}

.email-head-title {
    padding: 15px;
    border-bottom: 1px solid #e8ebf1;
    font-weight: 400;
    color: #3d405c;
    font-size: .99rem;
}

.email-head-title .icon {
    color: #696969;
    margin-right: 12px;
    vertical-align: middle;
    line-height: 31px;
    position: relative;
    top: -1px;
    float: left;
    font-size: 1.538rem;
}

.email-compose-fields {
    background-color: transparent;
    padding: 20px 15px;
}

.email-compose-fields .select2-container--default .select2-selection--multiple .select2-selection__rendered {
    margin: -2px -14px;
}

.email-compose-fields .select2-container--default .select2-selection--multiple .select2-selection__rendered .select2-selection__choice {
    border-radius: 0;
    background: #727cf5;
    color: #ffffff;
    margin-top: 0px;
    padding: 4px 10px;
    font-size: 13px;
    border: 0;
}

.email-compose-fields .select2-container--default .select2-selection--multiple .select2-selection__rendered .select2-selection__choice span {
    color: #ffffff;
}

.email-compose-fields .select2-container--default .select2-selection--multiple .select2-selection__rendered .select2-search {
    line-height: 15px;
}

.form-group.row {
    margin-bottom: 0;
    padding: 12px 0;
}

.form-group.row label {
    white-space: nowrap;
}

.email-compose-fields label {
    padding-top: 6px;
}

.email.editor {
    background-color: transparent;
}

.email.editor .editor-statusbar {
    display: none;
}

.email.action-send {
    padding: 8px 0px 0;
}

.btn-space {
    margin-right: 5px;
    margin-bottom: 5px;
}

.breadcrumb {
    margin: 0;
    background-color: transparent;
}

.rtl .email-compose-fields .select2-container--default .select2-selection--multiple .select2-selection__rendered .select2-selection__choice {
    float: right;
}

.rtl .btn-space {
    margin-right: 0;
    margin-left: 5px;
}
.card {
    box-shadow: 0 0 10px 0 rgba(183, 192, 206, 0.2);
    -webkit-box-shadow: 0 0 10px 0 rgba(183, 192, 206, 0.2);
    -moz-box-shadow: 0 0 10px 0 rgba(183, 192, 206, 0.2);
    -ms-box-shadow: 0 0 10px 0 rgba(183, 192, 206, 0.2);
}
.card {
    position: relative;
    display: flex;
    flex-direction: column;
    min-width: 0;
    word-wrap: break-word;
    background-color: #fff;
    background-clip: border-box;
    border: 1px solid #f2f4f9;
    border-radius: 0.25rem;
}
.badge {
    padding: 6px 5px 3px;
}
.text-white {
    color: #ffffff !important;
}
.font-weight-bold {
    font-weight: 700 !important;
}
.float-right {
    float: right !important;
}
.badge-danger-muted {
    color: #212529;
    background-color: #f77eb9;
}

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

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

.flex-wrap {
    -ms-flex-wrap: wrap!important;
    flex-wrap: wrap!important;
}

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

*, ::after, ::before {
}

svg {
    overflow: hidden;
    vertical-align: middle;
}

.dropdown, .dropleft, .dropright, .dropup {
    position: relative;
}

.dropdown-menu {
    position: absolute;
    top: 100%;
    left: 0;
    z-index: 1000;
    display: none;
    float: left;
    min-width: 10rem;
    padding: .5rem 0;
    margin: .125rem 0 0;
    font-size: 1rem;
    color: #212529;
    text-align: left;
    list-style: none;
    background-color: #fff;
    background-clip: padding-box;
    border: 1px solid rgba(0,0,0,.15);
    border-radius: .25rem;
}

/* End Email Client UI*/

.email-preview iframe {
    border: unset;
    width: 100%;
}

.valid {outline: green auto 1px;}

.modal.geocode-result {
    width: 500px;
    height: 420px;
}

p[index='formatted_address'] {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 70%;
}

.button.red {
    background-color: #900909;
}

.advanced-search .object-select {
    margin: 0px 5px;
}

.modal.bulk-action {
    width: 600px;
    height: 400px;
}

.disabled>*, [disabled]>* {
    color: gray;
}

.content.filters li[filter-id] {
    cursor: default;
}

.content.filters li[filter-id] .fa-plus {
    cursor: pointer;
}

.transactions .topbar.white {
    margin-bottom: 60px;
}

.modal.tag-select {
    height: 300px;
    width: 500px;
}

.modal.edit-customer-name {
    width: 700px;
    height: 500px;
}

.modal.change-password {
    width: 500px;
    height: 250px;
}

.topbar.white.line {
    box-shadow: unset;
    border-bottom: 1px solid #00000012;
}

.topbar.white.line {
    box-shadow: unset;
    border-bottom: 1px solid #00000012;
}

.page[point-set='product-card-topbar'][point='configuration'] {
    overflow: hidden;
}

.flex-h {
    display: flex;
    flex-direction: row;
}

.remote-order .customer {
    margin: auto;
    margin-top: 29px;
    box-shadow: unset;
    width: 78%;
    border: 1px solid #dfdfdf;
    margin-bottom: 20px;
}

.remote-order .transaction-item:first-of-type {margin-top: 150px;}

.customer [category] i.fa.fa-star, .customer [openable] i.fa.fa-star, .customer [category] i.fa.fa-exclamation-triangle, .customer [openable] i.fa.fa-exclamation-triangle {
    font-size: 9px;
}

.customer i.fa {
    color: #5266ff;
    top: 20px;
    left: 20px;
}

.add-transaction-communication {
    width: 750px;
    height: 530px;
}

.object-select[no-change] {
    cursor: default;
}

.object-select[no-change][set] i {
    display: none !important;
}

.object-select[no-change] {
    padding-left: 20px;
}

.card-names .card-name.add-name {
    border: 1px dashed #3b3b3b;
    color:#3b3b3b;
}

.card-names .card-name.add-name:hover {
    cursor:pointer;
}

.card-names.status-left {
    margin-left: 80px;
}

.modal.auto-renew {
    width: 400px;
    height: 200px;
}

.modal.bulk-import {
    width: 1300px;
    height: 700px;
}

.bulk-import td {
    border-right: 1px solid white;
    white-space: nowrap;
    padding: 5px;
    border-collapse: separate;
}

.bulk-import td:first-of-type {
}

.bulk-import tr {
    border: unset;
}

.bulk-import tr:nth-child(odd) {}

.bulk-import tr td, .bulk-import tr th {
    border: 1px solid #e7e7e7;
}

.bulk-import table {
    border-collapse: collapse;
}

.load-throbber.mini {
    position: relative;
    left: unset;
    top: unset;
    width: 30px;
    height: 30px;
    transform: unset;
    font-size: 12px;
}

.mini .throbber {
}

.remote-order .warn {
    background-color: #ffddb7;
}

.bulk-import tr td {
    cursor: pointer;
}

.bulk-import .column-select {}

.bulk-import td.highlight {}

.bulk-import tr[head]:first-of-type {
  position: -webkit-sticky; /* for Safari */
  position: sticky;
  top: 0;
  background-color: white;
  border: 1px solid #898989;
}

.bulk-import ul#columns i.fa.fa-arrow-right {
    color: gainsboro;
    margin-left: 15px;
}

.import-column-drag-ghost .rule-ui-tag{
	display:block !important;
	background-color:white;
}

#columns .rule-ui-tag {
    display: block;
}

p.rule-ui-tag {
    display: none;
}

.bulk-import #columns li.highlight, .bulk-import #dedupe li.highlight {
    background-color: #a4caff;
}

.bulk-import #columns li.highlight i.fa-arrow-right {
    color: white;
}

.modal.edit-campaign {
    width: 600px;
    height: 400px;
}

.transaction-item.medium.not-local-transaction {
    background-color: white;
}

.transaction-item.not-local-transaction .object-header {
    background-color: #ff57221c;
}

.report {
    margin: 21px;
    width: 300px;
    border-radius: 7px;
    position: relative;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    box-shadow: 0 0 4px #0000003d;
    height: 345px;
    position: relative;
}

.report i.fa.fa-chart-pie {
    font-size: 59px;
}

.flex-h {}

.flex-v {
    display: flex;
    flex-direction: column;
}

.modal.configure-report {
    width: 800px;
    height: 500px;
}

.modal.change-inventory {
    width: 500px;
    height: 300px;
}

.modal.full-sale-history {
    width: 50;
    width: 700px;
    height: 400px;
}

.modal.full-sale-history .itemlist {
    width: 80%;
    margin: auto;
    top: 47%;
    transform: translateY(-50%);
}

svg > g > g:last-child { pointer-events: none }

.modal.configure-mailing {
    width: 95%;
    height: 85%;
}

.next.include {
    background-color: #f6963c;
}

.next.exclude {
    background-color: #4e4e4e;
}

.next .fa-external-link-alt {margin: 0px 0px 0px 1px;}

.modal.configure-mailing iframe {
    width: 100%;
    height: 100%;
    border: unset;
    display: block;
}

.customer.ui-list-item li {
    white-space: nowrap;
}

.modal.configure-linkage {
    width: 700px;
    height: 500px;
}

.personal-info li[category]>ul {
    margin-left: 25px;
}

.slider {
    height: 42px;
    width: 410px;
    position: absolute;
    bottom: 30px;
    left: 50%;
    transform: translate(-50%, 0);
    border-radius: 46px;
    background-color: #f9f9f9;
    box-shadow: 0 0 6px 0 #0000004d;
    border: 1px solid #a9a9a9;
    overflow: hidden;
}

.slider .circle {
    width: 40px;
    height: 40px;
    border-radius: 100%;
    background-color: #ffffff;
    box-shadow: 0 0 8px 0 #00000033;
    border: 1px solid #dedede;
    z-index: 26;
    position: absolute;
}

.block {}

.slider .block {
    height: 100%;
    width: 300px;
    background-color: #f9f9f9;
    position: absolute;
    top: 0;
    right: 0;
}

.modal.manage-object-mirroring {
    width: 600px;
    height: 400px;
}

.modal.add-object-mirror {
    height: 400px;
    width: 700px;
}

.modal.add-object-mirroring {
    width: 550px;
    height: 320px;
}

.customer-list .customer.ui-list-item .customer-body-section, .small.customer.ui-list-item .customer-body-section {
    max-height: 130px;
    min-height: 130px;
}

i.fa.fa-send {
    transform: translate(-52%, -46%);
}

.modal.email-deliverability {
    width: 600px;
    height: 400px;
}

.graph p.graph-title {
    font-weight: normal;
    display: flex;
    align-items: center;
}

.graph i.fa.fa-info-circle {
    font-size: 13px;
    margin-left: 10px;
    transform: translate(0, 0px);
}

.graph .graph-body {
    padding: 20px;
    padding-bottom: 44px;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    height: -webkit-fill-available;
}

.graph-container {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
}

.graph .graph-header-box {
    height: 50px;
}

.graph p.graph-aggregate {
    font-size: 21px;
}

.graph .comparison-tag-box {
    color: #4f566b;
    background-color: #e3e8ee;
    border-radius: 6px;
    margin-left: 10px;
    padding-left: 10px;
    font-size: 13px;
    display: flex;
    align-items: center;
    padding-top: 0px;
    width: fit-content;
    padding-right: 10px;
    justify-content: center;
}

.comparison-tag-box .tag {
    height: fit-content;
}

.graph .graph-point {
    font-size: 13px;
    margin-top: 5px;
}

.load-throbber .load-text {
    position: absolute;
    white-space: nowrap;
    left: 50%;
    transform: translate(-50%, 21px);
    font-size: 21px;
}

.inline-throbber {
    display: flex;
    flex-direction: row;
    align-items: center;
    margin: auto;
}

.load-throbber.inline-throbber .load-text {
    left: 100%;
    top: 50%;
    transform: translate(30px, -50%);
}

.inline-throbber {}

.relative.load-throbber {
    position: relative;
    transform: unset;
    top: unset;
    left: unset;
}

.inline-throbber .load-text {
    margin-left: 21px;
}

.graph-ui-item {
    width: 100%;
    height: 100%;
    margin-bottom: 5px;
}

.graph-dashboard {
    margin: 30px 30px;
}

.dashboard-head-box {
    margin-bottom: 40px;
    padding-bottom: 10px;
    border-bottom: 1px solid #0000003d;
}

.dashboard-head-box h2 {
    margin-left: unset;
    font-weight: lighter;
    font-size: 26px;
    margin-top: unset;
}

.left-range-select {
    height: 30px;
    border-radius: 5px;
    border: 1px solid #d6d6d6;
    position: relative;
    flex-shrink: 0;
    flex-grow: 0;
}

button {
    appearance: none;
    border: unset;
    background-color: unset;
    font-size: 13px;
    padding: 5px;
    padding-left: 15px;
    color: #3b3b3b;
    font-weight: lighter;
    padding-right: 15px;
    transition: all 200ms;
    cursor: pointer;
    position: relative;
    height: 30px;
		margin-left:unset;
		margin-right:unset;
}

.graph-dashboard .controls-bar.flex-h {
    font-size: 15px;
    align-items: center;
}

.button i.fa.fa-angle-down {
    margin-right: 5px;
}

.controls-bar button i.fa.fa-angle-down {
    margin-left: 5px;
    transform: translate(0px, 1px);
}

.left-range-select button:not(:last-child) {margin-right: 1px;}

.button-bar button:first-child {
    border-top-left-radius: 4px;
    border-bottom-left-radius: 4px;
}

.button-bar button:last-child {
    border-top-right-radius: 4px;
    border-bottom-right-radius: 4px;
}

.button-bar button:after, .button-bar button:before{
    position: absolute;
    top: 0;
    bottom: 0;
    z-index: 1;
    display: block;
    width: 1px;
    background: #0000000a;
    content: "";
}

.button-bar button:first-child:before, .button-bar button:last-child:after{
    display:none;
}


.button-bar button:after {
    right: -1px;
}

.button-bar button:before {
    left: -1px;
}

i.fa.fa-calendar {}

button i.fa.fa-calendar {
    margin-right: 10px;
}

button:focus {
    box-shadow: rgb(0 0 0 / 0%) 0px 0px 0px 0px, rgb(58 151 212 / 36%) 0px 0px 0px 4px, rgb(0 0 0 / 12%) 0px 1px 1px 0px, rgb(60 66 87 / 16%) 0px 0px 0px 1px, rgb(0 0 0 / 0%) 0px 0px 0px 0px, rgb(0 0 0 / 0%) 0px 0px 0px 0px, rgb(60 66 87 / 8%) 0px 2px 5px 0px;
    z-index: 2;
}

.button-bar select {
    appearance: none;
    position: relative;
    z-index: 1;
    -ms-flex: 0 1 auto;
    flex: 0 1 auto;
    margin: 0;
    text-decoration: none;
    vertical-align: middle;
    word-break: normal;
    background: transparent;
    border: 0;
    outline: 0;
    transition: color .24s;
    -webkit-appearance: none;
    appearance: none;
    -webkit-user-select: auto;
    -ms-user-select: auto;
    user-select: auto;
    padding-left: 20px;
    padding-right: 35px;
    height: 30px;
}

.button-bar {
    display: flex;
    flex-direction: row;
    align-items: center;
    height: fit-content;
    height: -moz-fit-content;
    border-radius: 5px;
    border: 1px solid #d6d6d6;
    position: relative;
    flex-shrink: 0;
    flex-grow: 0;
    background-color: white;
color: #3b3b3b !important;}

.button-bar .fa.fa-arrows-alt-v {
    margin-right: 10px;
    position: absolute;
    right: 5px;
}

.button-bar button {}

.button-bar button i.fa.fa-cog {
  margin-right: 5px;
}

ul.custom-range-ul li {
    padding: 6px;
    padding-left: 40px;
    padding-right: 30px;
}

ul.custom-range-ul li:hover {
    background-color: #a2b7f41c;
    outline: unset;
}

ul.custom-range-ul {
    width: calc(100% + 30px);
    left: 0px;
    transform: translate(-15px);
    overflow: hidden;
}

ul.custom-range-ul li {
    border: unset;
}

.custom-range-ul li.selected .fa.fa-check {
    font-size: 10px;
    position: absolute;
    left: -7px;
}

ul.custom-range-ul li.selected {
    color: #7083e7;
}

.flex-h.comparison-tag-box.red {
    color: rgb(152, 55, 5);
    background-color: #f8e5b9;
}

p.graph-aggregate[compared-aggregate] {
    text-align: right;
}

p.graph-point[compared-point] {
    text-align: right;
}

.graph .comparison-tag-box.green {
    color: rgb(14, 98, 69);
    background-color: rgb(203, 244, 201);
}


 .customer.ui-list-item .customer-body-selection {
     overflow: hidden !important;
 }

 .customer.ui-list-item .customer-body-section {
 }


.customer-list .customer.ui-list-item.group .customer-body-section {
    overflow: scroll !important;
}

.extra {}

.graph .action.extra {
    position: absolute;
    color: #4e8cff;
    bottom: -6px;
    right: 12px;
    transform: translate(0, -100%);
    font-size: 14px;
    display: none;
}

.graph .action.extra .fa {
    margin-left: 5px;
}

.graph:hover .action.extra {
    display: block;
}

.graph:hover .action.extra:hover {
    color: #1f407b;
}

.graph .endpoint-labels {
    width: 100%;
    height: 10px;
    display: flex;
    justify-content: space-between;
    margin-top: -8px;
    margin-right: 5px;
}

.endpoint-labels p {
    font-size: 12px;
    margin-left: 3px;
    margin-right: 3px;
}

.customer-card.flagged .card-name *:not(button *, button) {
}

.credential-identity {
    width: 10px;
    height: 50px;
    border: 1px solid black;
    margin-left: 15px;
    cursor: pointer;
}

.identity.flex-h {
    margin-top: 25px;
    margin-left: 30px;
}

.identity.flex-h.status-left {
    margin-left: 80px;
}

.credential-identity:hover i {
    transform: scale(1.3);
    cursor: pointer;
    color: #3786ff;
}

.credential-identity i {
    transition: all 200ms;
}

.credential-identity:hover {
    background-color: #ffffff;
}

.modal.customer-credential-menu {
    width: 600px;
    height: 400px;
}

.button-bar.large>* {
    height: 41px;
    padding-left: 20px;
    padding-right: 20px;
}

.button-bar.large.finish {
    width: max-content;
    left: 50%;
    transform: translate(-50%, -5%);
    bottom: 30px;
    position: absolute;
}

.button-bar.large.finish {}

.modal.edit-automation {
    width: 95%;
    height: 90%;
    min-width: 800px;
    min-height: 500px;
}

.edit-automation .fa-ellipsis-h {
    margin-left: 30px;
}


.input-connector:not([connected]), .output-connector:not([connected]) {
    background-color: #00000003;
    border: 1px dashed #000000c7;
}

.input-connector[connected], .output-connector[connected] {
    background-color: #53c53dba;
    border: 1px dashed #000000c7;
}

.output-connector, .input-connector {
    width: 20px;
    height: 20px;
    border-radius: 25px;
    transition: all 200ms;
    margin-right: 15px;
    position: absolute;
    left: -32px;
    top: 50%;
    transform: translate(0, -50%);
    text-align: center;
}


.output-connector:not([connected]):not(.no-connect):hover, .input-connector:not([connected]):not(.no-connect):hover {

    cursor: crosshair;
    border: 1px solid #000000c7;
}

.edit-automation span.object-select {
    margin-left: auto;
}

.edit-automation canvas {
    position: absolute;
    z-index: 2;
    pointer-events: none;
}


.modal.select-action {
    width: 600px;
    height: 400px;
}

.output-connector::before, .input-connector::before {
    top: 4px;
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -49%);
    font-size: 12px;
}

.output-connector::before {
   transform: translate(-50%, -45%);
}

.edit-automation li[category]>ul {
    margin-left: 40px;
    width: calc(100% - 41px);
}

.edit-automation li[category]>ul>li:last-of-type {
    border-bottom: 1px solid #00000008;
}

.input-connector.no-connect {opacity: .2;}

.input-connector.no-connect:hover {}

.automation-action-bar {
    margin-right: 15px;
    cursor: grab;
    left: 15px;
    position: absolute;
}

.edit-automation [category] p:first-child {
    margin-left: 15px;
}

.modal.purchase-number {
    width: 1000px;
    height: 600px;
}

.button-bar.finish {
    position: absolute;
    margin: auto;
    width: fit-content;
    bottom: 50px;
    left: 50%;
    transform: translate(-50%, 0);
}
.configure-mailing textarea {
    min-height:200px;
    max-height:300px;
    resize:none;
}

.edit-phone.modal {
    width: 700px;
    height: 450px;
}

.communication-label {
    font-size: 10px;
    margin-bottom: 5px;
}

li.communication {
    display: flex;
}

.communication-footer {
    font-size: 10px;
    margin-top: 4px;
}

p.communication-recipients:hover, p.communication-attachments:hover {
    color: #3b8ff8;
}

.status-icon .load-throbber.relative {
    height: 30px;
    width: 30px;
    font-size: 16px;
}

.status-icon i.fa:hover {
    transform: scale(1.3);
    color: #3b3b3b !important;
}

.status-icon i.fa {
    transition: all 100ms;
}

.queue-select .transaction-item:first-of-type, .view-transaction .transaction-item:first-of-type {
    margin-top: 20px;
    margin-bottom: 50px;
}

ul[list][embedded-list] li {
    padding-left: 0px;
    padding-right: 0px;
}

.object-select[set][disabled] span {
    color: white;
}

.object-select[set][disabled]:hover {
    background-color: #4caf50;
    border: 1px dashed #4caf50;
}

.object-select[set][disabled] .fa-ban {}

.advanced-search.modal.fullscreen {
    width: 95%;
    height: 95%;
}

.advanced-search.modal.tall {
    height: 101%;
}

.personal-info li[flagged], .customer-info.notes li[flagged], .object-container li[flagged] {
    background-color: #ff8800;
    color: white !important;
}

.personal-info li[flagged] .fa:not(button .fa), .object-container li[flagged] .fa:not(button .fa) {
    color: white !important;
}

.object-select[flagged] {
    background-color: #ff9720;
    border: 1px dashed #ff9720;
}

.object-select[flagged]:not([no-change]):hover {
    background-color: #ffaf54;
    border: 1px solid #ffaf54;
}

.object-select[error] {
    background-color: #fb6f6f;
    border: 1px dashed #fb6f6f;
}

.object-select[error]:not([no-change]):hover {
    background-color: #ff8585;
    border: 1px solid #ff8585;
}

.remote-order .object-select {
    max-width: 300px;
}

.flex-v.special {
}

.personal-info .flex-v.special, .object-container .flex-v.special {
    position: absolute;
    left: 14px;
    text-align: center;
}

.personal-info .flex-v.special>*, .object-container .flex-v.special>* {
    margin-top: 5px;
    margin-bottom: 5px;
}

.personal-info .flex-v.special .bad-address {
    color: #c32929;
    font-size: 10px;
}

.customer.flagged i.fa-star {
    color: #3b3b3b;
}

.customer [category] .flex-v.special {
    position: absolute;
    left: 12px;
    text-align: center;
}

.customer.flagged i.fa.fa-exclamation-triangle {
    color: #c32929;
}

.customer [category] .flex-v.special>* {
    margin-top: 2px;
    margin-bottom: 2px;
}

.invoice iframe {
    width: 100%;
    height: 100%;
    border: unset;
}

ul li[icon-button] {
    width: 100px;
    height: 120px;
    border: 1px;
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    justify-content: space-around;
    margin: 10px;
    box-shadow: 0 0 3px 0 #0000002e;
    border-radius: 2px;
    cursor: pointer;
    transition: all 100ms;
}

ul li[icon-button] .fa {
    font-size: 30px;
}

li[icon-button]:hover {
    background-color: #68a4fd;
    color: white;
}

.transaction-item:first-of-type {
}

.remote-order .transaction-item:last-of-type {
    margin-bottom: 250px;
}

.modal.view-remote-order {
    width: 1000px;
    height: 600px;
}

.modal.payment-methods {
    width: 700px;
}

ul[embedded-list]>li {
    height: 40px;
}

.view-transaction .transaction-item {
    width: 600px;
}

.modal.setup-integration {
    width: 1100px;
    height: 700px;
}

.modal.integration-type-select {
    width: 800px;
    height: 500px;
}

.sidebar.path-vertical i.fa.fa-arrow-left.back {
    top: 22px;
    left: 25px;
}

.has-back-arrow.sidebar center h2 {
    width: 90%;
    margin-left: 10%;
}

.modal.oauth-window {
    width: 600px;
    height: 300px;
    padding: 20px;
}

.oauth-window h3 {}

.oauth-window ul {
    margin-top: 30px;
}

.oauth-window .fa-check {
    margin-right: 7px;
    padding-top: 7px;
    padding-bottom: 7px;
}

.customer.ui-list-item.individual.small.empty {
    filter: brightness(.6) blur(1px) !important;
    cursor: default !important;
}

.customer.ui-list-item.empty .customer-header, .campaign.ui-list-item.empty .campaign-header, .large-object.empty .object-header {
    cursor: default;
}

.customer.empty .assign {position: absolute;width: 100%;margin-top: 30px;}

.assign {}

.gift-giver-assign {
    position: absolute;
    top: 135px;
    left: 50%;
    transform: translateX(-50%);
    z-index: 3;
}

.customer.highlight-selected.flagged {}

.customer.highlight-selected.flagged .customer-header {
    background: rgb(128,46,240);
    background: linear-gradient(34deg, rgba(128,46,240,1) 0%, rgba(255,136,0,1) 100%);
}

.customer-left-side {
    width: 400px !important;
    border-right: 1px solid #d8d8d8;
    flex-shrink: 0;
}

.object-container .object-container-header {
    height: 45px;
    background-color: #f4f4f4b5;
    align-items: center;
    justify-content: space-between;
    border-bottom: 1px solid #e2e2e2;
}

.object-container {
    width: 100%;
    border-bottom: 1px solid #0000000f;
}

.customer-left-side {}

.alerts-bar {
    height: 50px;
}

.object-container:last-of-type {
    margin-bottom: 100px;
}

.flex-v.status-bar {
    height: 50px;
}

.flex-v.customer-left-hug {
    position: relative;
    box-shadow: inset 0 0 4px 0 #0000003b;
    width: 45px;
}

.status-item {
    color: white;
    width: 45px;
    height: 45px;
    transition: all 200ms;
    cursor: pointer;
}

.status-item>* {
    margin: auto;
}

.status-item.flag {
    background-color: #ff8800;
}

.status-item.flag:hover {background-color: #c26801;}

.customer-top-hug {
    background-color: white;
    border-bottom: 1px dashed #cacaca;
    height: 45px;
}

.status-item.grouped {
    background-color: #3e1874;
}

.status-item.duplicate {
    background-color: #aa0000;
}

.status-item.delete {
    background-color: #252525;
}

.status-item.flex.merge {
    background-color: #2359f0;
}

.status-item.history {
    background-color: #00805c;
}

.status-item:hover {
    filter: saturate(1.3);
}

.flex-h.hug-actions>* {
    border-right: unset;
    border-left: 1px solid white;
}

.object-container.names .object-container-header {
}

.flex-h.midway-tile {
}

.flex-v.midway-tile {
    min-width: 550px;
    flex-grow: 1;
    border-right: 1px solid #d8d8d8;
}

.customer-card .flex-h.right-tile {
    height: 100%;
    flex-grow: 1;
}

.object-container.transactions {padding-bottom: 0px;margin-bottom: 0px;}

.customer-top-hug {
    background-color: white;
}

.object-header .listing {
    max-width: 63%;
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
}

.object-container-header.superior-header {
    background-color: #fdfdfd;
}

.object-container.superior {
    height: 45px;
}

.itemlist.multiline {height: fit-content;min-height: 200px;overflow-y: scroll;max-height: 400px;}

.itemlist.multiline .contents {
    position: relative;
    flex-wrap: wrap;
    overflow-y: scroll;
    justify-content: center;
    margin-top: 10px;
}

.status-item.dedupe {
    background-color: #ff8d35;
}

.object-container.history .itemlist.multiline {
    width: 100%;
    border-radius: 0;
}

.status-item.flex.inbox {
    background-color: #438eb6;
}

.flex-left-sidebar {
    width: 400px;
    flex-shrink: 0;
    border-right: 1px solid #d8d8d8;
}

ul[list] li[selectable][selected] {
    background-color: #cce2ff;
}

ul[list] li[selectable][selected]::after {
    font-family: "Font Awesome 5 Free";
    content: "\f105";
    font-weight: 800;
    font-style: normal;
    font-variant: normal;
    text-rendering: auto;
    line-height: 1;
}

.button-bar.small button {padding: 3px;padding-right: 12px;padding-left: 13px;height: 27px;}

.default-tag {margin-left: 15px;background-color: #c2e2ff;padding: 3px 11px;border-radius: 4px;color: #0e83ec;}

.graph.minified {border: unset;padding: unset;height: 70px;width: 250px;}

.graph.minified .graph-body {padding: unset;}

.modal.preview-document {width: 95%;height: 80%;;}

.modal.select-transaction {width: 600px;;height: 600px;}

.preview-page-body {background-color: white;margin: 50px;padding: .5in;margin-top: 25px;border: unset;width: calc(100% - 100px - 1in);}

.preview-page-header {background-color: white;margin: 50px;padding: .2in;margin-bottom: 0px;padding-left: 0.5in;}

.attachment {background-color: white;padding: 20px;position: relative;margin-right: 15px;flex-grow: 0;flex-shrink: 0;margin-bottom: 15px;}

.attachment p {text-align: center;margin-bottom: 20px;margin-top: 15px;}

.attachment i.fa.fa-file-pdf {position: absolute;left: 10px;top: 10px;font-size: 15px;color: #00000061;}

.button-bar.bottom {position: absolute;left: 50%;transform: translateX(-50%);bottom: 30px;}

table {width: 100%;}

table td, table th {padding: 2px 10px 2px 10px;}

table tr:nth-child(odd) {}

table {border-collapse: collapse;}

table th {text-align: left;}

table td, table th {font-weight: lighter;border: 1px solid #c9c9c9;}

table th {font-weight: 400;color: black;}

.modal.select-advanced-search {width: 800px;height: 500px;}

.loop-access .output-connector {position: relative;left: unset;margin: unset;transform: unset;margin-left: 25px;}

.loop-access {display: flex;align-items: center;outline: 1px solid #e5e5e5;outline-offset: 7px;padding: 0px 12px;margin-left: 40px;}

.input-output .input-connector {top: 28%;}

.input-output .output-connector {top: 72%;}

.category.input-output {min-height: 40px;}

button.select.disabled {box-shadow: unset;}

button.select.disabled:hover {cursor: default;box-shadow: unset;}

/* CSS Document */

*{
	--main-blue: #1473ee;
}

*.demon-gradient{
	background: rgb(72, 136, 255);
	background: linear-gradient(45deg, #4892ff, #3d80ff);
}

@media screen and (max-width: 865px){
	.topbar .monitor-cluster{
        display:none !important;
    }
}

@media screen and (max-width: 1300px){
   .modal.flag-select.queue-select {
        width: 92%;
   }
}

@media screen and (max-width: 1100px){
   .modal.create-transaction {
        width: 92%;
   }
}

.finish-item:last-of-type {
    border-bottom: unset;
}

.search-sidebar.right {
    transform: unset !important;
}

i.mobile-search.fa.fa-search {
    display:none;
}


body {
	background-color:white !important;
	color:#3b3b3b;
	font-family: 'Montserrat', Helvetica, sans-serif;
}

input:not([type='radio']) {
    border-radius: 3px;
    border: none;
    box-shadow: 0 0 2px #00000073;
    width: 160px;
    padding-top: 5px;
    padding-bottom: 5px;
    padding-left: 20px;
    -webkit-appearance: none;
}

.button {
    white-space: nowrap;
    cursor: pointer;
    width: auto;
    width: -moz-fit-content;
    height: fit-content;
    background-color: var(--main-blue);
    color: white;
    border-radius: 5px;
    text-align: center;
    transition: all 100ms;
    padding: 0.5em 2em;
    display: flex;
    align-items: center;
    text-align: center;
}

.header {
    text-align: center;
    padding-top: 18px;
    font-weight: bold;
    color: #494949;
    display: flex;
    justify-content: center;
}

.load-throbber {
    left: 50%;
    top: 44%;
    transform: translateX(-50%) translateY(-50%);
    position: fixed;
    z-index: 30000;
    font-size: 26px;
    height: 60px;
    width: 60px;
}

.throbber {
    height: calc(100% - .4em);
    width: calc(100% - .4em);
    background-color: transparent;
    border-radius: 50%;
    border: .2em solid #ffffff00;
    border-top: .2em solid #303030;
    transition:100ms ease-in-out;
    animation: spin .7s ease-in-out infinite;
    position: relative;
    margin-top: 0em;
}

@-webkit-keyframes spin {
  0% { -webkit-transform: rotate(0deg); border-size:8px; }
  100% { -webkit-transform: rotate(360deg); }
}

@keyframes spin {
  0% { transform: rotate(0deg); }
  100% { transform: rotate(360deg); }
}


.login {
    width: 400px;
    height: 300px;
    left: 50%;
    top: 40%;
    position: absolute;
    transform: translate(-50%,-50%);
    box-shadow: 0px 1px 7px #00000085;
    border-radius: 3px;
    overflow: hidden;
}


.login__header-bar {
    width: 100%;
    height: 40px;
    background-color: #398fff;
    position:relative;
    z-index: 2;
}

.login__header-bar__header {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    padding-left: 30px;
    color: white;
    font-weight: bold;
}

.login__header-bar .reset {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    right: 30px;
    color: white;
    font-size: 10px;
    cursor: pointer;
    user-select: none; -webkit-user-select: none;
}

form.login__login-form {
    width: auto;
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    top: 30%;
}

form input {
    display: block;
    margin-top: 10px;
    width: 200px;
    top:31%;
}

.login__submit-button {
    bottom: 40px;
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    border-radius: 5px;
    text-align: center;
    cursor: pointer;
}

.topbar {
    width: 100%;
    transition: all 300ms;
    height: 50px;
    background-color: var(--main-blue);
    top: 0px;
    left: 0px;
    position: relative;
    z-index: 4;
    box-shadow: 0 0 5px #0000007a;
    display: flex;
    align-items: center;
    color: white;
}

.item.logout {
    float: right;
    margin-right: 30px;
}

.item.system {
    float: right;
    margin-right: 50px;
}

.topbar.main-topbar .item.search, .topbar.main-topbar>*:nth-child(3) {
}

.topbar .item, .detail-down .item, .topbar .display-item {
    color: white;
    font-size: 17px;
    font-weight: 100;
    position: relative;
    cursor: pointer;
    transition: all 200ms;
    transform: translateY(-6%);
    padding: 5px 15px 5px 15px;
    margin-top: 2px;
}

.user-detail {
    position: relative;
    color: white;
    font-weight: 100;
    font-size: 17px;
    cursor: pointer;
    width: fit-content;
    text-align: center;
    z-index: 2;
    user-select: none; -webkit-user-select: none;
    margin-right: 30px;
}

.threebar{
	display:none;
}

.detail-down {
    position: absolute;
    right: 10px;
    top: 50px;
    height: auto;
    width: 190px;
    background-color: rgb(66, 81, 255);
    box-shadow: 0px 1px 5px #0000007a;
    border-radius: 2px;
    z-index: 3;
    display: flex;
    flex-direction: column;
}

.detail-down .item {
    text-align: center;
    width: auto;
    margin: unset !important;
    top: unset;
    margin-top: 5px !important;
    font-size: 16px;
    padding-bottom: 15px;
    transform: unset;
}

.detail-down .item:first-of-type {margin-top: 15px !important;}

.detail-down .item:last-of-type {
}

.topbar .monitor-cluster {
    display: flex;
    overflow: visible;
    margin-left: auto;
}

.topbar.main-topbar .monitor-cluster {margin-left: auto;margin-right: 30px;padding-left: 30px;}

.topbar .monitor-item {
    width: auto;
    background-color: white;
    height: 30px;
    border-radius: 3px;
    cursor: pointer;
    display: inline-block;
    margin-right: 8px;
    position: relative;
    box-shadow: 0 0 3px #00000029;
    overflow: hidden;
    white-space: nowrap;
    flex-shrink: 0;
}

.topbar .monitor-item .fa {
    top: 50%;
    transform: translateY(-50%);
    position: absolute;
    margin-left: 6px;
    font-size: 13px;
}

.monitor-item .count {
    text-align: right;
    top: 50%;
    transform: translateY(-50%);
    position: relative;
    padding-left: 29px;
    padding-right: 8px;
    color: #3b3b3b;
}

.sidebar {
    position: absolute;
    left: 0px;
    width: 250px;
    transition: all 300ms;
    height: calc(100%);
    box-shadow: 2px -1px 6px #00000030;
    z-index: 3;
    background-color: white;
    overflow-y: scroll;
display: flex;flex-direction: column;}

.sidebar .item {
    text-align: left;
    padding-top: 10px;
    padding-left: 20px;
    cursor: pointer;
    padding-bottom: 10px;
    position: relative;
    transition: all 100ms;
}

.sidebar .item:nth-child(2) {
    margin-top: 27px;
}

.sidebar .item:hover {
    background-color: #e9e9e9;
}

.sidebar .item.open {
    background-color: #56a6fd;
    color: white;
}

.sidebar .item i.fa.fa-angle-right {
    opacity: 0;
    transition: opacity 100ms;
    right: 8px;
    position: absolute;
    top: 50%;
    color: white;
    transform: translateY(-50%);
}

.sidebar .item.open i.fa-angle-right {
    opacity: 1;
}

body>.management, body .account-info-data{
    width: 100%;
    position: absolute;
    top: 50px;
    height: calc(100% - 50px);
    overflow-y: scroll;
    overflow-x: hidden;
}


.sidebar-page .header {
    font-size: 17px;
}

.user-list {
    transform: translateX(-50%);
    position: absolute;
    left: 50%;
    width: fit-content;
    margin-top: 30px;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
}

.user-list .user {
    background-color: #ffffff;
    width: 200px;
    height: 100px;
    color: #3b3b3b;
    position: relative;
    margin: 10px;
    box-shadow: 0 0 5px #0000006b;
    border-radius: 6px;
}

.user-list .user i.fa.fa-user {
    display: inline-block;
    margin-right: 2px;
    margin-left: 2px;
}

.user-list .user .username {
    display: inline-block;
    font-size: 13px;
    margin-right: 0px;
    margin-left: 0px;
}

.user-list .user .mid {
    text-align: center;
    top: 37%;
    transform: translateY(-50%);
    position: absolute;
    width: 100%;
}

.user-list .user .actions {
    position: absolute;
    bottom: 20px;
    left: 50%;
    transform: translateX(-50%);
}

.user-list .user .actions>* {
    margin-left: 10px;
    margin-right: 10px;
    cursor: pointer;
}

.user-list .admin,.user-list .pending {
    right: 11px;
    position: absolute;
    top: 5px;
    font-size: 10px;
}

.add:not(button) {
    display: block;
    position: relative;
    left: 12%;
    cursor: pointer;
    position: relative;
    width: fit-content;
    width: -moz-fit-content;
}

.add:not(button) * {
    margin-left: 5px;
    margin-right: 5px;
}

.darken {
    width: 125%;
    height: 100%;
    position: fixed;
    top: 0px;
    left: 0px;
    z-index: 4;
    background-color: #0000005e;
}

.new-user, .new-mailmerge, .new-backing {
    position: fixed;
    left: 50%;
    top: 50%;
    transform: translate(-50%,-50%);
    width: 500px;
    height: 310px;
    background-color: white;
    overflow: hidden;
    border-radius: 3px;
}

.content {
    width: 100%;
    height: 100%;
    transition: all 400ms;
    position: absolute;
    overflow-y: scroll;
    overflow-x: hidden;
    top: 0px;
    left: 0px;
    transform: translate(0,0);
}

.content.left {
    transform: translate(-100%);
}

.content.right {
    transform: translateX(100%);
}

.management .create.button {
    bottom: 39px;
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
}

.new-user input.username {
    width: 200px;
    left: 50%;
    position: absolute;
    transform: translateX(-50%);
    margin-top: 55px;
}

.new-user input.creation {
    width: 200px;
    position: relative;
    display: inline-block;
    position: relative;
    left: unset;
    margin-top: unset;
}

input[type="checkbox"] {
    border: none;
    box-shadow: none;
    width: auto;
    -webkit-appearance: checkbox;
}

.admin-select {
    left: 50%;
    transform: translateX(-50%);
    top: 135px;
    width: 150px;
}

.user-list .pending {
    left: 11px;
}

.new-user div.creation {
    margin-top: 96px;
    position: absolute;
    left: 50%;
    white-space: nowrap;
    transform: translateX(-50%);
}

.new-user .creation * {
}

.new-user .creation .fa-clipboard {
    cursor: pointer;
    position: absolute;
    margin-left: 12px;
    margin-top: 2px;
}

.monitor-cluster .monitor-extension {
    position: absolute;
    width: 200px;
    height: 106px;
    background-color: #446aff;
    left: 50%;
    transform: translateX(-50%);
    top: 49px;
    box-shadow: 0 0 10px #00000052;
    border-radius: 4px;
    cursor: default;
}

.monitor-cluster .monitor-extension::after {content: "";width: 18px;height: 18px;position: absolute;top: -5px;left: 50%;transform: translateX(-50%) rotate(45deg);background-color: #446aff;z-index: -1;}

.monitor-extension .active-series-item {
    color: white;
    text-align: center;
    margin-top: 10px;
    position: absolute;
    width: calc(100% - 67px);
    right: 0px;
    height: 100%;
}

.left-image,.right-info {
    display: inline-block;
    position: absolute;
}

.right-info {
    position: absolute;
    left: 0px;
    margin-top: 0px;
    text-align: center;
    width: 100%;
    font-size: 5px;
    height: 35px;
    align-items: center;
    display: flex;
    justify-content: center;
}

img.left-series-item-img {
    height: 86px;
    margin-top: 9px;
    border-radius: 3px;
    margin-left: 13px;
    object-fit: fill;
    border-radius: 4px;
    overflow: hidden;
}

.monitor-extension .right-info .series-item {
    color: white;
    margin-top: 1px;
    font-size: 12px;
    font-weight: 100;
    text-align: center;
    margin-left: 5px;
    margin-right: 5px;
}

.monitor-extension .button.manage-series-item {
    font-size: 13px;
    height: 17px;
    width: 96px;
    background-color: white;
    color: black;
    bottom: 22px;
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
}

.sidebar-page .list-container, .new-mailing .list-container, .letter-selector .list-container, .content.printing .list-container {
    width: 80%;
    left: 10%;
    display: flex;
    position: absolute;
    margin-top: 60px;
    justify-content: center;
    flex-wrap: wrap;
}

*:not(.letter-viewer)>.letter {
    position: relative;
    width: 150px;
    height: 200px;
    background-color: white;
    border-radius: 4px;
    color: #3b3b3b;
    margin-right: 20px;
    margin-left: 20px;
    margin-bottom: 40px;
    box-shadow: 0 0 7px #0000004a;
}

.letter>i.fa {
    font-size: 40px;
    left: 50%;
    position: absolute;
    transform: translateX(-50%);
    top: 30%;
}

.letter .header {
    font-size: 10px;
    font-weight: lighter;
    margin: 0px 5px;
}

.letter .actions {
    white-space: nowrap;
    position: absolute;
    bottom: 30px;
    left: 50%;
    transform: translateX(-50%);
}

.letter .actions * {
    margin-left: 10px;
    margin-right: 10px;
    cursor: pointer;
}

.letter .letter-id {
    position: absolute;
    width: 100%;
    text-align: center;
    top: 54%;
    font-size: 10px;
}

.sidebar.left, .search-sidebar.left, .history-sidebar.left {
    transform: translateX(-100%);
}

.search-sidebar,.history-sidebar {
    transition: all 300ms;
    width: 250px;
    height: calc(100%);
    position: absolute;
    left: 0px;
    background-color: white;
    box-shadow: 2px -1px 6px #00000030;
    overflow: scroll;
    z-index: 2;
    display: flex;
    flex-direction: column;
}

.primary-info input {
    position: relative;
    margin: auto;
    width: 190px;
}

.primary-info .info-box {
    margin-top: 9px;
    position: relative;
    height: 22px;
    display: flex;
}

.primary-info .info-box:first-of-type {
}

.search-sidebar .primary-info {
    margin-top: 3px;
    margin-bottom: 20px;
}

.search-sidebar .info-box.separator {
    margin-top: 30px;
}

body>.customer-list,body>.customer-card {
    left: 250px;
    position: absolute;
    top: 50px;
    width: calc(100% - 250px);
    height: calc(100% - 50px);
    z-index: -2;
    transform: rotate(0deg);
    overflow-x: hidden;
}

.customer-list .list {
    width: 90%;
    margin-top: 36px;
    left: 50%;
    transform: translateX(-50%);
    position: absolute;
    min-width: 500px;
    max-width: 900px;
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
}

.customer, .large-object {
    background-color: #ffffff;
    overflow: hidden;
    cursor: pointer;
    position: relative;
    margin-bottom: 9px;
    display: flex;
    flex-direction: column;
    box-shadow: 0 0 7px #00000047;
    border-radius: 5px;
    font-weight: 100;
    font-size: 12px;
    width: 340px;
    margin: 10px;
}

.customer .customer-header i.fa, .large-object i.fa {
    padding-left: 20px;
    color: #5266ff;
    top: 20px;
    left: 20px;
}

.customer .item {
    padding-left: 20px;
    display: inline-block;
    vertical-align: middle;
}

.customer .name {
}

.customer .item.address {
    font-size: 12px;
    position: absolute;
    padding-right: 23px;
    right: 0px;
    max-width: 50%;
    text-align: right;
}

.customer .mid {
    top: 50%;
    position: absolute;
    transform: translateY(-50%);
    width: 100%;
}

.customer-card .card-names {
    position: relative;
    color: black;
    width: fit-content;
    display: flex;
    z-index: 1;
    flex-direction: column;
}

.identity .card-names .card-name, .identity .credential-identity {
    transition: all 300ms;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #3b3b3b;
    padding-top: 10px;
    border: 1px solid #3b3b3b;
    padding-bottom: 10px;
    padding-left: 20px;
    padding-right: 20px;
    border-radius: 6px;
    height: fit-content;
    font-size: 16px;
    margin-bottom: 10px;
    background-color: white;
    height: 18px;
}

.customer-card .record-type i.fa {
    color: #2e34cf;
    margin-left: 10px;
}

.customer-card .main>.actions, .customer-card .main>.status {
    position: absolute;
    right: 16px;
    top: 16px;
    padding: 11px;
    z-index: 1;
    color: white;
    display: flex;
    flex-direction: column;
    text-align: center;
}

.customer-card .main>.actions * {
    margin-bottom: 17px;
    color: #3d3d3d;
    font-size: 21px;
    cursor: pointer;
}

.customer-card .actions *:last-of-type, .customer-card .status *:last-of-type {
    margin-bottom: unset;
}

.card-names .account-detail {
    color: black;
}

.customer-card .account-status {display: inline-block;margin-left: 30px;}

.customer-info {
    position: relative;
    width: 400px;
    padding-bottom: 29px;
    margin-left: 20px;
    margin-right: 20px;
    z-index: 1;
    height: fit-content;
    margin-top: 20px;
    height: -moz-fit-content;
}

.customer-info .item {
    left: 50%;
    position: relative;
    transform: translateX(-50%);
    margin-top: 3px;
    margin-left: 10px;
    height: 24px;
}

.customer-info .item * {
    top: 50%;
    position: absolute;
    transform: translateY(-50%);
}

.customer-info .item .title {position: absolute;left: 25px;width: 100px;font-size: 14px;}

.customer-info .item input {
    right: 30px;
    height: 11px;
    width: 186px;
}

.customer-info .item:nth-child(3) {
    margin-top: 20px;
}

.customer-card .tags:not(.object-container) {
    position: relative;
    display: inline-block;
    width: auto;
    height: 20px;
    margin-left: 34px;
}

.customer-card .tags .tag {
    display: inline-block;
    margin-right: 8px;
    padding-left: 10px;
    padding-right: 10px;
    padding-top: 5px;
    padding-bottom: 5px;
    background-color: #297be5;
    color: white;
    border-radius: 2px;
}

.customer-info.notes {
    width: 380px;
    margin-top: 20px;
    min-height: 100px;
    margin-bottom: 20px;
}

i.fa.fa-arrow-left.back {
	cursor:pointer;
	position: fixed;
	left: 22px;
	top: 21px;
	font-size: 20px;
	z-index: 1;
}

.customer-card .pii-container {margin-top: 20px;display: flex;justify-content: space-evenly;padding-left: 50px;padding-right: 50px;flex-wrap: wrap;}

.customer-card .transactions, .open-documents .documents, .customer-card .campaigns {
    position: relative;
    background-color: #ffffffc4;
    margin-bottom: 50px;
    padding-bottom: 30px;
    padding-top: 30px;
    margin-bottom: 20px;
}

body {
    overflow: hidden;
    transition: all 300ms;
    transform: scale3d(1,1,1);
    top: 0px;
    left: 0px;
    height: 100%;
    width: 100%;
    position: fixed;
    margin: unset;
}

.transaction, .customer-card .document {
    height: 50px;
    margin-top: 15px;
    width: 100%;
    position: relative;
    background-color: #ffffff;
    color: #3b3b3b;
    cursor: pointer;
    white-space: nowrap;
    display: flex;
    align-items: center;
    box-shadow: 0 0 5px #00000040;
    border-radius: 6px;
    font-size: 13px;
    font-weight: lighter;
}

.transaction .item,.document .item,.log .item {
    position: relative;
    margin-left: 10px;
    display: flex;
    align-items: center;
    color: #3b3b3b;
    max-width: 215px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    padding-right: 10px;
}

.transaction>i.fa, .open-documents .document>i.fa, .open-documents .document>i.fas {
    position: relative;
    margin-left: 20px;
}

.transactions .fa-clock-o {
    margin-right: 6px;
}

.customer-card .new {
    position: absolute;
    margin-top: 20px;
    margin-left: 20px;
    color: #313131;
    cursor: pointer;
    user-select: none; -webkit-user-select: none;
}

.customer-card .transactions .header {
    margin-bottom: 33px;
}

.new-transaction, .new-document, .add-manual-history-items {
    width: 550px;
    height: 400px;
    top: 47%;
    transform: translate(-50%,-50%);
    left: 50%;
    position: absolute;
    background-color: white;
    z-index: 4;
    border-radius: 3px;
    overflow: hidden;
}

.new-transaction .header {
    position: relative;
    width: 100%;
}

.transaction-types {
    left: 50%;
    transform: translateX(-50%);
    margin-top: 60px;
    position: relative;
    width: 250px;
    justify-content: center;
    display: flex;
    flex-wrap: wrap;
}

.transaction-type {
    width: 100%;
    text-align: center;
    padding-top: 5px;
    padding-bottom: 5px;
    padding-left: 20px;
    padding-right: 20px;
    background-color: white;
    color: #3b3b3b;
    cursor: pointer;
    margin-top: 10px;
    border-radius: 5px;
    box-shadow: 0 0 6px #00000040;
}

.payment-info {
    position: relative;
    left: 60px;
    width: fit-content;
    height: 22px;
    display: flex;
    align-items: center;
}

.payment-info select.payment-type {margin-right: 20px;}

.payment-info input {
    margin-right: 10px;
    width: 90px;
}

.payment-info input:last-of-type {
    margin-right: unset;
    width: 100px;
}

.section {
    padding-left: 36px;
    font-size: 15px;
    font-weight: bold;
    color: #656565;
    margin-top: 11px;
    margin-bottom: 10px;
}

.section:first-of-type {
    margin-top: 52px;
}

.campaign-data {
    left: 60px;
    position: relative;
}

.shipping-note {
    height: 48px;
    width: 320px;
    background-color: white;
    box-shadow: 0 0 6px #00000036;
    padding: 10px;
    padding-top: 10px;
    overflow-y: scroll;
    text-align: left;
    border-radius: 7px;
}

.gift-giver {
    font-size: 13px;
    color: #545454;
    left: 60px;
    position: relative;
}

.next {
    position: absolute;
    width: 40px;
    height: 40px;
    background-color: #2c88f0;
    border-radius: 100%;
    color: white !important;
    bottom: 20px;
    left: 50%;
    transform: translateX(-50%);
    cursor: pointer;
    user-select: none; -webkit-user-select: none;
    transition: background-color 200ms;
}

.next i {
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%,-50%);
}

input.error,.error {background-color: #e83c3c2b !important;}

.new-transaction i.back {
    top: 19px !important;
    left: 23px !important;
}

.finish-list {
    left: 50%;
    transform: translateX(-50%);
    position: relative;
    transition: height 200ms;
    overflow-y: hidden;
    height: fit-content;
    height: -moz-fit-content;
    padding: 1px;
}

.finish-item {
    padding-left: 30px;
    padding-right: 30px;
    position: relative;
    padding-top: .8em;
    padding-bottom: .8em;
    border-bottom: 1px solid #ececec8f;
    display: flex;
    align-items: center;
    justify-content: space-between;
    font-weight: lighter;
}

.switch {
    transition: background-color 200ms;
    width: 40px;
    height: 22px;
    border-radius: 27px;
    background-color: lightgrey;
    display: inline-block;
    position: relative;
    user-select: none; -webkit-user-select: none;
}

.switch:not(.true)::after {transform: translateY(-48%);left: 3px;}

.switch::after {
    content: "";
    height: 17px;
    width: 17px;
    background-color: white;
    position: absolute;
    border-radius: 100%;
    transition: all 200ms;
    top: 50%;
}

.switch.true::after {transform: translateY(-48%);left: calc(100% - 20px);}

.switch.true {
    background-color: #63c363;
}

.finish-item>* {
    display: inline-block;
}

.finish-item>.switch, .finish-item>input, .finish-item>.assignment, .finish-item>.value, .finish-item>select, .finish-item>.button {
    cursor: pointer;
    text-align: right;
    display: flex;
    align-items: center;
}

li>.switch, li>input, li>.assignment, li>.value,li>select, li>.button {
    display: flex;
    align-items: center;
    margin-left: auto;
    flex-shrink: 0;
}

.new-transaction .button.create {
    bottom: 30px;
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
}
.pii-container .customer-info i.fa.fa-pencil-alt {
    position: absolute;
    top: 12px;
    right: 14px;
    cursor: pointer;
}

.pii-container.customer-container {
    left: 50%;
    transform: translate(-50%,-50%);
    position: absolute;
    top: 54%;
    z-index: 1;
}

.customer-container .card-names {
    color: white;
    width: 50%;
    left: 50%;
    transform: translateX(-50%);
    position: relative;
    margin-bottom: 20px;
    z-index: 1;
}

.customer-container .customer-info.pii .fa-pencil-alt {
    display: none;
}

.customer-container .button.create {
    left: 50%;
    position: relative;
    transform: translateX(-50%);
    margin-top: 37px;
}

i.fa.fa-arrow-left.back.body {
    top: 80px;
}

.card-names i {
    color: #585858;
    cursor: pointer;
    padding-right: 5px;
    padding-left: 5px;
    margin-left: auto;
}

*:not(.pii-container)>.card-names>.card-name[contenteditable] {
    background-color: #416bffb8;
}

.customer-card .content.settings .finish-list {
    width: 56%;
    min-width: 450px;
}

.confirm {
    background-color: white;
    width: 483px;
    height: 221px;
    position: absolute;
    top: 46%;
    transform: translateY(-50%) translateX(-50%);
    left: 50%;
    border-radius: 3px;
    z-index: 15 !important;
    padding: 10px 20px;
}

.confirm .description {
    text-align: center;
    margin-top: 30px;
}

.confirm .button.confirm-button {
    bottom: 30px;
    position: absolute;
}

.confirm .button.confirm-button.cancel {
    left: 50px;
}

.button.confirm-button.continue {
    right: 50px;
}

.not-found {
    position: absolute;
    width: 300px;
    height: auto;
    top: 40%;
    left: 50%;
    transform: translateX(-50%) translateY(-50%);
    background-color: white;
}

.not-found i {
    font-size: 70px;
    text-align:  center;
    width: 100%;
    color: #b83b3b;
}

.recent-series-item-large,.new-series-item-large {
    position: relative;
    width: 500px;
    height: 200px;
    margin-top: 25px;
    box-shadow: 0 0 9px #0000002b;
    border-radius: 3px;
    left: 50%;
    transform: translateX(-50%);
}

.recent-series-item-large.first {
    margin-top: 50px;
}

.series-item-image img,.series-item-image {
    height: 175px;
    max-width: 125px;
    object-fit: contain;
}

.series-item-image {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    margin-left: 14px;
    border-radius: 3px;
    overflow: hidden;
    height: 175px;
    max-width: 165px;
}

.right-container {
    width: calc(100% - 125px);
    left: 125px;
    position: absolute;
    height: 100%;
}

.recent-series-item-large .actions {
    position: absolute;
    bottom: 10px;
    right: 10px;
}

.customer-list .actions>* {
    cursor: pointer;
    margin-top: 20px;
}

.recent-series-item-large .container-item,.new-series-item-large .container-item {
    margin-top: 20px;
    left: 50%;
    transform: translateX(-50%);
    white-space: nowrap;
    position: relative;
    width: fit-content;
    display: block;
    width: -moz-fit-content;
}

.right-container .container-item>* {
    display: inline-block;
    margin-right: 13px;
}

.right-container input {
    display: inline-block;
}

.container-item.link {
    color: #005ccf;
    cursor: pointer;
}

.recent-series-item-large.first .actions {
    bottom: unset;
    right: unset;
    width: 100%;
}

.recent-series-item-large .finish-item {
    margin-top: 15px;
}

.button.makeactive {
    left: 50%;
    transform: translateX(-50%);
    position: relative;
    margin-top: 20px;
}

.recent-series-item-large.first .container-item {
    margin-top: 10px;
}

.recent-series-item-large:last-of-type {
    margin-bottom: 50px;
}


.sidebar.orders .item {
    font-size: 12px;
}

.order-fill {
    position: absolute;
    left: 250px;
    top: 50px;
    width: calc(100% - 250px);
    height: calc(100% - 50px);
    overflow: hidden;
}


.settings-group {
    left: 50%;
    transform: translateX(-50%);
    position: relative;
    width: fit-content;
    margin-top: 45px;
    box-shadow: 0 0 4px #0000004a;
    width: -moz-fit-content;
}

.settings-item {
    width: 492px;
    height: 40px;
    padding-left: 75px;
    line-height: 40px;
    background-color: #ffffff;
    border-bottom: 1px solid #dedede;
    cursor: pointer;
}

.settings-group .title {
    font-weight: bold;
    color: #464646;
    padding-left: 20px;
    margin-bottom: 10px;
    position: absolute;
    top: -25px;
}

.settings-item:last-of-type {
    border-bottom:unset;
}

.settings-item::after {content: "\f105";position: absolute;font-family: "Font Awesome 5 Free", "Font Awesome 5 Pro";font-weight: 900;right: 25px;color: #3a3a3a;}

.setting-page .finish-list {
    width: 60%;
}

.new-mailmerge .letter {
    cursor:pointer;
}

.new-mailmerge .letter.upload {
    position: absolute;
    left: 50px;
    bottom: 30px;
    height: 150px;
}

.new-mailmerge .letter.create {
    right: 50px;
    position: absolute;
    bottom: 30px;
    height: 150px;
}

.new-mailmerge .letter .desc {
    position: absolute;
    width: 100%;
    text-align: center;
    color: #3b3b3b;
    top: 65%;
    font-size: 10px;
}

.html-upload input[type="file"] {width: 200px;display: inline-block;}

.content.html-upload .button.upload {
    position: absolute;
    bottom: 30px;
    left: 50%;
    transform: translateX(-50%);
}

.new-mailmerge .letter-name {
}

.letter-viewer {
    position: relative;
    background-color: #f0f0f0;
    width: fit-content;
    max-width: 9in;
    height: calc(100% - 40px);
    overflow: scroll;
    border-radius: 3px;
    display: flex;
    padding-top: 20px;
    padding-bottom: 20px;
    box-shadow: 0 0 5px #00000042;
}

.letter-viewer .letter {
    width: fit-content;
    position: relative;
    margin-top: 30px;
}

.letter-viewer .cmd-bar {
    width: 100%;
    height: 38px;
    box-shadow: 0px 0px 4px black;
    position: absolute;
    top: -12px;
}

.letter-viewer-modal .cmd-bar {
    position: relative;
    padding-top: 6px;
    padding-bottom: 16px;
    right: 0px;
    height: fit-content;
	height: -moz-fit-content;
    background-color: white;
    color: #3b3b3b;
    width: 50px;
    border-radius: 4px;
    display: flex;
    vertical-align: top;
    margin-left: 15px;
    white-space: normal;
    box-shadow: 0 0 6px #00000057;
    flex-direction: column;
    align-items: center;
}

.cmd-bar {}

.letter-viewer-modal .cmd-bar .fa {
    margin-top: 16px;
    margin-bottom: 6px;
}

.user-id-desc {
    text-align: center;
    font-size: 9px;
    width: fit-content;
    padding-top: 0px;
    padding-bottom: 5px;
    padding-left: 3px;
    padding-right: 3px;
}

.cmd-bar .switch {font-size: 11px;margin-top: -4px;margin-bottom: 10px;}

.letter-viewer-modal {
    top: 0px;
    width: fit-content;
    position: absolute;
    height: 86%;
    top: 53%;
    left: 50%;
    transform: translate(-50%,-50%);
    white-space: nowrap;
    z-index: 4;
    display: flex;
    justify-content: space-between;
    transition: all 300ms cubic-bezier(0.55, 0.09, 0.68, 0.53);
}

.letter-small {
    transform: scale(0.42) translateX(-50%) translateY(-50%);
    width: 7.5in;
    height: 10in;
    position: relative;
    margin: unset;
    top: 0px;
    overflow: hidden;
    overflow-y: scroll;
    transform-origin: 0 0;
    left: 50%;
    top: 48%;
    padding-left: 1in;
    padding-right: 1in;
    padding-top: .5in;
    box-shadow: 0 0 11px #0000003b;
}

.new-document {
}

.new-document .title, .campaign-email-send .send .title, .section-title {
    padding-left: 30px;
    font-weight: bold;
    color: #3b3b3b;
    font-size: 15px;
    margin-top: 30px;
}

.new-document .main-item,.section-item {
    padding-left: 60px;
    margin-top: 10px;
    font-size: 12px;
    display: inline-block;
}

.new-document .change {
    display: inline-block;
    font-size: 10px;
    padding-left: 11px;
    color: #2930d4;
    font-weight: bold;
    cursor: pointer;
}

.new-document .finish-list {
    max-width: 85%;
    margin-top: 10px;
}

.finish-item input {
    padding-right: 10px;
    cursor: text;
}

.new-document .button.create {
    position: absolute;
    bottom: 30px;
    left: 50%;
    transform: translateX(-50%);
}

.document .fa-clock-o {
    padding-right: 5px;
}

.documents .header {
    margin-bottom: 33px;
}

.revision, .sidebar-object {
    height: 40px;
    background-color: #f5f5f5;
    width: 100%;
    position: relative;
    color: #3b3b3b;
    cursor: pointer;
    padding: 2px 0px;
    transition: all 200ms;
    border-bottom: 4px solid white;
    flex-shrink: 0;
}

.history-sidebar .primary-info {
    margin-top: 15px;
}

.revision-date {
    transform: translateY(-50%);
    font-size: 12px;
    position: absolute;
    top: 50%;
    padding-left: 19px;
}

.revision-number {
    position: absolute;
    font-size: 12px;
}

.click {
    font-size: 14px;
    position: absolute;
    right: 18px;
    top: 50%;
    transform: translateY(-50%);
    cursor: context-menu;
}

.history-sidebar i.fa.fa-arrow-left {
    position: absolute;
    top: 20px;
    left: 14px;
}

.revision.open, .sidebar-object.open {
    background-color: #487ef8;
    color: white;
}

.revision:not(.open):hover, .sidebar-object:not(.open):hover {background-color: #487ef8b5;color: white;}

.log-list-bottombar {
    position: fixed;
    width: 100%;
    bottom: 0px;
    height: 55px;
    background-color: #5836ff;
    left: 0px;
}

.log-list-bottombar>.fa {
    color: white;
    font-size: 28px;
    top: 50%;
    transform: translateY(-50%);
    padding-right: 44px;
    padding-left: 44px;
    position: absolute;
    cursor: pointer;
}

.log-list-bottombar i.fa.fa-angle-right {
    right: 0;
}

.display-block {
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    width: 300px;
    height: 100%;
}

.log-list-bottombar .display-block * {
    color: white;
}

.log-list-bottombar .desc {
    width: 100%;
    text-align: center;
    font-size: 10px;
    margin-top: 5px;
}

.desc .goback {
    display: inline-block;
    color: #b7bdff;
}

.display-block-items>* {
    position: relative;
    display: inline-block;
    width: 50px;
    height: 50px;
}

.display-block .display-block-items {
    display: flex;
    justify-content: center;
    margin-top: 5px;
}

.display-block-items .fa {
    left: 50%;
    transform: translateX(-50%);
    position: relative;
}

.display-block-items .text {
    text-align: center;
    font-size: 10px;
}

.mid-modal {
    width: 300px;
    top: 40%;
    position: absolute;
    left: 50%;
    transform: translate(-50%,-50%);
    box-shadow: 0 0 12px #00000021;
}

.mid-modal .header {
    font-size: 15px;
}

.mid-modal div#flag-viewer {
    margin-top: 40px;
    margin-bottom: 25px;
    left: 50%;
    position: relative;
    transform: translateX(-50%);
}

.log {
    width: 80%;
    height: 45px;
    max-width: 900px;
    background-color: white;
    color: #3b3b3b;
    box-shadow: 0 0 7px #0000004a;
    position: relative;
    left: 50%;
    transform: translateX(-50%);
    margin-bottom: 14px;
    display: flex;
    border-radius: 6px;
    align-items: center;
}

.log:nth-child(2) {
    margin-top: 30px;
}

.log>i.fa.fa {
    padding-left: 17px;
    font-size: 12px;
}

.customer-card .item .fa, .item .fas {
    margin-right: 5px;
    margin-left: 5px;
    font-size: 8px;
}

.log .item:first-of-type {
    cursor: pointer;
    min-width: 279px;
}

.itemlist {
    position: relative;
    height: 200px;
    width: calc(100% - 20px);
    display: block;
    padding-left: 20px;
    padding-right: 20px;
    padding-top: 20px;
    padding-bottom: 14px;
    overflow: hidden;
    border-radius: 6px;
    border: 1px solid #00000014;
    box-shadow: inset 0 0 12px #0000001f;
    background-color: #fbfbfb;
}

.itemlist .item, .product-container .item {
    height: 160px;
    user-select: none; -webkit-user-select: none;
    min-width: 115px;
    width: 120px;
    border-radius: 3px;
    overflow: hidden;
    padding: 5px;
    padding-right: 10px;
    position: relative;
    transition: all 200ms;
}

.itemlist .item img, .itemlist .item .outline, .product-container .item img, .product-container .item .outline {
    border-radius: 5px;
    transition: 200ms filter;
    height: 100%;
    max-width: 85%;
    object-fit: contain;
    transition: all 200ms;
}

.itemlist .item>.fa, .product-container .item>.fa {
    position: absolute;
    color: white;
    z-index: 1;
    top: 40%;
    left: 50%;
    margin: unset;
    cursor: pointer;
    transform: translate(-50%,-50%);
    display: none;
}

.itemlist .item .modify, .product-container .item .modify  {
    position: absolute;
    top: 84%;
    left: 50%;
    transform: translateX(-50%);
    white-space: nowrap;
}

.itemlist .item .modify>*, .product-container .item .modify>* {
    display: inline-block;
}

.itemlist .item .modify>.fa, .product-container .item .modify>.fa {
    cursor: pointer;
}

.itemlist .item:hover>.fa, .product-container .item:hover>.fa {
    display: block;
}

.itemlist .order-item input {
    width: calc(70px - 25px);
}

.itemlist .order-item {
    width: 100%;
}

.itemlist .order-item .title, .product-container .order-item .title {
    width: 100%;
    text-align: center;
    font-size: 15px;
    font-weight: bold;
    margin-bottom: 5px;
    color: #4e4e4e;
}

.itemlist .order-item, .product-container .itemlist .order-item{
    top: 50%;
    transform: translateY(-50%) translateX(-50%);
    position: relative;
    height: 50px;
    left: 50%;
    width: fit-content;
}

.itemlist .order-item .fa-plus, .product-container .order-item .fa-plus  {
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    margin: unset;
    top: 54%;
    color: #2d2d2d;
    font-size: 20px;
    cursor: pointer;
}

.itemlist .new {
    position: fixed;
    z-index: 1;
    background-color: white;
    margin-left: -10px;
    padding-left: 7px;
    padding-right: 7px;
    width: fit-content;
}

.itemlist .new select.item-select {
    left: 50%;
    transform: translateX(-50%);
    position: relative;
}

.item[pos="1"] {
    margin-left: 156px;
}

.itemlist .item.new .desc {
    width: 100%;
    text-align: center;
    font-size: 10px;
}

.itemlist .item.new .desc.sel {
    margin-top: 5px;
}

.itemlist .item.new .desc.sel.success {
    color: green;
}

.order-pack {
    width: 60%;
    max-width: 1000px;
    height: 68%;
    background-color: white;
    z-index: 3;
    position: absolute;
    top: 53%;
    left: 50%;
    transform: translate(-50%,-50%);
    overflow: hidden;
}

.order-pack .itemlist {
    width: calc(80% - 20px);
    left: 10%;
    position: absolute;
    top: 43%;
    transform: translateY(-50%);
    padding-top: 22px;
    padding-bottom: 0px;
}

.order-pack .content.letters .letters, .order-pack .content.emails .letters {
    margin-bottom: 20px;
    left: 50%;
    transform: translateX(-50%);
    position: relative;
    width: calc(8.5in * .4);
    margin-top: 50px;
    margin-bottom: 100px;
}

.order-pack .letters .letter-small {
    top: 0px !important;
    transform: translateY(0px) scale(0.42) translateX(-50%);
    position: absolute;
}

.order-pack .title {
    position: absolute;
    top: 23%;
    transform: translateY(-50%);
    padding-left: 65px;
    font-weight: bold;
    color: #353535;
    font-size: 12px;
}

.itemlist .item .name {
    position: absolute;
    z-index: 1;
    color: white;
    font-size: 10px;
    width: auto;
    text-align: center;
    top: 19%;
    display: none;
    left: 50%;
    width: auto;
    transform: translateX(-50%);
}

.itemlist .item:hover .name {
    display: block;
}

.item.added {
}

.itemlist .item>.fa-check {
    color: green;
    display: block;
}

.itemlist .item.added img {
    filter: brightness(.25);
}


.itemlist .item:not(.added)>.fa-check {
    display: none;
}

.order-pack .letters embed {
    width: calc(8.5in * .4);
    height: calc(11in * .4);
    transform-origin: 0 0;
    margin-bottom: 30px;
    box-shadow: 0 0 13px #00000036;
}



.order-pack .content.letters .button {
    left: 50%;
    transform: translateX(-50%);
    position: relative;
}

.order-pack .content.main .finish {
    position: absolute;
    bottom: 30px;
    left: 50%;
    transform: translateX(-50%);
}

.new-transaction .itemlist, .add-manual-history-items .itemlist {
    margin-left:20px;
    width: calc(100% - 80px);
}

.donor-list {
    position: fixed;
    width: 500px;
    height: 600px;
    left: 50%;
    transform: translateX(-50%) translateY(-50%);
    top: 54%;
    background-color: white;
    z-index: 4;
    padding-left: 40px;
    padding-right: 40px;
    padding-top: 30px;
    overflow: scroll;
    padding-bottom: 20px;
}

.create-series-item {
    position: fixed;
    left: 50%;
    transform: translate(-50%,-50%);
    top: 50%;
    width: 600px;
    height: 432px;
    background-color: white;
    z-index: 4;
}

.create-series-item .button.finish {
    bottom: 30px;
    left: 50%;
    transform: translateX(-50%);
    position: absolute;
}

.create-series-item .title {
    padding-left: 60px;
    font-weight: bold;
    color: #444444;
    margin-top: 20px;
    font-size: 15px;
}

.create-series-item>input {
    margin-left: 49px;
    margin-top: 10px;
    width: 300px;
}

.create-series-item .container-item {
    margin-top: 0px;
    right: 0px;
}

.create-series-item .header[contenteditable] {
    color: #ca2311;
}

.campaign-card {width: 100%;left: 0;height: 100%;overflow: scroll;}

.campaign-setup {
    height: 479px;
    width: 620px;
    position: fixed;
    z-index: 4;
    left: 50%;
    top: calc(25px + 50%);
    transform: translateX(-50%) translateY(-50%);
    background-color: white;
    box-shadow: 0 0 9px #00000038;
    overflow: hidden;
    border-radius: 5px;
}

.campaign-setup .finish-list {
    margin-top: 10px;
    width: 100%;
}

.campaign .campaign-setup .main>.title {
    font-weight: bold;
    padding-left: 30px;
    margin-top: 20px;
    color: #2e2e2e;
}

select.populationsort, input.autoinclude,input.campaign-code {
    margin-left: 30px;
}

.campaign-setup .autoinclude .title {
    display: inline-block;
    margin-right: 20px;
}

.campaign-setup .main>.switch {
    margin-top: 10px;
}

.campaign-setup .population {
    display: flex;
    margin-top: 10px;
    margin-left: 40px;
}

.campaign-setup .modifications {
    position: relative;
    width: 90%;
    left: 5%;
    margin-top: 25px;
    max-height: 400px;
    height: 265px;
}

.campaign-setup .mod {
    width: 100%;
    height: 44px;
    background-color: #3ba7ff;
    color: white;
    margin-bottom: 10px;
    position: relative;
}

.campaign-setup .mod>* {
    position: relative;
    top: 50%;
    transform: translateY(-50%);
    margin-left: 20px;
    display: inline-block;
}

.campaign-setup .mod .fa-trash {
    position: absolute;
    right: 20px;
    cursor: pointer;
}

.campaign-setup .automod .fa-plus {
    position: absolute;
    top: 20px;
    right: 30px;
    cursor: pointer;
}

.new-automod {
    position: fixed;
    width: 500px;
    height: 231px;
    background-color: white;
    z-index: 4;
    top: 47%;
    left: 50%;
    transform: translate(-50%,-50%);
    border-radius: 5px;
}

.new-automod .title {
    padding-left: 30px;
    font-weight: bold;
    color: #454545;
    margin-top: 12px;
}

.new-automod select.order-type {
    margin-left: 31px;
    margin-top: 10px;
}

.new-automod select.clarification {
    margin-left: 20px;
}

input.price-change {
    margin-top: 10px;
    margin-left: 32px !important;
}

.new-automod input {
    width: 109px;
    margin-left: 10px;
}

.new-automod .button.finish {
    bottom: 22px;
    left: 50%;
    transform: translateX(-50%);
    position: absolute;
}

.campaign-setup .mod-item {
    height: 100%;
}

.campaign-setup .mod-item .mod-desc {position: absolute;text-align: center;font-size: 10px;margin-top: 2px;white-space: nowrap;left: 50%;transform: translateX(-50%);}

.campaign-setup .automod .mod input {
    top: 50%;
    position: relative;
    transform: translateY(-25%);
    width: 53px;
}

.campaign-setup .button.finish {
    position: absolute;
    bottom: 30px;
    left: 50%;
    transform: translateX(-50%);
}

.sidebar .fa-plus {
    position: absolute;
    right: 30px;
    top: 22px;
    cursor: pointer;
}

.sidebar .header {
    margin-bottom: 20px;
}

.campaign-setup .title-item {
    position: absolute;
    left: 257px;
    top: 85px;
}

input.autoinclude, input.campaign-code {
    margin-top: 17px;
}

.campaign-basic-info,.campaign-actions {
    display: inline-block;
    height: 100px;
    background-color: white;
    color: #3b3b3b;
    width: 300px;
    box-shadow: 0 0 10px #00000026;
    position: relative;
    margin-bottom: 14px;
    border-radius: 4px;
}

.code {
    text-align: center;
    font-weight: bold;
    color: #2a2a2a;
    top: 38%;
    position: absolute;
    width: 100%;
}

.campaign-desc {
    font-size: 10px;
    text-align: center;
    padding-top: 10px;
}

.campaign-card .campaign-basic-info .desc-container {
    bottom: 10px;
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
}

.campaign-basic-info .desc-container .desc-item * {
    display: inline-block;
}

.campaign-basic-info .desc-container .desc-item *:first-of-type {
    margin-right: 2px;
}

.campaign-basic-info .desc-container .desc-item {
    display: inline-block;
    margin-left: 5px;
    margin-right: 5px;
}

.campaign-basic-info i.fa.fa-cog {
    position: absolute;
    margin-left: 10px;
    margin-top: 10px;
    cursor: pointer;
}

.report-tiles {
    margin-left: 20px;
    margin-right: 20px;
    width: -webkit-fill-available;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
}

.report-tiles>.tile {margin-bottom: 20px;margin-right: 20px;}

.report-tiles>.tile.large {
    width: 100%;
    height: 100px;
    margin-bottom: 20px;
}

.report-tiles>.tile.small {
    width: auto;
    height: auto;
}

.campaign-card .actions {
    position: fixed;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    right: 50px;
    top: 20px;
    color: #3b3b3b;
    font-size: 17px;
    z-index: 2;
}

.email-send-dialog {
    width: 500px;
    left: 50%;
    position: absolute;
    top: 50%;
    transform: translate(-50%,-50%);
    height: 300px;
    background-color: white;
    z-index: 3;
    box-shadow: 0 0 9px #0000002e;
}

.load-throbber .fa {
    color: green;
    font-size: 18px;
    position: absolute;
    left: 50%;
    transform: translate(-50%,-12%);
    top: 50%;
}

.throbber.stop {
    animation: unset;
    opacity: 0;
}

.email-send-dialog .check-list .load-throbber {
    transform-origin: 0 0;
    transform: scale(.5,.5) translateY(-50%);
    left: unset;
    position: relative;
}

.check-list {
    width: 80%;
    height: auto;
    position: relative;
    left: 50%;
    transform: translateX(-50%);
    margin-top: 20px;
}

.check-list .check {
    height: 50px;
    position: relative;
    display: flex;
    justify-content: left;
    border-bottom: 1px solid #dfdfdf;
}

.action-text {
    line-height: 50px;
    font-size: 16px;
    text-align: right;
    width: -webkit-fill-available;
    white-space: nowrap;
    padding-right: 10px;
}

.load-throbber .fa-clock-o {
    color: #282828;
}

.email-send-dialog .check-list {
    top: 37%;
    transform: translate(-50%, -50%);
    position: absolute;
}

.email-send-dialog .button.close {
    position: absolute;
    bottom: 30px;
    left: 50%;
    transform: translateX(-50%);
}

.load-throbber .fa-times {
    color: red;
}

.email-send-dialog .button.error-manage,.email-send-dialog .button.error-close {
    position: absolute;
    bottom: 30px;
}

.email-send-dialog .button.error-close {
    left: 50px;
}

.email-send-dialog .error-manage {
    right: 50px;
}

.email-send-dialog .error-container .title {
    text-align: center;
    top: 46px;
    position: absolute;
    color: #800f0f;
    width: calc(100% - 20px);
    font-size: 10px;
    padding-left: 10px;
}

.tag-extra {
    position: absolute;
    color: white;
    border-radius: 3px;
    margin-left: 30px;
    top: 71px;
    font-size: 10px;
    display:flex;
    flex-wrap: wrap;
    max-width: 40%;
    justify-content: left;
}

.tag-extra .tag {
    background-color: #28952c;
    box-shadow: 0 0 3px #00000085;
    padding-top: 6px;
    padding-bottom: 6px;
    padding-left: 10px;
    padding-right: 10px;
    border-radius:3px;
    margin-bottom: 5px;
    margin-right: 10px;
    margin-right: 6px;
}


.content.open-settings .finish-list {
    width: 69%;
}

.campaign-card .actions>* {
    cursor: pointer;
    margin-left: 0px;
    margin-right: 20px;
}

.campaign-bar {
    width: 100%;
    height: 38px;
    left: 50%;
    transform: translateX(-50%);
    position: relative;
    background-color: #ffffff;
    color: #3b3b3b;
    box-shadow: 0px -2px 5px #00000033;
    display: flex;
    justify-content: center;
    margin-bottom: 50px;
    border-bottom: 1px solid #00000024;
}

.campaign-card .actions>*:last-of-type {
    margin-right: unset;
}

.campaign-bar .bar-item {
    position: relative;
    top: 50%;
    transform: translateY(-50%);
    display: inline-block;
    padding: 5px 20px;
    cursor: pointer;
    line-height: 29px;
    min-width: 100px;
    text-align: center;
    border-right: 1px solid #d6d6d6;
}


.campaign-tab {
    width: -webkit-fill-available;
    position: relative;
}

.campaign-tab.population .campaign-pop {
    width: 80%;
    left: 10%;
    position: relative;
    padding-top: 20px;
}

.campaign-pop .customer .name {
    cursor: pointer;
}

.campaign-pop .customer {
    cursor: default;
}

.campaign-actions .button {
    left: 50%;
    position: relative;
    transform: translateX(-50%);
    margin-top: 13px;
}

.campaign-email-send {
    position: fixed;
    width: 762px;
    height: 500px;
    left: 50%;
    top: 50%;
    transform: translate(-50%,-50%);
    background-color: white;
    z-index: 4;
    border-radius: 3px;
    overflow: hidden;
}

.campaign-email-send input.subject-line {
    margin-top: 20px;
    width: 300px;
    margin-left: 30px;
}

.campaign-email-send>.header {
    position: absolute;
    width: 100%;
}

.campaign-email-send .subhead {
    width: 100%;
    text-align: center;
    margin-top: 42px;
}

.campaign-email-send .invalid-emails {
    margin-top: 30px;
    width: 80%;
    left: 10%;
    height: 283px;
    position: relative;
    overflow: scroll;
    overflow-x: hidden;
    padding-right: 20px;
}

.campaign-email-send .finish-list {
    width: 80%;
    margin-top: 11px;
}

.campaign-email-send .list-container {
    overflow: hidden;
    overflow-y: scroll;
    max-height: 251px;
    margin-top: 10px;
}

.campaign-email-send .content:not(.send) .title {
    margin-top: 20px;
    text-align: center;
    font-weight: lighter;
}

.content.attachments .list-container {
    max-height: 303px;
}

.campaign-email-send .email-preview-address {
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    width: 250px;
    top: 27%;
}

.campaign-email-send .preview-address {
    margin-top: 10px;
    width: calc(100% - 20px);
}

.campaign-email-send .email-preview-address .button {
    left: 50%;
    position: relative;
    transform: translateX(-50%);
    margin-top: 22px;
    padding-left: 20px;
    padding-right: 20px;
}

.campaign-email-send .finish {
    left: 50%;
    position: absolute;
    transform: translateX(-50%);
    bottom: 30px;
}

input.schedule-send {
    margin-left: 20px;
}

.campaign-email-send .campaign-email-schedule {
    display: flex;
    position: relative;
    margin-top: 20px;
    margin-left: 40px;
}

.campaign-email-schedule .switch {margin-top: 2px;}

.campaign-email-send .letter.selected {
    background-color: #43a143;
}

.campaign-email-send .letter {
    cursor: pointer;
}

.order-pack .letters {
}

.letter-small.print {
    background-color: gray;
}

.letter-item {
    position: relative;
    width: calc(8.5in * .42);
    height: calc(11in * .42);
    margin-bottom: 20px;
}

.order-pack .button.finish {
    left: 50%;
    transform: translateX(-50%);
    position: relative;
    bottom: 20px;
}

.order-pack .letters .next {
    position: relative;
}

.new-document .preview .letter-item,.new-document .preview-email .letter-item {
    left: 50%;
    transform: translateX(-50%);
    margin-top: 30px;
}

.letter {
    white-space: normal;
}

.settings .print-backings, .choose-backing .print-backings {
    width: 80%;
    left: 10%;
    position: absolute;
    margin-top: 30px;
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
}

.print-backings .backing {
    width: 170px;
    height: 220px;
    box-shadow: 0 0 6px #00000047;
    margin-right: 20px;
    margin-left: 20px;
    margin-bottom: 40px;
    position: relative;
    transition: all 200ms;
    border-radius: 14px;
    overflow: hidden;
}

.print-backings .backing img {
    width: 100%;
    height: 100%;
    overflow: hidden;
    object-fit: cover;
}

.print-backings .backing .title {
    font-size: 11px;
    text-align: center;
    margin-top: 18px;
    position: absolute;
    width: 100%;
    color: white;
    z-index: 2;
}

.print-backings .actions {
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    display: flex;
    z-index: 2;
    color: white;
    top: 45%;
}

.print-backings .actions>* {
    margin-right: 20px;
    margin-left: 20px;
    font-size: 20px;
    cursor: pointer;
}

.print-backings .backing:hover {
}

.print-backings .backing:hover img {
    filter: brightness(0.3);
}

.print-backings .backing:not(:hover) .title {
    display: none;
}

.print-backings .backing:not(:hover) .actions {
    display: none;
}

.setting-page .content>i.fa.fa-plus {
    position: absolute;
    left: 40%;
}

.setting-page .add {
    top: 33px;
}

.new-backing .button {
    position: absolute;
    bottom: 30px;
    left: 50%;
    transform: translateX(-50%);
}

.new-backing input[type='file'] {
    top: 44%;
    width: 200px;
    left: 50%;
    position: absolute;
    transform: translateX(-50%);
}

.new-backing input.backing-name {
    position: relative;
    left: 50%;
    transform: translateX(-50%);
    margin-top: 50px;
    width: 200px;
}

.gift-search>* {
    display: inline-block;
    color: #2c6bdf;
    cursor: pointer;
}

.gift-search {
    padding-left: 5px;
    padding-right: 5px;
    position: relative;
    padding-top: 5px;
    padding-bottom: 5px;
    margin-top: 1px;
    font-size: 15px;
    margin-left: 55px;
    display: inline-block;
}

.gift-search .fa {
    margin-right: 5px;
    font-size: 12px;
    transform: translateY(-6%);
}

.assocview {
}

.assocview>* {
}

.search-sidebar .subtext {
    font-size: 11px;
    text-align: center;
    position: absolute;
    width: 100%;
}

.customer-card .associate {
    right: -30px;
    z-index: 2;
    position: absolute;
    transform: translateX(100%) translateY(-50%);
    top: 50%;
    white-space: nowrap;
}

.gift-giver .fa-trash {
    margin-left: 10px;
    cursor:pointer;
}

.merge-editor-body {
    position: fixed;
    top: 50px;
    width: 100%;
    left: 0px;
    height: calc(100% - 50px);
    background-color: #dadada;
    overflow-y: scroll;
    z-index: 1;
    overflow-x: hidden;
}

.letter-error {
    left: 50%;
    transform: translateX(-50%);
    position: absolute;
    top: 30%;
}

.letter-error i.fa.fa-exclamation-triangle {
    font-size: 50px;
    color: #ba1616;
    left: 50%;
    transform: translateX(-50%);
    position: relative;
}

.letter-error .text {
    margin-top: 20px;
}

.merge-letter-content {
    left: 50%;
    width: fit-content;
    position: relative;
    transform: translateX(-50%);
    margin-top: 60px;
    margin-bottom: 50px;
    outline: unset;
    transform-origin: 0 0;
}

.merge-letter-content.print{
    overflow: unset;
}

.merge-letter-content {}

.merge-letter-content .content {
    background-color: white;
    outline: unset;
    box-shadow: 0 0 9px #00000036;
}

.merge-letter-content .content {
    position: relative;
    overflow-y: scroll;
    overflow-x: hidden;
    margin-bottom: 70px;
}

.merge-editor-body .gbar {
    width: 100%;
    height: 50px;
    background-color: white;
    z-index: 2;
    transition: all 400ms;
    display: flex;
    position: relative;
}

.gbar {}

.merge-editor-body .gbar.shadow {
}

.gbar .action {
    position: relative;
    top: 50%;
    transform: translateY(-50%);
    display: inline-block;
    height: 20px;
    margin-right: 13px;
    padding: 3px;
    border-radius: 3px;
    cursor: pointer;
    color: #383838;
}

.gbar .action:first-of-type {
    margin-left: 20px;
}

.action>* {
    vertical-align: middle;
}

.gbar .action:hover {
    background-color: #e9e9e9;
}

.separator {
    border-radius: 3px;
    width: 1px;
    margin-left: 5px;
    margin-right: 13px;
    height: 24px;
    top: 50%;
    transform: translateY(-50%);
    position: relative;
    background-color: #d0d0d0;
}

.gbar .action.active {
    color: #3f8bff;
}

.ruler-top {
    z-index: auto;
    width: 100%;
    height: 15px;
    top: 100px;
    border-top: 1px solid #bdbdbd;
    border-bottom: 1px solid #bdbdbd;
}

.ruler-side {
    height: 100%;
    position: absolute;
    width: 15px;
    top: calc(50px + 17px);
    border-right: 1px solid #bdbdbd;
    border-left: 1px solid #bdbdbd;
    z-index: 0 !important;
}

.ruler {
    z-index: 2;
    background-color: white;
}

.merge-topbar {
    position: fixed;
    width: 100%;
    box-shadow: 0 0 7px #00000069;
    z-index: 3;
}

.insert-variable, .insert-text,.insert-link {
    width: 400px;
    height: 200px;
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
    background-color: white;
    box-shadow: 0 0 12px #00000047;
    z-index: 4;
    border-radius: 3px;
}

select {}

.insert-variable .button, .insert-text .button,.insert-link .button {
    left: 50%;
    transform: translateX(-50%);
    position: absolute;
    bottom: 30px;
}

.insert-variable input {
    left: 50%;
    transform: translateX(-50%);
    position: relative;
    margin-top: 29px;
}

.insert-text .code, .insert-text .text, .insert-link .code,.insert-link .text {
    width: 200px;
    left: 50%;
    top: 27%;
    transform: translateX(-50%);
    position: absolute;
    text-align: left;
    font-weight: normal;
}

.insert-text .text,.insert-link .text {
    top: 45%;
    width: 84%;
}

.gbar .action#settings {position: absolute;right: 10px;}

.page {
    width: -webkit-fill-available;
    height: -webkit-fill-available;
    outline: unset;
    position: absolute;
    -webkit-margin-collapse: discard;
}

.merge-editor-body .settings {
    height: calc(100% - 117px);
    width: 250px;
    position: fixed;
    top: 117px;
    right: 0px;
    background-color: #507fff;
    box-shadow: 0 0 7px #00000075;
    transition: all 300ms ease-in-out;
}

.merge-editor-body .settings.right {
    transform: translateX(100%);
}

.merge-editor-body .settings .header {
    color: white;
    margin-bottom: 10px;
}

.merge-editor-body .setting-item>* {
    display: inline-block;
    color: white;
    margin-top: 8px;
    vertical-align: middle;
    line-height: 20px;
}

.merge-editor-body .setting-item {
    padding-left: 15px;
    padding-right: 15px;
    display: flex;
    justify-content: space-between;
    margin-top: 8px;
    align-items: center;
}

.merge-editor-body .setting-item select {
    color: black;
}

.merge-editor-body .setting-item .button {
    font-size: 10px;
    width: 45px;
    height: 11px;
    line-height: 11px;
    color: black;
    background-color: white;
    min-width: unset;
}

.merge-editor-body div.setting-item#backing {
}

.merge-editor-body .settings .button.close {
    color: black;
    background-color: white;
    bottom: 30px;
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    font-size: 14px;
}

.merge-letter-content.landscape .content {
    width: 11in;
    height: calc(8.5in - 2in);
}

.choose-backing {
    width: 600px;
    height: 400px;
    left: 50%;
    transform: translate(-50%,-50%);
    position: fixed;
    top: 48%;
    z-index: 4;
    background-color: white;
    border-radius: 3px;
    overflow: scroll;
}

.choose-backing .print-backings {
    margin-top: 30px;
}


.choose-backing .backing {
    cursor: pointer;
}

.merge-letter-content.print .content {height: 11in;}

.merge-editor-body .settings input.letter-name {
    left: 50%;
    transform: translateX(-50%);
    position: relative;
    margin-top: 10px;
    margin-bottom: 20px;
}

.letter-viewer-modal .cmd-bar .fa-download, .letter-viewer-modal .cmd-bar .fa-print {
    color: #5151ff;
    cursor:pointer;
}

.bulk-import input[type="number"] {
    width: 61px;
    margin-right: 20px;
    text-align: center;
    padding-left: unset;
    padding-right: unset;
}

div#font-size input {
    width: 30px;
    text-align: left;
    padding-left: 10px;
    z-index: 3;
}

div#font-size:hover {
    background-color: unset;
}

#font-color .fa-font,#background-color .fa-highlighter {
    transform: translateY(-1px) scale(.88);
    transform-origin: 0 0;
}

#font-color .color-sample,#background-color .color-sample {
    width: 90%;
    height: 2px;
    background-color: #3ecde3;
    transform: translateY(-1.6px) translateX(-57%);
    left: 50%;
    position: relative;
}

.content.preview .fa-download {
    position: absolute;
    top: 20px;
    right: 44px;
    cursor: pointer;
    color: #3a3aff;
}

.user-access-settings {
    position: fixed;
    width: 800px;
    height: 600px;
    left: 50%;
    transform: translate(-50%,-50%);
    background-color: white;
    top: calc(25px + 50%);
    z-index: 4;
    border-radius: 6px;
    padding-bottom: 23px;
    box-shadow: 0 0 6px #0000003d;
    overflow-y: scroll;
}

.user-access-settings .finish-list {
    margin-top: 18px;
    width: 80%;
}

.campaign-tab.population i.fa.fa-download {
    position: absolute;
    right: 12%;
    top: 20px;
    color: #3578f4;
    cursor: pointer;
}

.log .item:nth-of-type(2) {
}

.welcome-dialog {
    width: 100%;
    height: 100%;
    position: fixed;
    top: 0;
    left: 50%;
    transform: translate(-50%,0px);
    background-color: #4892ff;
    box-shadow: 0 0 9px #00000061;
    border-radius: 3px;
    z-index: 3;
}

.welcome-dialog .header {
    color: white;
    font-size: 30px;
    top: 20%;
    position: relative;
}

.welcome-dialog .subhead {
    width: 100%;
    text-align: center;
    color: white;
    margin-top: 10px;
    position: absolute;
    top: calc(20% + 60px);
}

.welcome-dialog .content.main {
}

.welcome-dialog .next {
    background-color: white;
    bottom: 100px;
}

.field-export .main .header {
    padding-bottom: 20px;
    box-shadow: 1px 5px 5px #0000000f;
}

.welcome-dialog .content:not(.main) .header {
    top: 10%;
}

.welcome-dialog .content:not(.main) .subhead {
    top: calc(10% + 50px);
    width: 86%;
    left: 50%;
    transform: translateX(-50%);
}

.welcome-dialog .welcome-content {
    top: 25%;
    height: 75%;
    position: absolute;
    width: 100%;
}

.skip-onboard {
    color: white;
    text-decoration: underline;
    cursor: pointer;
    position: absolute;
    bottom: 50px;
    right: 100px;
    z-index: 1;
}

.welcome-dialog .back {
    color: white;
}

.qr {
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    width: 300px;
    height: 300px;
    background-color: white;
    border-radius: 3px;
    margin-top: 27px;
}

.welcome-dialog .button {
    color: black;
    background-color: white;
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    top: 14%;
}

.contact .welcome-content input {
    display: block;
    margin-bottom: 10px;
    width: 200px;
    padding: 10px;
    left: 50%;
    transform: translateX(-50%);
    position: relative;
}

.contact .welcome-content input:first-of-type {
    margin-top: 100px;
}

.welcome-dialog .button.finish {
    bottom: 100px;
    position: absolute;
    top: unset;
}

.attempt-twofactor-enable {
    background-color: white;
    width: 500px;
    height: 500px;
    z-index: 4;
    position: fixed;
    left: 50%;
    transform: translate(-50%,-50%);
    top: 50%;
    border-radius: 6px;
}

.attempt-twofactor-enable .subhead {
    font-size: 10px;
    text-align: center;
    margin-top: 2px;
    color: #4e4e4e;
    left: 50%;
    width: -webkit-fill-available;
    padding-left: 50px;
    padding-right: 50px;
}

.attempt-twofactor-enable canvas {
    width: 250px;
    height: 250px;
    left: 50%;
    transform: translateX(-50%);
    position: relative;
    margin-top: 41px;
    margin-bottom: 34px;
}

.attempt-twofactor-enable input[type="text"] {
    position: relative;
    left: 20%;
}

.attempt-twofactor-enable input {
    width: 231px;
    margin-top: 30px;
    margin-left: 30px;
}

.attempt-twofactor-enable .button {
    display: inline-block;
    margin-left: 20px;
}

.twofactor-enabled {
    width: 300px;
    left: 50%;
    position: absolute;
    transform: translateX(-50%);
    height: 50px;
    margin-top: 77px;
}

.subhead.twofa-sub {
    white-space: normal;
    max-width: 550px;
    left: 50%;
    transform: translateX(-50%);
}

.key-list .key-item {
    width: 200px;
    height: 64px;
    position: relative;
    color: #3b3b3b;
    padding-left: 20px;
    padding-right: 20px;
    padding-top: 10px;
    padding-bottom: 10px;
    display: flex;
    flex-direction: row;
    margin-bottom: 10px;
    padding: 16px 16px;
    margin: 10px;
    border-radius: 5px;
    box-shadow: 0 0 7px #0000004a;
    align-items: center;
    justify-content: center;
}

.key-list .key-item * {
    font-size: 12px;
}

.api-access .key-list {
    margin-top: 30px;
    flex-direction: row;
    display: flex;
    width: 100%;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
}

.key-list .key-item .private-key {
    min-width: 360px;
    filter: blur(3px);
    cursor: pointer;
    transition: all 200ms;
}

.key-list .key-item .fa-trash {
    cursor: pointer;
}

.key-list .key-item .public-key {
    min-width: 110px;
}

.pager {
    width: 175px;
    left: 0px;
    top: 117px;
    position: fixed;
    height: calc(100% - 117px);
    background-color: white;
    box-shadow: 0 0 4px #00000061;
    overflow: scroll;
    overflow-x: hidden;
    scroll-behavior: unset;
    -ms-overflow-style: none;
    z-index: 2;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: center;
}

.pager__page-item {
    width: 130px;
    margin-top: 11.46px;
    margin-bottom: 11.46px;
    height: 173px;
    background-color: white;
    position: relative;
    box-shadow: 0 0 4px #00000059;
    border-radius: 0px;
    flex-shrink: 0;
    flex-grow: 0;
}

.pager__page-item .title {
    text-align: center;
    padding-top: 10px;
    font-size: 12px;
}

.pager__page-item:last-of-type {
    margin-bottom: 500px;
}

.pager__page-item::-webkit-scrollbar {
    display: none;
}

.pager::-webkit-scrollbar {
    display: none;
}

.pager__page-item.new-page i.fa.fa-plus {
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%,-50%);
    font-size: 22px;
}

.pager__page-item.new-page {
    cursor: pointer;
}

.letter-viewer .pagebreak {
    width: 200%;
    height: 40px;
    left: 50%;
    transform: translateX(-50%);
    position: relative;
    background-color: gray;
}

.letter-viewer .merge-letter-content {
    left: 50%;
    margin-top: unset;
}

.letter-small .merge-letter-content {
    left: 50%;
    margin-top: unset;
}

.pager__page-item .fa-trash {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
    font-size: 20px;
    cursor: pointer !important;
}

.pager__page-item:not(.new-page) {cursor: grab;}

.letter-viewer .letter:not(.print) {
    width: 8in;
    background-color: white;
    padding-left: 1in;
    padding-right: 1in;
    padding-top: 1in;
    padding-bottom: 1in;
    margin-bottom: .5in;
    display: inline-block;
    height: fit-content;
	height: -moz-fit-content;
}

.letter-viewer .letter:not(.print) .pagebreak {
    background-color: unset;
    height: unset;
}

.insert-link .text {
    top: 35%;
}

.color-grid>*:not(.color-indicator) {
    background: linear-gradient(to right, #fff 0%,transparent 100%);
}

.color-grid>*:not(.color-indicator) {
	height: 100%;
	width: 100%;
	position: absolute;
	border-radius: 2px;
}

.to-white {
    background: linear-gradient(to bottom, transparent 0%, #000 100%) !important;
}

.insert-color {
	user-select:none;
	top: 50%;
	width: 200px;
	height: 310px;
	background-color: white;
	position: absolute;
	z-index: 4;
	left: 50%;
	transform: translate(-50%,-50%);
	border-radius: 5px;
}

.insert-color .output-color {
    width: 16px;
    height: 16px;
    background-color: green;
    border-radius: 100%;
}

.insert-color .label {
    padding-left: 12px;
    font-size: 12px;
    font-weight: lighter;
    color: #272727;
    margin-top: 12px;
}

.insert-color .color-output {
    height: 20px;
    margin-bottom: 28px;
    margin-top: 28px;
    display: flex;
    padding-left: 11px;
    position: relative;
}

.insert-color .color-output .label {
    margin-top: unset;
    line-height: 18px;
    padding-right: 10px;
    margin-left: unset;
    margin-right: unset;
    width: unset !important;
    margin-left: 20px;
}

.insert-color input {
    width: 50px;
}

.insert-color .color-grid {
    width: 90%;
    left: 5%;
    position: relative;
    height: 120px;
    border-radius: 4px;
    overflow: hidden;
    background-color: #ff0000;
}

.color-grid .color-indicator {
    position: absolute;
    z-index: 2;
}

.color-indicator {
	transform: translateY(-50%) translateX(-50%);
    height: 16px;
    position: relative;
    width: 16px;
    background-color: white;
    box-shadow: 0 0 7px #00000047;
    border-radius: 100%;
}

.color-grid .color-indicator{
	top:100%;
	left:0px;
}

.color-indicator .indicator {
    width: 12px;
    height: 12px;
	top:50%;
    background-color: #e91e1e;
    border-radius: 100%;
    left: 50%;
    transform: translate(-50%,-50%);
    position: absolute;
}

.insert-color .color-main {
    position: absolute;
    width: 89%;
    height: 12px;
    background-color: blue;
    border-radius: 11px;
    margin-top: 9px;
    left: 50%;
    transform: translateX(-50%);
    background: linear-gradient(to right, red 0%, #ff0 17%, lime 33%, cyan 50%, blue 66%, #f0f 83%, red 100%);
}

.insert-color .button {
    width: 50px;
    bottom: 17px;
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
}

.color-main .color-indicator {
    top: 50%;
}

.account-info:not(.item) {
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    width: 60%;
    margin-top: 18px;
    background-color: #ffffff47;
    box-shadow: 0 0 0px #0000000d;
    margin-bottom: 50px;
}

.account-info .info-item {
    padding-left: 65px;
    margin-top: 14px;
    box-shadow: 0px -1px 7px #00000040;
    border-radius: 4px;
    padding-top: 20px;
    padding-bottom: 30px;
}

.account-info .title {
    font-weight: bold;
    color: #464646;
    margin-bottom: 20px;
}

.account-info .item-block {}

.account-info .text-item {
    margin-top: 10px;
    margin-left: 10px;
}

.account-info .item-block .button {
    margin-top: 10px;
    margin-right: 40px;
}

.item-block.twofa {
}

.item-block.twofa .button.change {
    display: inline-block;
}

.account-info .header {
    font-size: 21px;
    margin-bottom: 51px;
}

.info-item.password .item-block {
    display: flex;
    justify-content: space-between;
}

.disabled-alert {
    color: #700000;
    font-size: 12px;
    margin-top: -10px;
}

.item-block.twofa {}

.item-line-item {
    display: flex;
    justify-content: space-between;
    width: 100%;
    margin-right: 48px;
    margin-bottom: 20px;
}

.info-item.contact .item-block {
    margin-right: 40px;
}

.search-sidebar.widen {
    width: 400px;
}

.advanced-more {
    position: absolute;
    bottom: 0px;
    height: 50px;
    width: 100%;
    background-color: white;
    box-shadow: 1px -4px 4px #00000012;
    overflow: hidden;
}

.advanced-info .advanced-item {
    display: flex;
    justify-content: space-between;
    padding-left: 25px;
    padding-right: 25px;
    margin-top: 11px;
}

.advanced-info .advanced-item .text {
    line-height: 21px;
}

.advanced-info {
    margin-top: 25px;
}

.notifications {
    position: fixed;
    bottom: 30px;
    right: 30px;
    width: 240px;
    height: auto;
    transition: all 200ms;
    z-index: 1301;
}

.notification {
    float: right;
    width: fit-content;
    padding-right: 30px;
    min-width: 100%;
    height: 50px;
    right: 0px;
    position: relative;
    background-color: #703af7;
    background: linear-gradient(45deg, #703af7, #187cd9);
    border-radius: 10px;
    display: flex;
    color: white;
    margin-top: 10px;
    transition: all 200ms;
    justify-content: left;
    align-items: center;
    box-shadow: 0 0 6px #0000003d;
}



.notifications .notification i.fa {
    margin-left: 20px;
    margin-right: 20px;
    font-size: 15px;
}

.notification>* {
    line-height: 49px !important;
    font-size: 12px;
    white-space: nowrap;
}

p {
    margin: unset;
}

.button.change-inv {
    width: 90px;
}

.change-dialog {
    height: 300px;
    width: 500px;
    position: fixed;
    left: 50%;
    transform: translate(-50%,-50%);
    top: 50%;
    background-color: white;
    box-shadow: 0 0 9px #00000033;
    border-radius: 3px;
    z-index: 4;
}

.change-dialog .button {
    position: absolute;
    bottom: 25px;
    left: 50%;
    transform: translateX(-50%);
}

.inventory-change .finish-list {
    margin-top: unset;
    bottom: 65px;
    position: absolute;
    width: 90%;
}

.padding-left {
    margin-top: 10px;
    margin-left: 40px;
}

.padding-left .text {
    margin-bottom: 6px;
}

.button {}

.button.finance-change {
    position: absolute;
    top: 17px;
    right: 30px;
}

.finance .report-tiles {
    margin-top: 30px;
}

.finance-change .padding-left {
    margin-top: 29px;
}

.commerce-items {
    width: 86%;
    left: 7%;
    height: auto;
    position: relative;
    display: flex;
    justify-content: space-evenly;
    margin-top: 30px;
    margin-top: 40px;
    flex-wrap: wrap;
}

.commerce-item {
    width: 125px;
    height: 200px;
    box-shadow: 0 0 6px #0000003b;
    border-radius: 5px;
    overflow: hidden;
    margin-bottom: 20px;
}

.commerce-item img {
    width: 100%;
    height: 100%;
    border: unset;
}

[point-set='installation-topbar'] .options {
    display: flex;
    justify-content: space-around;
    margin-top: 40px;
    flex-wrap: wrap;
    left: 50%;
    transform: translateX(-50%);
    position: relative;
    min-width: 450px;
    width: 500px;
}

[point-set='installation-topbar'] .options .option {
    position: relative;
    width: 200px;
    height: 80px;
    box-shadow: 0 0 7px #0000002e;
    border-radius: 6px;
    text-align: center;
    background-color: white;
    color: #3b3b3b;
    margin-bottom: 30px;
    cursor: pointer;
}

[point-set='installation-topbar'] .options .option i.fa {
    left: 50%;
    transform: translateX(-50%);
    position: absolute;
    margin-top: 16px;
}

[point-set='installation-topbar'] .option .name {
    position: absolute;
    bottom: 20px;
    width: 100%;
}

.payment-list {
    position: relative;
    left: 50%;
    transform: translateX(-50%);
    width: fit-content;
    margin-top: 30px;
}

.payment-item {
    width: 400px;
    height: 50px;
    padding-left: 20px;
    padding-right: 20px;
    background-color: white;
    color: #3b3b3b;
    margin-bottom: 10px;
    border-radius: 6px;
    box-shadow: 0 0 7px #0000004a;
}

.payment-item .exp {float: right;margin-right: 20px;}

.payment-item>* {
    display: inline-block;
    top: 50%;
    transform: translateY(-50%);
    position: relative;
}

.payment-item i.fa.fa-trash {
    float: right;
    cursor: pointer;
}

.payment-item .last-4 {
    margin-left: 20px;
}

.payment-item .new {
    float: right;
}

.payment-item.new {
    cursor: pointer;
}


/* */

form#payment-form {
    position: relative;
    top: 30%;
    width: 80%;
    transform: translate(-50%,-50%);
    left: 50%;
    padding: 20px;
    box-shadow: 0 0 4px #0000003b;
    border-radius: 6px;
}

#payment-form .button {
    position: relative;
    margin-top: 30px;
    left: 50%;
    transform: translateX(-50%);
    width: 200px;
}

div#card-errors {
    color: gray;
    margin-top: 10px;
    position: relative;
}

.StripeElement {
  box-sizing: border-box;

  height: 40px;

  padding: 10px 12px;

  border: 1px solid transparent;
  border-radius: 4px;
  background-color: white;

  box-shadow: 0 1px 3px 0 #e6ebf1;
  -webkit-transition: box-shadow 150ms ease;
  transition: box-shadow 150ms ease;
}

.StripeElement--focus {
  box-shadow: 0 1px 3px 0 #cfd7df;
}

.StripeElement--invalid {
  border-color: #fa755a;
}

.StripeElement--webkit-autofill {
  background-color: #fefde5 !important;
}


/* */

.key-list .key-item .private-key:hover {
    filter: unset;
}

.sub-status-modal {
    position: absolute;
    width: 500px;
    top: 43%;
    transform: translate(-50%,-50%);
    left: 50%;
    height: 300px;
    box-shadow: 0 0 7px #0000004a;
    overflow: hidden;
    border-radius: 6px;
}

.sub-status-modal .subhead {
    text-align: center;
    margin-top: 10px;
    color: #680000;
}

.sub-status-modal .desc-text {
    width: 90%;
    left: 5%;
    position: relative;
    margin-top: 20px;
    color: #3b3b3b;
    text-align: center;
}

.org-settings input {
    width: 170px;
    position: relative;
    left: 50%;
    transform: translateX(-50%);
    display: block;
    margin-bottom: 6px;
}

.org-settings input:first-of-type {
    margin-top: 20px;
}

.org-settings .desc-text {
    color: #232323;
    margin-top: 9px;
}

.legal {
    width: 90%;
    left: 5%;
    position: relative;
    margin-top: 10px;
    font-size: 11px;
}

.agree {
    display: flex;
    line-height: 22px;
    width: 120px;
    justify-content: space-evenly;
    left: 50%;
    transform: translateX(-50%);
    position: relative;
    margin-top: 20px;
}

.button.finish {
    position: absolute;
    bottom: 30px;
    left: 50%;
    transform: translateX(-50%);
}

.start-sub table {
    width: 90%;
    left: 5%;
    position: relative;
    margin-top: 20px;
}

.start-sub table th {padding-bottom: 8px;border-bottom: 1px solid #c3c3c3;color: #5c5c5c;}

.start-sub td {
    padding-top: 5px;
}

.start-sub td:nth-child(2) {
    text-align: right;
}

.button.advanced {
    position: absolute;
    bottom: 30px;
    left: 50%;
    transform: translateX(-50%);
}

.advanced-search {
    width: 75%;
    max-width: 1700px;
    min-width: 1000px;
    height: 80%;
    max-height: 1000px;
    min-height: 700px;
    position: fixed;
    left: 50%;
    top: calc(50% + 25px);
    transform: translate(-50%,-50%);
    background-color: white;
    box-shadow: 0 0 11px #0000004d;
    border-radius: 9px;
    z-index: 4;
    overflow: hidden;
}

.advanced-search .primary-info {
    width: 200px;
    top: calc(50% - 17px);
    transform: translateY(-50%);
    position: absolute;
}

.primary-info {}

.button.apply {
    position: absolute;
    bottom: 30px;
    left: 50%;
    transform: translateX(-50%);
}

.tags:not(.object-container) {
    width: 43%;
    margin-top: 65px;
    margin-left: 20px;
}

.extra-tags {
    width: 43%;
    margin-left: 20px;
    margin-top: 17px;
}

.sort {
    position: absolute;
    top: 65px;
    right: 20px;
    width: 43%;
}

.recent-series-item-large.nonactive {
    background-color: #21c2ff14;
}

.sort select {
    position: relative;
    left: 50%;
    transform: translateX(-50%);
    width: 50%;
}

.sort .header {
    margin-top: unset;
    padding-top: unset;
    margin-bottom: 10px;
}

.billing-settings {
    width: fit-content;
    width: -moz-fit-content;
    left: 50%;
    transform: translateX(-50%);
    position: relative;
    margin-top: 40px;
    padding: 20px;
    box-shadow: 0 0 4px #00000024;
    border-radius: 4px;
}

.billing-settings .info-item {
    margin-top: 10px;
    left: 50%;
    transform: translateX(-50%);
    position: relative;
    width: fit-content;
    width: -moz-fit-content;
}

.billing-settings .button.save {
    margin-top: 20px;
}

.next-bill {
    text-align: center;
    margin-top: 18%;
    width: 70%;
    left: 50%;
    transform: translateX(-50%);
    position: relative;
}

.payment-partner img {
    width: 83px;
}

.payment-partner {
    position: absolute;
    top: 20px;
    left: 26px;
    font-size: 20px;
}

.notification.error {
    /* background-color: red; */
    background: linear-gradient(45deg, rgb(129, 38, 38), #a64c4c);
}

.notification::after {content: " ";width: 100%;height: 2px;position: absolute;bottom: 0px;}

.transaction .fa-flag {
    color: #ffffff;
}

.transaction-view {
    position: fixed;
    width: 600px;
    height: 400px;
    background-color: white;
    left: 50%;
    transform: translate(-50%,-50%);
    z-index: 2;
    top: 50%;
    box-shadow: 0 0 9px #00000061;
    border-radius: 3px;
}

.transaction-view .timestamp {
    position: absolute;
    right: 20px;
    top: 10px;
    color: #2e2e2e;
}

.transaction-view .transaction-type {
    position: absolute;
    top: 10px;
    left: 20px;
    color: #2e2e2e;
}

.transaction:hover .fa-flag {
    display: none;
}

.transaction:not(:hover) .fa-flag{
    display: block;
    color: #e7a11f;
}

.transaction:not(:hover) .fa-check {
    display: none;
}

.transaction:hover .fa-check{
    display:inline-block;
}



.transaction .fa-check {color: #1dd71a;}

.logo {
    cursor: pointer;
    margin-right: 25px;
    margin-left: 25px;
    padding: 5px;
}

.topbar .logo img {
    height: 20px;
}
.sidebar-page.series-items>.main>.header {
    margin-bottom: 50px;
}

.recent-series-item-large i.fa.fa-clock {
    position: absolute;
    left: 50%;
    transform: translate(-50%,-50%);
    top: 50%;
    color: #ffffff94;
    mix-blend-mode: hard-light;
}

i.fa.fa-4x.fa-clock {}

.account-logo {
    width: 125px;
    cursor: pointer;
    height: 125px;
    left: 50%;
    transform: translateX(-50%);
    position: relative;
    margin-top: 25px;
    border-radius: 100%;
    margin-bottom: 10px;
}

.account-logo i.fa.fa-user {
    position: absolute;
    left: 50%;
    transform: translate(-50%,-50%);
    top: 50%;
    color: #2a2a2a;
}

.account-logo i.fa.fa-2x.fa-edit {
    position: absolute;
    color: white;
    left: 50%;
    transform: translate(-50%,-50%);
    top: 50%;
    width: 28px;
}

.account-logo i.fa.fa-2x.fa-edit {
    display: none;
}

.account-logo:hover .account-logo-circle {
    filter: blur(2px) brightness(0.5);
}

.account-logo-circle {
    width: 100%;
    height: 100%;
    background-color: white;
    border-radius: 100%;
    box-shadow: 0 0 7px #00000073;
}

.account-logo:hover i.fa.fa-2x.fa-edit {
    display: block;
}

div.warning {
    width: 80%;
    margin-top: 20px;
    height: 100px;
    margin: auto;
    margin-top: 30px;
    box-shadow: 0 0 6px #00000075;
    border-radius: 10px;
    background-color: #cf4545;
    position: relative;
    display: flex;
    justify-content: left;
    align-items: center;
}

.warning>i.fa {
    margin-left: 20px;
    color: white;
    margin-right: 20px;
}

.warning-body {
    margin-left: 26px;
    width: 64%;
    height: fit-content;
	height: -moz-fit-content;
    position: relative;
    color: white;
    font-size: 13px;
    text-align: initial;
}

.next.white {
    background-color: white;
    color: #2c88f0 !important;
}

.warning .next {
    position: absolute;
    right: 30px;
    left: unset;
    bottom: 50%;
    transform: translateY(50%);
}

.warning .next i {
    color: #cf4545;
}

.user-detail i.fa.fa-exclamation {
    position: relative;
    padding-right: 7px;
    padding-left: 10px;
    color: #cf4545;
}

.content-block {
    width: 500px;
    position: relative;
    margin: auto;
    margin-top: 50px;
    box-shadow: 0 0 6px #00000057;
    border-radius: 4px;
    padding-bottom: 25px;
    margin-bottom: 50px;
}

.content-block .header {
    text-align: left;
    margin-left: 30px;
}

.content-block p {
    margin-left: 31px;
    font-size: 12px;
    margin-top: 10px;
}

.content-block .button {
    margin-top: 17px;
    margin-left: 30px;
    display: inline-block;
}

.content-block.twofa {
}

.content-block .button.disable {
    background-color: #b32b2b;
}

.content-block.twofa .desc {
    display: inline-block;
    margin-left: 20px;
}

.sidebar.accounts {
    z-index: 1;
}

.access-item {
    height: 20px;
    position: relative;
    display: flex;
    margin-top: 5px;
    font-size: 14px;
    align-items: center;
    justify-content: left;
}

.content-block.access p {margin-bottom: 20px;}

.content-block.access .access, .dot {
    height: 10px;
    width: 10px;
    margin-left: 30px;
    background-color: #9e0000;
    border-radius: 100%;
}

.access-item>* {margin-left: 20px;}

.access.none {
    background-color: #b91111 !important;
}



.content-block.editable p {
    margin-bottom: 28px;
    text-align: center;
}

.label {
    display: inline-block;
    margin-left: 30px;
    width: 122px;
}

.content-block.editable i.fa.fa-pencil-alt, .content-block.editable i.fa.fa-check {
    position: absolute;
    right: 20px;
    top: 20px;
    cursor: pointer;
}

.content-block.editable i.fa.fa-check {
    color: green;
}

.content-block.notification-settings .finish-list {
    margin-top: 30px;
}

.content[page='assignments'] .finish-item .button {
    width: 110px;
    height: 17px;
    font-size: 13px;
    position: absolute;
    right: 16px;
    transform: translateY(-50%);
    top: 50%;
}

.letter-selector {
    position: absolute;
    width: 730px;
    height: 519px;
    left: 50%;
    top: 50%;
    transform: translate(-50%,-50%);
    background-color: white;
    box-shadow: 0 0 6px #00000075;
    z-index: 9;
    overflow: scroll;
    border-radius: 5px;
}

.letter-selector .header {margin-bottom: 20px;}

.letter-selector .letter {
    cursor: pointer;
}

.push-enable {
    width: 400px;
    height: 400px;
    background-color: white;
    z-index: 5;
    position: fixed;
    left: 50%;
    top: 50%;
    transform: translate(-50%,-50%);
    box-shadow: 0 0 8px #0000005e;
    border-radius: 6px;
}

.push-enable i.fa.fa-bell {
    position: relative;
    left: 50%;
    transform: translate(-50%,-50%);
    margin-top: 31%;
    font-size: 100px;
    color: #4892ff;
    text-shadow: 0px 2px 4px #00000057;
}

.push-enable .header {
    font-size: 19px;
    margin-top: -20px;
}

.button {
}

.push-enable .button.cancel {
    background-color: #b63e3e;
}

.push-enable .next {
    bottom: 40px;
}

.push-enable i.fa.fa-times {
    position: absolute;
    right: 30px;
    top: 19px;
    font-size: 21px;
    cursor: pointer;
}

.subscriptions, .settings .documents, .product-management .products, .donor-management .acknowledgement-tiers, .customer-settings .setting-types {
    margin-top: 30px;
    display: flex;
    flex-direction: column;
    justify-content: start;
    align-items: center;
    width: 90%;
    position: relative;
    flex-wrap: wrap;
    justify-content: center;
}

.subscription, .settings .document-type {
    width: 410px;
    height: 210px;
    background-color: white;
    box-shadow: 0 0 7px #0000004a;
    border-radius: 6px;
    position: relative;
    padding: 3px 21px;
    margin: 20px;
}

.subscriptions .subscription>.header,.document-type.header {
    font-size: 14px;
    margin-bottom: 2px;
    margin-top: 10px;
}

.subscription i.fa.fa-edit, .document-type i.fa.fa-edit {
}

div#subscription-series-items {}

div.subscription-list-item {
    font-size: 13px;
    font-weight: lighter;
}

.subhead {
    width: 100%;
    text-align: center;
    margin-top: 0;
    font-size: 13px;
}

.subscription .subhead,.document-type .subhead {
    margin-bottom: 10px;
}


.subscription .descriptor, .document-type .descriptor {
    font-size: 10px;
    margin-top: 7px;
    margin-left: 0px;
    position: absolute;
}

.subscription .finish-list, .document-type .finish-list {
    margin-top: 20px;
    font-size: 13px;
}

.edit-subscription .basic-info {
    padding-bottom: 30px;
    position: relative;
    width: 337px;
    height: fit-content;
	height: -moz-fit-content;
    display: inline-block;
}

.info-item {
    width: fit-content;
    left: 50%;
    position: relative;
    transform: translateX(-50%);
    margin-top: 10px;
}

.edit-subscription .header {
    margin-bottom: 20px;
}

input.sub-name, input.document-name {
}

.edit-subscription .series-info {
    height: fit-content;
	height: -moz-fit-content;
    width: 341px;
}

.topline {
    display: flex;
    align-items: baseline;
    margin-top: 40px;
    width: 90%;
    left: 50%;
    transform: translateX(-50%);
    position: relative;
    justify-content: space-around;
    border-bottom: 2px solid #ececec;
    flex-wrap: wrap;
}

.series-info .finish-list {
    margin-bottom: 15px;
}

.letter-list {
    width: 70%;
    height: fit-content;
	height: -moz-fit-content;
    padding-bottom: 40px;
    font-size: 14px;
    font-weight: lighter;
}

.assignment .assignment-data {margin-right: 6px;}

.assignment .button {
    width: 69px;
    padding: 5px;
    font-size: 10px;
    height: 14px;
    margin-left:20px;
}

.finish-item .assignment {
    display: flex;
    align-items: center;
    cursor: inherit;
}

.assignment .fa-search {
    cursor: pointer;
    color: #2d2d2d;
}

.edit-subscription .next {
}

.edit-subscription .button.save, .edit-document .button.save {
    position: fixed;
    right: 40px;
    top: 75px;
    z-index: 1;
}

.assignment i.fa.fa-times {
    margin-left: 15px;
    cursor: pointer;
}

.finish-item>.value .fa {margin-left: 20px;}

.edit-document .button.new {
    left: 50%;
    transform: translateX(-50%);
    position: relative;
    margin-top: 21px;
}

.field-editor {
    width: 500px;
    height: 300px;
    z-index: 4;
    background-color: white;
    position: absolute;
    left: 50%;
    transform: translate(-50%,-50%);
    top: 47%;
    border-radius: 6px;
}

.field-editor .finish-list {
    width: 90%;
    margin-top: 15px;
}

.field-editor .button {
    bottom: 30px;
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
}

.new-transaction .mini-subscription, .new-document .mini-document {
    width: 230px;
    padding-bottom: 20px;
    box-shadow: 0 0 7px #0000004a;
    border-radius: 6px;
    position: relative;
    margin: 10px;
    cursor: pointer;
    transition: all 200ms;
}

.new-transaction .mini-subscription .grouping {
    position: absolute;
    right: 10px;
    font-size: 9px;
    top: 5px;
}

.new-transaction .subscription-selection .container, .new-document .document-selection .container {
    display: flex;
    justify-content: center;
    margin-top: 16px;
    flex-wrap: wrap;
    width: 100%;
    left: 50%;
    transform: translateX(-50%);
    position: relative;
    padding-bottom: 30px;

}



.new-transaction .mini-subscription .header {
    margin-top: 3px;
}

.new-transaction .subscription-selection .title {
    text-align: center;
    margin-top: 13px;
    font-size: 13px;
    font-weight: lighter;
}

.new-transaction .mini-subscription:hover, .new-document .mini-document:hover {background-color: #3d84ff;color: white !important;}

.new-transaction .mini-subscription:hover *, .new-document .mini-document:hover * {
    color: white;
}

.new-transaction .subscription-selection .container:not(:last-of-type) {
    border-bottom: 1px solid #00000021;
}

.new-document .document-selection .container {
    width: 80%;
    max-height: 300px;
    top: 45%;
    transform: translate(-50%,-50%);
    position: absolute;
}

.new-document .main .finish-list.last {
    margin-bottom: 80px;
}

.new-document .next {
    position: fixed;
}

.new-document .mini-document:last-of-type {
    margin-bottom: 40px;
}

.product, .flow {
    margin: 21px;
    width: 330px;
    border-radius: 7px;
    position: relative;
    overflow: hidden;
    display: flex;
    align-items: center;
    flex-direction: column;
    justify-content: space-between;
    box-shadow: 0 0 4px #0000003d;
    padding: 20px 20px;
    height: 330px;
}

.products .product .header, .flows .flow .header {
    font-size: 10px;
    margin-left: 9px;
    margin-right: 10px;
    width: unset;
    height: 15px;
}

.product .product-image {
    width: fit-content;
    height: 180px;
    z-index: 0;
    display: flex;
    justify-content: center;
    border-radius: 4px;
    flex-shrink: 0;
    width: 230px;
    margin-right: unset;
    margin-top: 20px;
}



.product-image img, .system-image img {
    border-radius: 5px;
    overflow: hidden;
    object-fit: contain;
    height: 100%;
    /* box-shadow: 0 0 7px #0000003b; */
}

.product .price {
    font-size: 12px;
    bottom: 15px;
    position: absolute;
    margin-left: 15px;
}

.products .product .actions {
    bottom: 15px;
    position: absolute;
    right: 15px;
    display: flex;
    align-items: center;
}

.product .actions .fa {
    color: #323232;
}

.product .prod-id {
    position: absolute;
    left: 10px;
    top: 6px;
    font-size: 9px;
    font-weight: lighter;
}

.bottom-bar {
    height: 41px;
    position: absolute;
    width: 100%;
    left: 0px;
    bottom: 0px;
    background-color: white;
    display: flex;
    align-items: center;
}

.create-product, .create-series, .edit-donor-tier, .edit-customer-setting, .create-series-item, .add-sister-sequence, .new-user, .new-key, .change-subscription-range, .create-campaign {
    width: 730px;
    height: 450px;
    background-color: white;
    z-index: 3;
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%,-50%);
    border-radius: 7px;
    overflow: hidden;
}

.create-product .product-image{
    width: 140px;
    margin-left: 40px;
}

.create-product .upload-bottom {
    margin-left: 30px;
    width: 150px;
}

.create-product .upload-bottom input {
    width: calc(100% - 20px);
    margin-top: 18px;
}

.create-product i.fa.fa-times {
    position: absolute;
    right: 25px;
    font-size: 19px;
    top: 15px;
    cursor: pointer;
}

.create-product .product-image::-webkit-scrollbar, .edit-series-item .product-image::-webkit-scrollbar {
  display: none;
}


.create-product .combine {
    top: 50%;
    transform: translateY(-50%);
    position: absolute;
}

.settings-group:last-of-type {
    margin-bottom: 100px;
}

.series-list {margin-top: 30px;display: flex;align-items: center;justify-content: center;flex-wrap: wrap;}





.descriptor {
    position: absolute;
    font-size: 10px;
    margin-top: 5px;
    margin-left: 11px;
}

.series .actions {
    width: fit-content;
    display: flex;
    position: absolute;
    top: 10px;
    right: 9px;
    flex-direction: column;
    font-size: 13px;
}

.series i.fa.fa-edit {
    cursor: pointer;
}

.subscription:last-of-type, .settings .document-type:last-of-type {
    margin-bottom: 100px;
}

.series-settings .finish-list {
    width: 80%;
    margin-top: 30px;
}

.edit-donor-tier .finish-list {
    margin-top: 30px;
}

.donor-management .acknowledge-tier, .customer-settings .setting-type {
    flex-direction: row;
    width: 400px;
    height: 40px;
    background-color: white;
    box-shadow: 0 0 7px #0000004a;
    border-radius: 4px;
    align-items: center;
    margin-bottom: 12px;
    display: flex;
    position: relative;
}

.acknowledge-tier>* {
    position: relative;
    margin-left: 30px;
}

.acknowledge-tier .acknowledge-amount {
    float: right;
    right: 87px;
    position: absolute;
}

.action-list {
    position: absolute;
    right: 0px;
    margin-right: 14px;
}

.action-list>* {
    margin-right: 5px;
    cursor: pointer;
}

.ack-generator {
    width: 500px;
    height: 300px;
    left: 50%;
    top: 50%;
    transform: translate(-50%,-50%);
    position: fixed;
    box-shadow: 0 0 5px #00000045;
    border-radius: 5px;
    z-index: 4;
    background-color: white;
}

.ack-generator .header {
    font-size: 14px;
    font-weight: normal;
}

.ack-generator .finish-list {
    margin-top: 20px;
}

.donor-management .container-item.link {
    margin: auto;
    text-align: center;
    margin-top: 30px;
    width: 200px;
}

.open-settings .finish-list {
    margin-top: 29px;
}

.open-settings .title {
    text-align: center;
    margin-top: 43px;
    font-weight: bold;
    color: #2e2e2e;
}

.content.open-settings .finish-list.sorting {
    margin-top: 24px;
}

.customer-settings .setting-type {
    width: 500px;
    display: flex;
    align-items: center;
    position: relative;
}

.setting-type>* {
    margin-left: 30px;
}

.setting-type .switch, .setting-type input {
    position: absolute;
    right: 90px;
}

.setting-type {}

.setting-type:first-of-type {
    margin-top: 40px;
}

.ack-generator input {
    width: 140px;
}

.edit-customer-setting .finish-list {
    margin-top: 30px;
}

.advanced-search .filters.finish-list {
    margin-top: 10px;
    width: 100%;
}

.advanced-search .title, .category-header .title {
    text-align: center;
    font-weight: lighter;
    display: flex;
    justify-content: space-around;
    width: 100%;
    margin: auto;
    border-bottom: 1px dotted #3f3f3f;
    padding-bottom: 5px;
}

.advanced-search .filter-block:first-of-type {
    margin-top: 64px;
}

.title {}

.advanced-search .title .fa-plus, .category-header .title .fa-plus {
    cursor: pointer;
}

.advanced-search .title>div, .category-header .title>div {
    min-width: 200px;
    text-align: left;
}

.advanced-search .content.main {
}

.advanced-search .filter-block, .category-header {
    box-shadow: 0 0 5px #00000030;
    padding: 5px 4px;
    width: 70%;
    margin: auto;
    margin-top: 2px;
    margin-bottom: 0px;
    border-radius: 6px;
}

.advanced-search .main .header {
    margin-bottom: 40px;
}

.white-back {
    width: 100%;
    height: 12%;
    bottom: 0px;
    position: fixed;
    background-color: white;
    left: 0px;
    z-index: 2;
    box-shadow: 0 0 8px #0000001a;
    display: flex;
    flex-direction: row;
    align-items: center;
    padding-bottom: 0px;
}

.advanced-search .main .container {
    height: 84%;
    overflow-y: scroll;
    position: relative;
    width: 100%;
    z-index: 4;
}

.advanced-search .subhead {
    font-weight: lighter;
}

.advanced-search .content:not(.main) .finish-list, .new-mailing .segment-filter-list .finish-list {
    margin-top: 22px;
    width: 82%;
    user-select: none; -webkit-user-select: none;
}

.advanced-search .content:not(.main) .finish-item:hover, .new-mailing .segment-filter-list .finish-item:hover {
    cursor: pointer;
    border-radius: 5px;
}

.advanced-search i.fa.fa-check, .new-mailing .segment-filter-list i.fa.fa-check {
    color: #009c0d;
}

.advanced-search .content:not(.main) .finish-item:hover .fa, .new-mailing .segment-filter-list .finish-item:hover .fa {
}

.advanced-search .search, .new-mailing .search {
    position: absolute;
    display: flex;
    align-items: center;
    width: 200px;
    justify-content: space-evenly;
    right: 20px;
    top: 72px;
}

.advanced-filter-info {
    position: absolute;
    bottom: 73px;
    text-align: center;
    width: 100%;
    font-size: 12px;
    font-weight: lighter;
}

.customer-list i.fa.fa-file-export {
    position: relative;
}

.customer-list .action-list {
    right: 40px;
    top: 19px;
}

.customer-list .action-list .fa {
    font-size: 20px;
    cursor: pointer;
    color: #2260eb;
}

.search-sidebar .action-block {
    position: absolute;
    font-size: 14px;
    right: 10px;
    top: 10px;
    cursor: pointer;
    display: flex;
    width: 46px;
    justify-content: space-around;
}

.search-sidebar .header {
    margin-top: 10px;
}

.customer-list .subhead {
    position: absolute;
    font-size: 10px;
    margin-top: 3px;
}

.transaction-preview {
    width: 80%;
    height: 250px;
    position: fixed;
    left: 50%;
    transform: translateX(-50%);
    border-radius: 4px;
    background-color: white;
}

.transaction-preview .transaction-desc {
    font-size: 12px;
    margin-top: 6px;
    margin-left: 8px;
    position: absolute;
}

.transaction-preview .absolute-typing {
    position: absolute;
    right: 10px;
    font-size: 12px;
}

.transaction-preview .transaction-type-desc {
    width: fit-content;
    text-align: center;
    margin-top: 25px;
    position: relative;
    left: 50%;
    transform: translateX(-50%);
}

.transaction-preview .subhead {
    font-size: 10px;
    font-weight: lighter;
    margin-top: 2px;
}

.transaction-amount {
    position: absolute;
    font-size: 12px;
    font-weight: lighter;
    left: 8px;
    top: 22px;
    display: flex;
    color: #232323;
    align-items: center;
}

.transaction-tag-data {
    position: absolute;
    right: 9px;
    display: flex;
    top: 7px;
    font-size: 12px;
}

.transaction-tag-data>* {
    color: #0054bc;
    cursor: pointer;
    margin-left: 9px;
}

.transaction-amount .fa {
    font-size: 10px;
    margin-left: 5px;
}

.transaction-preview .finish-list {
    font-size: 12px;
    font-weight: lighter;
    width: 78%;
}

.transaction-preview .finish-item .fa {
    color: #0054bc;
}

.transaction-preview .finish-item {
    padding: 3px 6px 3px 6px;
}

.transaction-preview .custom-data {
    position: absolute;
    display: flex;
    flex-direction: column;
    width: 100%;
    left: 50%;
    transform: translateX(-50%);
    height: 78px;
    border-top: 1px solid #e5e5e5;
    padding-top: 7px;
    padding-bottom: 7px;
    bottom: 0px;
    overflow-x: scroll;
}

.transaction-preview .custom-data .data {
    font-weight: lighter;
    margin-top: 20px;
}

.finish-content .transaction-preview {
    margin-top: 40px;
}

.donation-data .finish-list {
    width: 90%;
    margin-top: 30px;
}


.series-info .period-series-items {
    width: 50px;
}

.transaction .item.amount {
    margin-left: 10px;
    font-weight: lighter;
    min-width: 80px;
}

.item.transaction-time {
    right: 10px;
    position: absolute;
    padding-right: 10px;
}

.item.receipt {
    margin-left: calc(10% - 75px);
    height: 100%;
    white-space: pre-wrap;
    max-width: 34%;
    font-size: 11px;
}

.item.type {
    min-width: 180px;
}

.transaction .transaction-tag-data {
    transform: scale(.7);
    transform-origin: right;
    right: 20px;
    top: 4px;
}

.customer.last {
    margin-bottom: 50px;
}

.advanced-search li .value input {
    width: 140px;
    text-align: left;
    padding-right: 19px;
}

.edit-document .basic-info {
    width: 300px;
}

.log .item.time {
    position: absolute;
    right: 0px;
    padding-right: 25px;
}

.log .item.action {
    min-width: 105px;
}

.campaign-bar .bar-item:hover {
    background-color: #dfdfdf;
}

.campaign-bar .bar-item:first-of-type {
    border-left: 1px solid #d6d6d6;
}

.campaign-bar .bar-item.open {
    background-color: #2c88f0;
    color: white;
}

.campaign-topbar i.fa.fa-cog {
    position: absolute;
    right: 25px;
    cursor: pointer;
}

.topbar .display-item {
    cursor: inherit;
}

.campaign-card .topbar, .white.topbar {
    position: relative;
    background-color: white;
    z-index: 3;
}

.campaign-card .topbar>*, .topbar.white>* {
    color: #383838;
}

.campaign-topbar .campaign-name {
    margin-left: 57px;
    font-weight: 500;
    text-overflow: ellipsis;
    overflow: hidden;
}

.campaign-settings {}

.campaign-topbar i.fa.fa-cog {
    position: absolute;
    right: 25px;
    cursor: pointer;
}

.topbar .display-item {
    cursor: inherit;
    padding-right: 30px;
    margin-right: 33px;
    margin-left: 15px;
    border-right: 1px solid #00000021;
}

.campaign-page {
    position: absolute;
    width: 100%;
    height: calc(100% - 50px);
    background-color: #f6f6f6;
    overflow: scroll;
    overflow-x: hidden;
}

.campaign-page.settings .finish-list {
    width: 450px;
    margin-top: 20px;
}

.finish-item>.button {
    text-align: center;
    display: block;
}

.campaign-page.settings .button.save {
    position: relative;
    margin: auto;
    margin-top: 40px;
}

.campaign-page .items, .items.campaign-wide-items.items, .demon-wide-items.items {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    margin-top: 33px;
}

.campaign-page .items>.item, .campaign-wide-items.items>.item, .demon-wide-items>.item {
    width: 300px;
    height: 200px;
    background-color: white;
    box-shadow: 0 0 7px #0000002e;
    border-radius: 5px;
}

.campaign-page .line-item, .campaign-wide-items.items .line-item, .demon-wide-items.items .line-item {
    height: 70px !important;
    display: flex;
    align-items: center;
    padding: 0px 22px;
    color: #3b3b3b;
    position: relative;
    margin-bottom: 20px;
    cursor: pointer;
}

.items .item.line-item>.fa {
    font-size: 22px;
}

.items .line-item>* {
    margin-right: 10px;
}

.line-item>.continue, .campaign-wide-items.items .line-item>.continue,.demon-wide-items.items .line-item>.continue  {
    position: absolute;
    right: 20px;
    display: flex;
    align-items: center;
}

.items .line-item>.continue>.fa {
    cursor: pointer;
}

.items .line-item>.continue>* {
    margin-left: 12px;
}

.campaign-page .item .button {
    width: 90px;
    margin-right: unset;
    right: 22px;
    position: absolute;
    padding: 5px;
}

.log i.fa {
    margin-right: 10px;
}

.log .fa-link {
    margin-left: 10px;
}

.product-selection .itemlist, .add-manual-history-items .itemlist {
    position: absolute;
    top: 75px;
}

.itemlist .item>.item-display, .product-container .item>.item-display {
    box-shadow: 0 0 5px #00000047;
    width: 100%;
    height: 100%;
    border-radius: 4px;
    background-color: white;
    position: relative;
    display: flex;
    flex-direction: row;
    justify-content: center;
    transition: all 200ms;
    overflow: hidden;
}

.itemlist .item:last-of-type,.product-container .item:last-of-type {padding-right: 40px;}

.itemlist .logo {
    position: fixed;
    top: 12px;
    left: 12px;
    color: #3b3b3b;
    font-size: 12px;
    margin: unset;
}

.itemlist .contents {
    display: flex;
    height: calc(100% - 20px);
    align-items: start;
    justify-content: left;
    overflow-y: hidden;
    overflow-x: scroll;
    position: absolute;
    top: 0;
    left: 0;
    width: -webkit-fill-available;
    padding-left: 40px;
    padding-top: 0px;
    padding-right: 40px;
    width: -moz-available;
}

.itemlist i.icon.fa.fa-shopping-cart {
    color: #3b3b3b63;
    position: absolute;
    top: 11px;
    left: 13px;
    font-size: 10px;
}

.itemlist .contents .item-image-container:hover .item-name, .product-container .item-image-container:hover .item-name {
    position: absolute;
    z-index: 2;
    color: white;
    text-align: center;
    margin-top: 5px;
    left: 50%;
    transform: translateX(-50%);
    font-size: 11px;
    width: 95%;
}

.itemlist .item:hover .item-display {
}

.itemlist .contents .item-image-container:not(:hover) .item-name,.product-container .item .item-image-container:not(:hover) .item-name {
    display: none;
}

.mod-transaction .main>.actions {
    position: absolute;
    font-size: 11px;
    top: 25px;
    right: 30px;
}

.itemlist .item .actions, .product-container .item .actions {
    position: absolute;
    width: 100%;
    height: calc(100% - (63% + 20px));
    justify-content: space-evenly;
    align-items: center;
    display: flex;
    bottom: 0;
    color: #3b3b3b;
    z-index: 2;
    background-color: white;
}

.itemlist .item .actions>*, .product-container .item .actions>* {
    margin: unset;
}

.itemlist .actions .fa-plus,.itemlist .actions .fa-minus {
    cursor: pointer;
    color: inherit;
    margin-left: 8px;
    margin-right: 8px;
}

.itemlist .item:hover .actions {
}

.itemlist .item .item-display .item-image-container, .product-container .item .item-display .item-image-container {
    height: 63%;
    width: 100%;
    transition: 200ms;
    position: relative;
    display: flex;
    justify-content: center;
    padding-top: 10px;
    padding-bottom: 10px;
    overflow: hidden;
}

.itemlist .item-image-container:hover, .product-container .item-image-container:hover {
    background-color: #545454;
    z-index: 2;
    box-shadow: inset 0 0 20px #00000054;
}

.itemlist .item-image-container:hover img, .product-container .item-image-container:hover img {
    filter: brightness(0.4);
    transform: scale(1.25) translate(0,0%);
}

.itemlist .actions .count, .product-container .actions .count {
    cursor: default;
    user-select: text;
    padding: 6px;
}

.itemlist .item-image-container:hover i.fa.fa-trash {
    position: absolute;
    bottom: 10px;
    color: white;
    z-index: 2;
    font-size: 14px;
    cursor: pointer;
    display: block;
}

.itemlist>.actions {
    display: flex;
    position: absolute;
    right: 13px;
    top: 11px;
    flex-direction: row-reverse;
    color: #3b3b3b;
    font-size: 12px;
    z-index: 2;
}

.itemlist>.actions>* {margin-left: 13px;}

.itemlist .item-image-container i.fa.fa-trash {
    display: none;
}

.category-header {
    box-shadow: unset;
    cursor: pointer;
    width: 90%;
}

.new-transaction .category-header:first-of-type {
    margin-top: 30px;
}

.new-transaction .product-listings .subhead, .add-manual-history-items .product-listings .subhead {
    margin-bottom: 15px;
}

.category-header .category {
    margin-top: 15px;
    display: flex;
    justify-content: top;
    flex-wrap: nowrap;
    flex-direction: column;
    align-items: center;
}

.product-item {
    width: auto;
    max-width: 130px;
    height: 150px;
    box-shadow: 0 0 5px #0000004f;
    border-radius: 6px;
    overflow: hidden;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-right: 15px;
    margin-bottom: 15px;
    margin-left: 15px;
}

.product-item img {
    height: 100%;
    position: relative;
    transition: all 200ms;
    border-radius: 6px;
}

.product-item .product-name {
    position: absolute;
    z-index: 2;
    color: white;
    text-align: center;
    transform: translateY(-50%);
    display: none;
    transition: all 200ms;
}

.product-item:hover .product-name {
    display: block;
}

.product-item:hover img {
    filter: brightness(0.5);
}

.category-header:last-of-type {
    margin-bottom: 50px;
}

.product-item i.fa.fa-check {
    position: absolute;
    color: #50ff50;
    z-index: 2;
    font-size: 34px;
}

.product-item:hover  i.fa.fa-check {
    margin-top: 26px;
}

.item.receipt .product-item {
    height: 80%;
    margin: unset;
    border-radius: 3px;
    margin-right: 9px;
}

.item.receipt .product-item img {
    border-radius: 3px;
}

.advanced-search .filter-block {
    margin-top: 20px;
    margin-bottom: 20px;
}

.transaction-preview .product-item {
    height: 100%;
    width: fit-content;
    flex-shrink: 0;
    margin: unset;
    padding-left: 10px;
    padding-right: 10px;
    box-shadow: unset;
}

.series .actions>* {
    margin-bottom: 10px;
}

.transaction-tag-data .fas {
    transform: translateY(10%);
}

.recent-series-item-large .actions>* {
    margin-left: 5px;
    color: #3b3b3b;
}

.recent-series-item-large .actions>* {
    color: #3b3b3b;
    margin-left: 15px;
}

.recent-series-item-large .ordered-number {
    position: absolute;
    right: 10px;
    top: 6px;
    color: #3b3b3b;
}

left {
}

.series-settings .naming-scheme {
    padding: 10px;
    width: 300px;
    height: 35px;
    box-shadow: 0 0 7px #00000045;
    border-radius: 4px;
    text-align: left;
    font-size: 10px;
    overflow-y: scroll;
}

.series-settings .finish-item.large {
    height: 57px;
}

.button.save {
    position: relative;
    margin: auto;
    margin-top: 20px;
}

.series-exports .finish-list {
    width: 70%;
    margin-top: 30px;
}

.order-fill .itemlist {
    width: 500px;
    margin: unset;
    z-index: 0;
    position: relative;
    margin: auto;
}

.pager-position {
    position: absolute;
    display: flex;
    top: 20px;
    left: 50%;
    transform: translateX(-50%);
}

.pager-position>div {
    width: 10px;
    height: 10px;
    border-radius: 10px;
    background-color: white;
    margin-right: 5px;
    margin-left: 5px;
    cursor: pointer;
    box-shadow: 0 0 3px 1px #0000005e;
    transition: all 200ms;
}

.active {}

.pager-position>div.active {
    background-color: #008c00;
}

.order-fill .transaction-preview {
    left: unset;
    width: 450px;
    transform: scale(.35);
    right: 0px;
    transform-origin: top right;
    margin-top: 15px;
    margin-right: 15px;
    transition: all 200ms;
    border-radius: 10px;
    z-index: 2;
}

.order-fill .transaction-preview:hover {
    transform: scale(.8);
    border-radius: 5px;
}

.order-fill .content .subhead {
    margin-bottom: 60px;
}

.order-fill .itemlist-title {
    width: 500px;
    margin: auto;
    margin-bottom: 7px;
    font-weight: lighter;
    font-size: 11px;
}

.order-fill .letters .letter-list {
    margin: auto;
    border-top: 1px solid #00000026;
}

.letter-fill-item {
    width: -webkit-fill-available;
    height: 50px;
    padding: 0px 13px;
    display: flex;
    align-items: center;
    box-shadow: 0 0 5px #0000004d;
    border-radius: 5px;
}

.order-fill .letter-fill-item>* {
    margin-left: 6px;
}

.order-fill .letter-fill-item>i {margin-left: 16px;}

.order-fill .letter-list table {
    width: 100%;
    padding-top: 10px;
}

.order-fill table tr i {
    margin-right: 7px;
}

.order-fill .letters table tr:not(:first-of-type) {height: 30px;background-color: #0000000a;}

.order-fill .letters table tr:first-of-type {
    height: 26px;
    text-align: left;
}

.order-fill .letter-list .header {
    text-align: center;
}

.order-fill .letters table tr:not(:first-of-type) td {
    padding: 0px 10px;
    position: relative;
}

.order-fill .letters .letter-list .throbber {
}

.order-fill .letter-list .load-throbber {
    transform: scale(.4) translate(-50%,-50%);
    transform-origin: 0 0;
    position: absolute;
    top: 50%;
    left: 50%;
}

.order-fill .note {
    width: 500px;
    margin: auto;
    margin-top: 40px;
}

.order-fill .note .subhead {
    margin-bottom: 20px;
}

.order-fill .customer-tag {
    display: flex;
    position: absolute;
    top: 20px;
    left: 20px;
    cursor: pointer;
    align-items: center;
}

.order-fill .customer-tag>* {
    margin-right: 9px;
}

.section-title i.fa.fa-plus {
    position: absolute;
    right: 40px;
    cursor: pointer;
}

.section-title.line-title {
    position: relative;
    border-bottom: 1px solid #0000002e;
    padding-bottom: 4px;
}

.letter-list .finish-item .text .fa-trash {
    margin-right: 5px;
    color: #3b3b3b;
    font-size: 10px;
    cursor: pointer;
}

.edit-subscription .letter-list .finish-item .text {
    min-width: 200px;
}

.edit-subscription .letter-list {
    width: 90%;
}

.mailing-labels .letter-list {
    margin: auto;
    margin-top: 46px;
}

div#print-letter-list-header {}

.product-listings .series {
    margin-bottom: 25px;
}

.merge-letter-content>.content {
    width: 8.5in;
    height: 11in;
    margin: auto;
    margin-bottom: 70px;
    margin-right: 20px;
    margin-left: 20px;
    overflow-wrap: break-word;
}

.setting-item .size-container {
    display: flex;
}

.setting-item .size-container input {
    width: 33px;
    padding-right: 10px;
    margin-right: 8px;
}

.merge-content-main {
    position: absolute;
    top: 66px;
    left: 175px;
    width: calc(100% - 175px);
    overflow-x: scroll;
}

.letter-viewer .letter:after {
    content: '';
    position: absolute;
}

.product-container {width: -webkit-fill-available;}

.product-container, .add-manual-history-items .product-container {
    margin-left: 20px;
    margin-right: 20px;
    display: flex;
    flex-direction: row;
    justify-content: center;
    flex-wrap: wrap;
    margin-top: 30px;
    margin-bottom: 30px;
}

.new-transaction .product-container .item, .add-manual-history-items .product-container .item {
    padding: 10px;
}

.product-container i.fa.fa-times {
    color: #902323;
    font-size: 20px;
}

.product-container i.fa.fa-plus {
    color: #3b3b3b;
    font-size: 20px;
}

.open-product-history .product-container {
    display: flex;
    justify-content: center;
    transform-origin: 0 0;
    width: 500px;
    margin: auto;
    margin-top: 50px;
    flex-wrap: wrap;
}

.open-product-history .product-container .item {
    padding: 15px;
}

.completion-frame iframe {
    width: 100%;
    height: 100%;
    border: unset;
}

.add-manual-history-items {
    /* display: none; */
}

.add-manual-history-items .button.complete {
    position: absolute;
    bottom: 25px;
    left: 50%;
    transform: translateX(-50%);
}

.series .header {
    margin: 0px 34px;
    padding-top: 25px;
    left: 50%;
    font-size: 12px;
    transform: translateX(-50%);
    margin-left: 0px;
    position: relative;
}

.new-mailing {
    position: fixed;
    width: 520px;
    height: 420px;
    background-color: white;
    border-radius: 3px;
    box-shadow: 0 0 7px #00000042;
    z-index: 3;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
    overflow: hidden;
    transition: all 400ms;
}

.new-mailing .finish-list {
    margin-top: 25px;
}

.new-mailing .email-setup .campaign-wide-items.items {
    margin-top: 35px;
    flex-direction: column;
}

.new-mailing .campaign-wide-items.items {
    margin: auto;
    margin-top: 10px;
    flex-direction: column;
    align-items:center;
    justify-content:center;
    width:fit-content;
}


.next.disabled {
    background-color: #bdbdbd;
}

.button.disabled {
    background-color: #bdbdbd;
}

.new-mailing .population-descriptor {
    font-size: 10px;
    margin-right: 16px;
}

.new-mailing .complete.true {
    margin-right: 20px;
    color: #00b400;
}

.new-mailing .complete {
    margin-right: 20px;
    color: #8e0e0e;
    transition: all 100ms;
}

.new-mailing .complete.true .fa-check {display: block;}

.new-mailing .complete:not(.true) .fa-check {
    display: none;
}

.new-mailing .complete.true .fa-exclamation {
    display: none;
}

.new-mailing .complete:not(.true) .fa-exclamation {
    display: block;
}

.variables {
    position: relative;
    width: 420px;
    height: 400px;
    margin-right: 30px;
    margin-left: 90px;
    background-color: white;
    z-index: 4;
    box-shadow: 0 0 10px 0px #0000004d;
    border-radius: 6px;
    overflow: scroll;
}

.letter-viewer-modal .variables .finish-list {
    font-size: 11px;
}

.letter-viewer-modal .cover {
    width: 100%;
    height: 100%;
    position: absolute;
    background-color: #00000052;
    z-index: 3;
    box-shadow: 0 0 15px transparent;
    border-radius: 3px;
}

.letter-viewer-modal .cmd-bar .fa-bug {
    color: #3b3b3b;
    cursor: pointer;
}

.letter-viewer-modal.debug {
    position: absolute;
    height: 400px;
}

.new-mailing .email-setup .campaign-wide-items.items {
    margin-top: 35px;
}

.email-setup .letter-descriptor {
    margin-right: 20px;
}

.new-mailing .section-title {
    width: 100%;
    padding: unset;
    text-align: center;
    margin-left: 30px;
}

.new-mailing .segment i.fa.fa-plus {
    position: absolute;
    top: 26px;
    right: 35px;
    cursor: pointer;
}

.new-mailing .segment-filters .campaign-wide-items {
    margin-top: 40px;
}

.segment-filters .item .continue .selected {
    margin-right: 12px;
    font-size: 10px;
    transform: translateY(-1px);
}

.new-mailing .finish-list[aggregate], .new-mailing .finish-list[email],.new-mailing .finish-list[export] {
    margin-top: 0px;
    border-top: 1px solid #ececec8f;
    padding-top: unset;
}

.new-mailing .search {
    top: 56px;
}

.new-mailing .mailing-desc {
    font-size: 10px;
}

.new-mailing .segment .finish-list {
    width: 93%;
    margin-bottom: 30px;
}

.new-mailing .segment-filter-list .finish-list {
    width: 90%;
}

.new-mailing .letter:hover {
    color: #3b3b3b;
    background-color: #f9f9f9;
    cursor: pointer;
}

.new-mailing .letter.selected {
    background-color: #2e78ff;
    color: white;
}

.new-mailing .letter.selected:hover {
    background-color: #2e78ff;
    color: white;
}

span.brace {
    color: #3876ff;
    padding-left: 0px;
    padding-right: 0px;
    font-size: inherit;
    background-color: #e6e6e6;
    border-radius: 2px;
}

[scheduled-time] input {
    width: 88px;
    margin-left: 10px;
}

.content.mailings .mailing-stats {
    position: absolute;
    font-size: 8px;
    top: 11px;
    left: 23px;
    display: flex;
    color: #3b3b3b;
}

.content.mailings .mailing-stats>* {
    margin-right: 6px;
}

.mailings .mailing-stats .fa {
    margin-right: 4px;
}

.customer-list>.actions {
    display: flex;
    flex-direction: column;
    position: fixed;
    right: 35px;
    margin-top: 5px;
    z-index: 5;
    font-size: 20px;
}

.field-export {
    position: fixed;
    width: 600px;
    height: 500px;
    background-color: white;
    z-index: 3;
    top: 50%;
    transform: translate(-50%,-50%);
    left: 50%;
    border-radius: 6px;
    box-shadow: 0 0 6px #00000057;
    overflow: hidden;
}

.field-export .field-list {
    width: 90%;
    padding: 0px 30px;
    margin-top: 20px;
    height: calc(100% - 155px);
    overflow: scroll;
}

.field-export .fa-list, .field-export .fa-plus {
    margin-right: 15px;
}

.field-export .model-desc {
    position: absolute;
    top: 10px;
    right: 18px;
    font-size: 10px;
}

.field-export .finish-item:not([new]) .text {
    cursor: grab;
}

.field-export [new] {
    cursor: pointer;
    justify-content: center;
}

.field-export .finish-item:last-of-type {
    margin-bottom: 30px;
}

.field-export .finish-item {
    user-select: none; -webkit-user-select: none;
}

.field-export .continue-export {
    width: 100%;
    height: 79px;
    box-shadow: 0 0 5px #00000054;
}

.field-export .finish .button {
    position: absolute;
    bottom: 35px;
    left: 50%;
    transform: translateX(-50%);
}

.field-export .finish .finish-list {
    margin-top: 20px;
}

.edit-product .left-content {}

.dual-content {
    display: flex;
    justify-content: space-around;
}

.field-editor {
    position: absolute;
    z-index: 3;
    width: 400px;
    height: 300px;
    left: 50%;
}

.custom-field-editor {
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%,-50%);
    width: 500px;
    height: 343px;
    background-color: white;
    box-shadow: 0 0 6px #0000004d;
    z-index: 3;
    border-radius: 5px;
    overflow: hidden;
}

.custom-field-editor .finish-list {
    margin-top: 25px;
}

.custom-field-editor .custom-field-preview {
    width: 100%;
}

.finish-list.select-options .finish-item {
    justify-content: space-between;
    width: 65%;
    left: 50%;
    transform: translateX(-50%);
}

.custom-field-editor .select-options {
    margin-top: 10px;
}

.dropdown {
}

.finish-list.select-options {
    height: 135px;
    overflow: scroll;
}

.section-title {
    display: flex;
}

.preview .finish-list .finish-item {
    background-color: #ffffff;
    border-radius: 5px;
    border: 1px solid #0000003b;
    width: 61%;
    top: 40%;
    left: 50%;
    transform: translateX(-50%);
}

.preview .finish-list {
    margin-top: 85px;
}


.product-management .products {
    flex-direction: row;
    margin: auto;
    margin-bottom: 30px;
    margin-top: 30px;
    flex-wrap: wrap;
}

.product .content.secondary {
}


.product .finish-list, .flow .finish-list, .document .finish-list {
    margin-top: 10px;
    font-size: 11px;
}

.finish-item input {}

.finish-item select {
    font-size: inherit;
}

.product .fa.fa-arrow-left.back {
    font-size: 15px;
    top: 14px;
    left: 16px;
}


.product-detail .finish-list {
    width: 80%;
    margin-top: 171px;
    font-size: 12px;
}

.product-detail .product-image {}

.products-small-list {
    transform: scale(.6) translateX(-50%);
    transform-origin: 0 0;
    position: absolute;
    left: 50%;
    margin-top: 17px;
}

.edit-api-key .scopes .finish-list {
    margin-bottom: 30px;
}

.button.add {}

.itemlist .contents .item-image-container:hover .item-name {
    width: 95%;
}

.item.receipt .product-item:first-of-type {
    margin-left: 5px;
}

/* */

.subscription-editor {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
    width: 600px;
    height: 460px;
    background-color: white;
    z-index: 3;
    box-shadow: 0 0 9px #00000030;
    border-radius: 5px;
    overflow: hidden;
}

.subscription-editor .finish-list.basic {
    margin-top: 15px;
}

.subscription-editor .export-definition {
    margin-top: 15px;
}

.export-definition.series-definition {}

.subscription-editor .export-definition .finish-list {
    margin-top: 0px;
}

.subscription-editor .finish-list.series-select {
}

.subscription-editor .finish-list.series-options {
    width: 80%;
}

.subscription-editor .title {
    text-align: center;
}

.subscription-editor .series-options .finish-item {
    padding-top: 8px;
    padding-bottom: 8px;
}

.subscription-editor .letter-list {
    width: 95%;
    margin-top: 30px;
    left: 50%;
    transform: translateX(-50%);
    position: relative;
}

.subscription-editor .letter-list .finish-item .text {
    min-width: 145px;
}

.subscription-editor .series-list {
    border-bottom: unset;
    margin-top: 40px;
}

.edit-subscription .letter-list {
    padding: 0px 2.5%;
    height: 67%;
    overflow: scroll;
    box-shadow: inset 0 0 4px #00000045;
}

.activate-series-item .ordered-number {
    position: absolute;
    z-index: 2;
    color: #3b3b3b;
    right: 14px;
    top: 10px;
    display: flex;
}

.ordered-number .ord {
    margin-right: 5px;
}

.demondms-pref .demon-wide-items.items {
    margin-top: 10px;
}

.demon-large-item {
    width: auto;
    max-width: 770px;
    min-height: 200px;
    margin: 0px 65px;
    margin-left: auto;
    margin-right: auto;
    background-color: white;
    box-shadow: 0 0 6px #00000029;
    border-radius: 5px;
    position: relative;
    margin-bottom: 30px;
    overflow: hidden;
}

h2 {
    font-size: 20px;
    font-weight: lighter;
    color: #3b3b3b;
    margin-left: 30px;
    margin-top: 20;
    margin-top: 20px;
}

h1,h2,h3,h4,h5,h6 {
    font-weight: lighter;
    color: #3b3b3b;
    margin-left: 30px;
}

.demon-large-item h1 {
    top: 80px;
    margin-right: 50px;
}

p {
    font-weight: lighter;
}

p.explanation {
    margin-left: 30px;
    color: #7b7b7b;
    max-width: 90%;
}

.demon-large-item:first-of-type {
    margin-top: 0px;
}

.demon-large-item.credits {
    margin-top: 0px;
}

.charge-table {
    left: 50%;
    transform: translateX(-50%);
    position: relative;
    color: #3b3b3b;
    margin-top: 20px;
    margin-bottom: 10px;
}

.charge-table .finish-item.category .value {
    font-weight: bold;
}

.text {}

.charge-table .finish-item:not(.category), .charge-final .finish-item:not(.category) {
    margin-left: 8px;
    color: #4c4c4c;
}

.charge-final {
    width: 51%;
    position: relative;
    float: right;
    min-height: 30px;
    margin-bottom: 25px;
    margin-right: 2.5%;
    min-width: 360px;
}

.demon-large-item h2 {
}

.star-content {
    float: right;
}

.charge-final .finish-item:not(.category) {
    margin: unset;
}

.demon-large-item.credits i.fa.fa-plus {
    float: right;
    margin-right: 30px;
    cursor: pointer;
}

.add-credit {
    position: fixed;
    height: 350px;
    width: 560px;
    left: 50%;
    top: 50%;
    transform: translate(-50%,-50%);
    background-color: white;
    box-shadow: 0 0 7px #00000047;
    z-index: 3;
    border-radius: 3px;
    overflow: hidden;
}

.add-credit {}

.add-credit .select {
    display: flex;
    float: right;
    width: 237px;
    justify-content: flex-end;
    cursor: pointer;
}

.add-credit .select * {
    margin-left: 20px;
}

.add-credit center {
    margin-top: 30px;
}

.left-header {
    margin-left: 60px;
    margin-top: 19px;
}

.add-credit .content.cards .payment-item {
    position: relative;
    left: 50%;
    transform: translateX(-50%);
    margin-top: 5px;
    transition: 100ms ease-in;
}

.add-credit .payment-methods {
    height: 255px;
    overflow: scroll;
    box-shadow: inset 0px 3px 3px #00000017;
}

.add-credit .payment-item:first-of-type {
    margin-top: 20px !important;
}

.add-credit .payment-item:last-of-type {
    margin-bottom: 20px !important;
}

.add-credit .content.cards .payment-item:hover {
    background-color: #2a89ff;
    color: white;
    cursor: pointer;
}

iframe.three_d_secure {
    position: fixed;
    z-index: 4;
    border: unset;
    width: 530px;
    height: 610px;
    top: calc(50% + 25px);
    left: 50%;
    transform: translate(-50%,-50%);
    box-shadow: 0 0 4px #0000002e;
}

.edit-api-key {
    position: fixed;
    width: 500px;
    height: 300px;
    background-color: white;
    left: 50%;
    top: 50%;
    transform: translate(-50%,-50%);
    z-index: 3;
    border-radius: 4px;
    box-shadow: 0 0 9px #0000004d;
    overflow: hidden;
}

.edit-api-key .whitelist i.fa.fa-plus {
    top: 50%;
    float: right;
    float: right;
    margin-right: 30px;
	cursor:pointer;
}

.key-item .key-data {
    position: relative;
    width: 91%;
    padding-bottom: 7px;
    padding-top: 8px;
}

.key-item .key-data {
    display: flex;
    justify-content: space-between;
}

.key-list .key-item i.fa.fa-edit {
    cursor: pointer;
}

.key-item .actions {
    position: absolute;
    right: 13px;
    top: 10px;
}

.key-item .actions>* {
    margin-left: 10px;
}

.donor-list p {
    margin-left: 60px;
}

.edit-document {
    position: fixed;
    width: 900px;
    height: 600px;
    left: 50%;
    top: 50%;
    transform: translate(-50%,-50%);
    z-index: 3;
    background-color: white;
    box-shadow: 0 0 5px #0000003b;
    border-radius: 5px;
    overflow: hidden;
}

.content.assignment .finish-list.document-letters {
    width: 90%;
    margin-top: 20px;
}

.edit-document .content.fields i.fa.fa-plus {
    font-size: 16px;
    top: 50%;
    transform: translateY(-50%);
    position: absolute;
    right: 40px;
}

.edit-document .fields h2 {
    position: relative;
}

.edit-document .fields .finish-list {
    width: 90%;
}

.customer-settings .finish-list.settings {
    width: 500px;
    margin-top: 50px;
}

center>h6,center>h5, center>h4, center>h3, center>h2, center>h1 {
    margin-left: unset;
}

.transaction-preview .custom-data .fa {
    font-size: 10px;
    line-height: 16px;
    margin-left: 10px;
    margin-right: 10px;
    color: #3b3b3b;
}

.itemlist>h4 {
    text-align: center;
    position: absolute;
    width: 100%;
    margin: unset;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-100%);
    color: #b7b7b7;
}

.search-sidebar .primary-info input:not(:placeholder-shown) {
    background-color: #def0ff;
}

.card-names i.fa.fa-pencil-alt.editing {
    color: red;
}

.pii-container i.fa.fa-backspace {
    position: absolute;
    top: 50%;
    color: #3b3b3b;
    right: -40px;
    transform: translateY(-50%);
    cursor: pointer;
}

.customer-info.pii i.fa.fa-backspace {
    position: absolute;
    right: 15px;
    top: 18px;
    font-size: 12px;
    cursor: pointer;
}

.customer[noclick].selection-addition {
    cursor: copy;
}

.customer.highlight-selected .customer-header {
    background-color: #802ef0;
}

.customer.population-selected .customer-header, .transaction-item.population-selected .object-header {
    background-color: #2c71f0;
    color: white;
}

.population-list-export {
    position: fixed;
    width: calc(100% - 250px);
    left: 250px;
    height: 70px;
    padding-bottom: 3px;
    bottom: 0px;
    background-color: white;
    z-index: 1;
    box-shadow: 0 0 7px #989898;
    display: flex;
    justify-content: left;
    align-items: center;
}

.campaign-population-view .next {}

.population-list-export .next {
    position: relative;
    margin-right: 20px;
    left: unset;
    bottom: unset;
}

.population-list-export .next.cancel {
    background-color: #c93b3b;
    margin-left: auto;
    margin-right: 20px;
}

.subscription-editor .finish-list.letter-data {
    height: 270px;
    overflow: scroll;
    border-bottom: 1px solid #d5d5d5;
    margin-top:0px;
    padding-top:10px;
}

.order-fill .recipient-block h3 {
    border-bottom: 1px solid #e5e5e5;
    display: flex;
    align-items: flex-end;
}

.order-fill .recipient-block {
    margin-right: 30px;
}

.order-fill .recipient-block small {
    font-size: 12px;
    margin-left: 10px;
    margin-right: 20px;
}

.order-fill .letter-item {
    width: auto;
    height: 40px;
    display: flex;
    background-color: #ffffff;
    margin-left: 30px;
    box-shadow: 0 0 7px #00000042;
    border-radius: 5px;
    align-items: center;
    padding-left: 20px;
    padding-right: 20px;
    margin-bottom: 10px;
}

.order-fill .letter-item p {
    margin-left: 15px;
}

.order-fill .letter-item .actions {
    position: absolute;
    right: 20px;
}

.mod-transaction {
    width: 630px;
    height: 450px;
    background-color: white;
    position: fixed;
    left: 50%;
    top: 50%;
    transform: translate(-50%,-50%);
    box-shadow: 0 0 8px #00000059;
    border-radius: 6px;
    z-index: 3;
    overflow: hidden;
    transition: all 200ms ease-in;
}

.mod-transaction small {
    font-size: 10px;
    margin-right: 20px;
    margin-left: 20px;
    transform: translateY(-10%);
}

.mod-transaction .mod-column {
    display: inline-flex;
    flex-direction: column;
    position: relative;
    margin-left: 31px;
    text-align: right;
}

.view-transaction .main h2 {
    margin-bottom: 6px;
    display: flex;
    align-items: center;
}

.mod-transaction .warning p {color: white;}

.mod-transaction .sidebar {
    top: 0px;
    height: 100%;
    width: 225px;
    border-radius: 0;
}

.mod-transaction .sidebar h3 {
    margin-right: 30px;
    text-align: center;
}

.mod-transaction .content.main.shortened {
    left: 225px;
    width: calc(100% - 225px);
}

.mod-transaction h5 {
    margin-bottom: 14px;
}

.mod-transaction .itemlist {
    width: 70%;
    left: 50%;
    transform: translateX(-50%) scale(.9);
    margin-top: -20px;
    margin-bottom: 27px;
}

.mod-transaction h6 {
    margin-top: unset;
    margin-left: 33px;
}

.mod-transaction .finish-list {
    width: 80%;
    font-size: 14px;
    padding-bottom: 30px;
}

.transaction-preview .custom-data p {width: 85%;padding-left: 6px;left: 50%;transform: translateX(-50%);position: relative;color: black;text-align: left;}

.item.receipt.product-list {
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: flex-start;
    overflow: scroll;
    height: fit-content;
    height: -moz-fit-content;
    max-height: 100%;
    width: 300px;
    font-size: 10px;
    flex-shrink: 0;
}

.item.receipt.product-list p {
    padding-top: 1px;
    padding-bottom: 1px;
}

.mod-transaction .fa-pencil-alt, .mod-transaction .fa-plus {
    margin-left: 10px;
}

.mod-transaction .warning {
    width: 70%;
    height: 45px;
    font-size: 12px !important;
    margin-top: 15px;
    color: white !important;
    align-items: center;
    margin-bottom: 20px;
}

.mod-transaction .warning .fa {
    font-size: 12px;
}

.mod-transaction .fa-arrow-right {
    font-size: 8px;
    margin: 0px 10px;
}

.mod-transaction center p {
    display: flex;
    justify-content: center;
    align-items: center;
}

.new-transaction .manual {
    position: absolute;
    font-size: 10px;
    color: #3b3b3b;
    top: 20px;
    right: 30px;
    cursor: pointer;
}

.new-transaction .manual-subscription .finish-list {
    width: 90%;
    margin-top: 30px;
}

input[type="date"] {
    min-width: 150px;
}

.new-transaction .manual-subscription input {
    width: 200px;
}

.mod-transaction p.transaction-note {
    width: 70%;
    left: 15%;
    position: relative;
    margin-bottom: 40px;
    border-top: 1px solid #e4e4e4;
    padding-top: 8px;
    padding: 8px 10px;
}

.transaction-note {
    width: 70%;
    left: 50%;
    transform: translateX(-50%);
    position: relative;
    padding: 10px 30px;
    padding-left: 20px;
    box-shadow: 0 0 1px black;
    display: flex;
    margin-bottom: 10px;
    margin-top: 20px;
}

.mod-transaction .main .fa-sticky-note {
    margin-right: 20px;
    color: #3b3b3b;
    align-self: center;
}

.mod-transaction .transaction-note i.fa.fa-edit {
    position: absolute;
    right: 10px;
    font-size: 10px;
    cursor: pointer;
    top: 5px;
}

.mod-transaction .edit-option-list {
    display: flex;
    width: 86%;
    margin: auto;
    margin-top: 40px;
    flex-wrap: wrap;
    justify-content: center;
}

.mod-transaction .edit-option, .block-option {
    width: 150px;
    height: 70px;
    padding-bottom: 7px;
    color: #3b3b3b;
    box-shadow: 0 0 6px #0000002e;
    border-radius: 5px;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    margin: 15px;
    cursor: pointer;
}

.mod-transaction .edit-option p, .block-option p {
    text-align: center;
    font-size: 11px;
    margin-top: 15px;
}

.mod-transaction .edit-transaction-note .note-editing {
    width: 80%;
    left: 50%;
    min-height: 200px;
    transform: translateX(-50%);
    margin-top: 30px;
    position: relative;
    box-shadow: 0 0 3px #00000059;
    padding: 10px 10px;
}

.mod-transaction .edit-acknowledgement .finish-list,.mod-transaction .edit-campaigns .finish-list {
    margin-top: 40px;
}

.mod-transaction .edit-desc {
    width: 84%;
    margin: auto;
    margin-top: 50px;
}

.account-info-block i.fa.fa-exclamation-triangle {
    margin-left: 40px;
    font-size: 35px;
}

.sidebar-page {
    width: 100%;
    height: 100%;
    position: absolute;
    overflow-y: scroll;
}

.mod-transaction.right {
    left: calc(50% + (250px / 2));
}

.transaction-sidebar.history-sidebar {
    z-index: 4;
    height: 100%;
    top: 0px;
}

.customer .name-container {
    margin-left: 30px;
    display: flex;
    flex-direction: column;
    width: 45%;
}

.customer .item.company {
    font-size: 10px;
}

.paragraph-input {
    padding: 10px;
    border-radius: 3px;
    border: none;
    box-shadow: 0 0 2px #00000073;
    border-radius: 4px;
    text-align: left;
    font-size: 10px;
    overflow-y: scroll;
    background-color: white;
    min-width: 200px;
    height: fit-content;
	height: -moz-fit-content;
    max-width: 210px;
    color: #3b3b3b !important;
    min-height: 12px;
}

.campaign .content>p {
    margin-left: 30px;
}

.open-campaigns .finish-list {
    width: 90%;
}


.subscriptions .actions {
    position: absolute;
    margin-top: 6px;
    right: 16px;
}

.sidebar.orders .item:last-of-type {
    margin-bottom: 40px;
}

.log .name, .log .company {
    display: block;
}

.item {}

.log .item.company {
    font-size: 10px;
}

.log .name-container * {
}

.log .item.name {
    height: 18px;
}

body.scaled {
    transform: translateX(250px);
    box-shadow: 0 0 8px black;
    box-shadow: 0 0 8px #0000006e;
}

.dms-overlay-left {
    position: fixed;
    left: 0px;
    width: 250px;
    transform: translateX(-100%);
    background-color: #ffffff;
    height: 100%;
    z-index: 8;
    top: 0px;
    box-shadow: inset 0 0 10px #00000059;
}

.dms-overlay-top {
    position: fixed;
    width: 100%;
    background-color: white;
    height: 25%;
    top: -25%;
    z-index: 9;
    box-shadow: 4px 2px 5px #00000047;
}

.darken.scaled {
    z-index: 8;
}

.scaled .darken {
    z-index: 8;
}

.dms-overlay-left .item {
    width: 60%;
    padding-left: 30px;
    padding-right: 30px;
    position: relative;
    display: flex;
    justify-content: center;
    flex-direction: column;
    align-items: center;
    box-shadow: 0 0 6px #00000033;
    border-radius: 9px;
    margin: auto;
    margin-bottom: 15px;
    cursor: pointer;
    color: #3b3b3b;
}

.dms-overlay-left .item>* {
    padding-bottom: 13px;
    text-align: center;
}

.dms-overlay-left .item>*:first-child {
    padding-top: 13px;
}

.dms-overlay-left center {
    margin-bottom: 40px;
}

a {
    text-decoration: none;
}

.topic-sidebar {
    font-size: 15px;
}

.topbar .open {
    outline: 1px solid #ffffff75;
}

.help-main {
    position: absolute;
    overflow: scroll;
    left: 250px;
    width: calc(100% - 250px);
    height: calc(100% - 50px);
    top: 50px;
}

.content .article {
    width: 360px;
    height: 100px;
    background-color: white;
    box-shadow: 0 0 4px #00000075;
    margin: 10px;
    position: relative;
    cursor: pointer;
    border-radius: 6px;
    display: flex;
    flex-wrap: nowrap;
    justify-content: flex-start;
    align-items: center;
}

.help-main .content {
    justify-content: space-between;
    c(100% - 0px);
}

.help-main .help-articles {
    padding: 0px;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    flex-direction: row;
    align-items: center;
}

.help-articles .article p {margin-right: 20px;text-align: left;}

.help-articles .article p>i {
    margin-right: 12px;
    font-size: 17px;
    vertical-align: middle;
    transform: translateY(-2px);
}

.article>i {margin-left: 40px;margin-right: 40px;}

.help-articles .construction {
    position: absolute;
    font-size: 10px;
    top: 8px;
    right: 10px;
    color: #5d0606;
}

.help-main .content[articleid] p {
    padding: 0px 60px;
    margin-top: 39px;
}

.submission {
    width: 500px;
    height: 400px;
}

.modal {
    background-color: white;
    z-index: 8;
    box-shadow: 0 0 9px #0000002e;
    position: fixed;
    border-radius: 4px;
    left: 50%;
    top: 50%;
    transform: translate(-50%,-50%);
    overflow: hidden;
    overflow-y: scroll;
    resize: auto;
}

.submission input[type="text"] {
    width: 400px;
    margin-top: 20px;
}

.submission .paragraph-input {
    margin-top: 14px;
    width: 400px;
    max-width: unset;
    min-height: 100px;
    max-height: 140px;
}

.modal>p {
    margin-left: 40px;
    margin-top: 15px;
}

.plain .search-sidebar {
    height: 100%;
    top: 0px;
}

.plain .customer-list {
    height: 100%;
    top: 0px;
}

iframe.population {
    width: 100%;
    height: 100%;
    top: 0px;
    position: absolute;
    border: unset;
}

.plain .actions {
    display:none;
}

.customer.population-selected i.fa {color: white;}
.customer.highlight-selected i.fa {color: white;}

.customer[noclick].last {
    margin-bottom: 100px;
}

.inventory {
    width: 700px;
    height: 450px;
}

.inventory .main .finish-list {
    width: 90%;
}

h6 {
    margin-top: 7px;
    margin-bottom: 7px;
}

.inventory .main h2 {
    margin-bottom: 5px;
}

.inventory .product-description, .statistics .product-description {
    position: absolute;
    right: 15px;
    font-size: 10px;
    top: 10px;
    max-height: 16px;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: 240px;
    overflow:hidden;
    text-align: right;
}

.inventory .options {
    justify-content: center;
}

.inventory .content.all .sidebar {
    top: 0;
    height: 100%;
    width: 200px;
    z-index: 1;
}

h4 {
    margin-top: 15px;
    margin-bottom: 15px;
}

.inventory .all .sidebar .item {
    font-size: 12px;
}

.inventory .all .sidebar h4 {
    margin-top: 22px;
    margin-left: 27px;
}

.inventory .sku .finish-list {
    width: 75%;
}

.inventory .manage-sku .finish-list {
    margin-top: 40px;
    width: 70%;
}

.inventory .manage-sku .finish-item i {
    width: 29px;
    text-align: center;
    margin-right: 5px;
    margin-left: 5px;
}

.inventory .manage-sku .finish-item {
    cursor: pointer;
}

.inventory .manage-sku h2 {
    max-width: 82%;
    margin-top: 30px;
}

.manage-sku-inventory .finish-item {
    cursor: pointer;
    width: 80%;
    margin: auto;
}

.advanced-search .content li[index] {
    font-size: 14px;
}

.advanced-search .content .finish-item[index] p {
    max-width: 79%;
}

.sidebar .item p {
    margin-left: 0px;
    max-width: 88%;
}

.flip-card-body, .flip-card-face{
    height: 100%;
    top: 0px;
    position: absolute;
    width: 100%;
}

.flip-card-face.front {
}

.flip-card-body {
    transition: transform 0.8s;
    transform-style: preserve-3d;
}

.flipped .flip-card-body {
    transform: rotateX(180deg);
}

.flip-card-face{
    position: absolute;
    width: 100%;
    height: 100%;
    -webkit-backface-visibility: visible;
    -webkit-backface-visibility: hidden; /* Safari */
    backface-visibility: hidden;
    background-color: white;
    -webkit-transform-style: preserve-3d;
    box-shadow: 0 0 9px #0000002e;
    border-radius: 5px;
}

.flip-card-face.back{
    transform: rotateX(180deg);
}

.flip-card {
    perspective: 1000px;
}

.hover-flip-card:hover .flip-card-body{
    transform:rotateX(180deg)
}

.new-user .finish-list {
    width: 80%;
}

.user-list {}

.user-access-settings.modal center h2 {
    margin-bottom: 5px;
}

.user-access-settings.modal center p {
    font-size: 13px;
}

.add p {
    display: inline-block;
}

.new-document .finish-list .finish-item {
    cursor: pointer;
}

.notification .load-throbber {
    position: absolute;
    width: 20px;
    height: 20px;
    top: unset;
    transform: unset;
    right: 20px;
    left: unset;
}

.notification.task {
    background: unset;
    background-color: white;
    color: inherit !important;
    padding-right: 60px;
    min-width: calc(100% - 30px);
}

.notification.task i.fa.fa-check {
    position: absolute;
    right: 23px;
    margin: unset;
    color: #44aa44;
}

.notification.task i.fa.fa-times {
    position: absolute;
    right: 23px;
    margin: unset;
    color: #7c0000;
}


.notifications {
    perspective: 984px;
}

.notification {
    cursor: pointer;
}

.advanced-search .add {
    position: absolute;
    right: 40px;
    width: fit-content;
    width: -moz-fit-content;
    left: unset;
    transform: translateY(6px);
}

.advanced-search hr {
}

.advanced-search .main center {
    padding-bottom: 10px;
    padding-top: 20px;
}

.advanced-search .main center h2 {
    margin-top: unset;
}

.advanced-search .main .finish-list {
    margin-top: unset;
    height: 71%;
    overflow: scroll;
}

.advanced-search .operator {
}

.advanced-search .finish-item .value {
    cursor: default;
}

.advanced-search .main .finish-item[or] {
    padding-left: 30px;
}

.advanced-search .main .finish-item {user-select: none; -webkit-user-select: none;}

.advanced-search .white-back .option-button, .advanced-search .white-back .interact-button {
    position: absolute;
    right: 30px;
    width: -moz-fit-content;
    margin-top: unset;
    top: 50%;
    transform: translateY(-50%);
    right: 100px;
    left: unset;
    cursor: pointer;
    font-size: 21px;
}

.advanced-search [handler] li i.fa.fa-plus {
    padding: 0px 5px;
    cursor: pointer;
}

.advanced-search .white-back .interact-button {
    right: unset;
    left: 100px;
}

.advanced-search .content[handler] .value {
    padding-left: 30px;
}

.advanced-search .content[handler] .finish-list {
    padding-bottom: 40px;
}

[relate='product-management'] .sidebar {
    top: 0px;
    z-index: 2;
    height: 100%;
}

.sidebar-page {
    width: calc(100% - 250px) !important;
    left: 250px;
    height: 100%;
    position: absolute;
    transition: all 300ms;
    z-index: 1;
    overflow-x: hidden;
}

.sidebar-retractable.sidebar-retracted {
    transform: translateX(-80%);
}

.sidebar-page.sidebar-retracted-page {
    left: calc(250px * .2);
    width: calc(100% - (250px * .2)) !important;
}

.sidebar.sidebar-retractable.sidebar-retracted i.fa.fa-mouse {
    position: absolute;
    right: calc(50px / 2 - 7px);
    top: 15px;
}

.sidebar:not(.sidebar-retracted) i.fa.fa-mouse {
    display:none;
}

.sidebar.sidebar-retracted i[lock] {
    display:none;
}

.sidebar.sidebar-retracted i[lock] {
    display:none;
}

.modal.modal-presentation {
    width: 100%;
    height: 100%;
    background-color: #00000040;
    border-radius: 0;
    box-shadow: unset;
    outline: 10px solid #0000005e;
    z-index: 1300;
    overflow: hidden;
}

.confirm.modal p {
    margin-top: 40px;
}

.popover {
    position: absolute;
    background-color: white;
    z-index: 5;
    box-shadow: 0 0 7px #00000059;
    padding: 15px 15px;
    border-radius: 5px;
    width: fit-content !important;
    width: -moz-fit-content !important;
}

.popover:after {
    content: "";
    position: absolute;
    width: 10px;
    height: 20px;
    top: 50%;
    left: 0px;
    background-color: white;
    transform: translateY(-50%);
}
.popover:before {
    content: "";
    position: absolute;
    width: 12px;
    height: 12px;
    top: 50%;
    left: -6px;
    background-color: white;
    transform: translateY(-50%) rotate(45deg);
    box-shadow: 0 0 3px #00000052;
}

ul {
    list-style: none;
    padding-left: unset;
    margin-top: unset;
    margin-bottom: unset;
}

.popover ul li {
    padding: 7px 11px;
}

.popover ul li:last-of-type {
    border-bottom: unset;
}

.popover ul {
    margin-bottom: 0px;
    margin-top: 0px;
}

.popover ul li {
    cursor: pointer;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.popover.top-center-arrow:after {
    left: 50%;
    transform: translate(-50%, 0%);
    top: 0;
    width: 20px;
    height: 13px;
}

.popover.top-center-arrow:before {
    top: 2px;
    right: 50%;
    transform: translateY(-50%) translateX(50%) rotate(45deg);
    left: unset;
    border-radius: 3px;
}

.popover.bottom-center-arrow:after {
    left: 50%;
    transform: translate(-50%, 0%);
    bottom: 0px;
    width: 20px;
    height: 10px;
    top: unset;
}

.popover.bottom-center-arrow:before {
    top: 100%;
    right: 50%;
    transform: translateY(-50%) translateX(50%) rotate(45deg);
    left: unset;
}

.popover.right-center-arrow:after {
    right: 0px;
    left: unset;
}

.popover.right-center-arrow:before {
    left: unset;
    right: 0px;
    transform: translate(50%, -50%) rotate(45deg);
}

.series-menu {
    padding: 46px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
}

.dashboard .tile h2 i.fa {
    margin-right: 14px;
    width: 26px;
}

.dashboard .tile {
    padding-top: 10px;
    padding-bottom: 61px;
    box-shadow: 0 0 6px #00000052;
    border-radius: 5px;
    width: 250px;
    position: relative;
    margin: 20px;
}

.dashboard .tile center>i {
    position: absolute;
    right: 18px;
    top: 12px;
}

.button i {
    margin-left: 8px;
    vertical-align: middle;
}

.subscription-editor .settings .finish-item p {
    min-width: 151px;
    display: flex;
    justify-content: space-between;
}

.series-popup {
    width: 250px;
    height: 100px;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    color: #3b3b3b !important;
}

.series-popup>div {
    height: 100%;
    position: relative;
}

.series-popup .next {
    bottom: 0;
    transform: translateX(-50%) scale(.8);
    transform-origin: center;
}

.series-popup img {
    width: 100px;
    height: 100%;
    object-fit: contain;
}

.series-popup p {
    margin-top: 7px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    width: 112px;
}

.sidebar-full-height{
    top:0px;
    height: 100%;
}

.statistics.modal {
    width: 90%;
    height: 90%;
}

.statistics .product-description {
    width: 400px;
}

.sidebar.sidebar-retractable i[lock]{
    position: absolute;
    right: calc(50px / 2 - 7px);
    top: 15px;
    cursor:pointer;
    color: #5c5c5c;
}

.tile {
    box-shadow: 0 0 4px #00000061;
    border-radius: 6px;
    margin: 20px;
    padding: 20px 20px 80px 20px;
    position: relative;
}

.tile.no-next {
    padding-bottom: 30px;
}

.statistics .report-tiles {
    margin-top: 38px;
}

.advanced-search .finish-list.fields{
    margin-top:200px !important;
}

i.fa.fa-angle-left {
    left: 10px;
    position: fixed;
    top: 22px;
    cursor: pointer;
    z-index: 1;
}


.advanced-search.modal.large {
    width: 95%;
    height: 95%;
}

.advanced-search .main.content .finish-item {
    background-color: white;
}

.advanced-search .main.content .finish-item:first-of-type {
    margin-top:5px;
}

.advanced-search .main.content .finish-item:last-of-type {
    margin-bottom:5px;
}

.create-transaction {
    width: 1065px;
    height: 690px;
}

input#amount, input#extra, select#payment_type {
    margin-right: 22px;
}

input#amount, input#extra {
    width: 90px;
    margin-right: 9px;
}

.create-transaction .main .finish-list {
    margin-top: 25px;
}

.create-transaction .main .advanced {
    position: absolute;
    right: 35px;
    top: 20px;
    font-size: 19px;
    cursor: pointer;
}

.create-transaction input#date, .create-transaction input#time {}

input#create_time, input#create_date {
    margin-left: 15px;
}

.create-transaction .finish-list#types {
    width: 80%;
    margin-top: 50px;
    cursor: pointer;
}

.create-transaction .transaction-preview {
    width: 450px;
    margin-top: 50px;
}

.create-transaction .create-options-list.finish-list {
    width: 80%;
    margin-top: 25px;
}

.create-transaction div#sale-items {
    width: 75%;
    margin: auto;
    margin-top: 55px;
}

.create-transaction .assign-gift {
    padding: 5px 20px;
    margin-left: 20px;
}

.merge-block {
    padding: 5px 10px;
    width: fit-content;
    width: -moz-fit-content;
    box-shadow: 0 0 5px #0000004a;
    margin-bottom: 8px;
    border-radius: 5px;
    padding-top: 5px;
    margin-top: 11px;
    margin-left: 15px;
    height: fit-content;
    display: flex;
    align-items: center;
}

.view-code-structure {
    width: 80%;
    height: 520px;
    padding: 20px;
}



.merge-block>span.merge-display {
    margin-right: 20px;
    font-weight: lighter;
    color: #5959ff;
    padding-top: 5px;
    padding-bottom: 5px;
}

.merge-block.conditional-data,.merge-block.body {
    flex-direction: column;
    align-items: flex-start;
}

.finish-list[disabled] * {
    color: #a6a6a6;
    cursor: default !important;
}


.secondary-list {
    height: calc(83% - 70px);
    overflow: scroll;
    box-shadow: inset 0 0 6px #0000003d;
}

.create-series-item input.ord {
    margin-right: 20px;
}

center>h2 i.fa.fa-plus {
    position: absolute;
    right: 50px;
    font-size: 15px;
    top: 50%;
    transform: translateY(-50%);
    cursor: pointer;
}

center {position: static;}

.custom-field-editor .dropdown-page .finish-item {
    background-color: white;
    cursor: grab;
}

.custom-field-editor .dropdown-page>center {
    position: relative;
}


.custom-field-editor .preview h2 {margin-bottom: 0px;}

.content.secondary center {
    position: relative;
}

.change-margin {
    width: 600px;
    height: 400px;
}

.change-margin input.margin-input {
    width: 62px;
    text-align: center;
}

.margin-page {
    width: 100px;
    height: 132px;
    margin: 16px 37px;
    box-shadow: 0 0 9px #00000052;
}

.mailings .next.create-mailing {
    right: 20px;
    bottom: 0;
    top: 0;
    margin: auto;
    left:unset;
    transform:unset;
}

.csv-export.modal {
    width: 600px;
    height: 400px;
}

.items.campaign-wide-items {}

.item.line-item {}

.new-mailing div#sub-population {
    margin-top: 50px;
}

.new-mailing iframe {
    top: 0;
    position: absolute;
    width: 100%;
    height: 100%;
    border: unset;
}

.new-mailing.modal.expand {
    width: 93%;
    height: 90%;
}

.key-item i.fa.fa-fingerprint {
    position: absolute;
    top: 12px;
    left: 12px;
}

.modal.view-credential {
    width: 1000px;
    height: 700px;
}

.dot.true {
    background-color: green !important;
}

article {
    margin-bottom: 90px;
}

code.replaceable {
    color: #1f8000;
}

.transaction:first-of-type {
    margin-top: 40px;
}

.customer-card .main .add:not(button) {
    left: unset;
}

.customer-card .campaigns, .customer-card .transactions {
    margin-bottom: 0px;
    padding-bottom: 10px;
    padding-top: unset;
}


.demon-large-item.history, .demon-large-item.credit-changes {
    min-height: 62px;
    cursor: pointer;
}

.demon-large-item.history i.fa.fa-arrow-right, .demon-large-item.credit-changes i.fa-arrow-right {
    position: absolute;
    font-size: 23px;
    right: 60px;
    top: 50%;
    transform: translateY(-50%);
}


.invoice.invoice-year {
    width: 500px;
    padding: 20px;
    border-radius: 5px;
    box-shadow: 0 0 4px #0000004f;
    display: flex;
    flex-direction: column;
    margin-bottom: 30px;
}

.invoices:not(.content) {
    display: flex;
    align-items: center;
    flex-direction: column;
    margin-top: 50px;
}

.invoice .finish-item {
    cursor: pointer;
}

.finish-item.selectable:hover, li[selectable]:hover {
    background-color: #f3f3f3;
    cursor: pointer;
}

.invoice.invoice-year.minified {
    height: 50px;
    overflow: hidden;
    padding-bottom: 30px;
}

.invoice h2 {
    cursor: pointer;
}

.invoice.minified .finish-list {
    margin-top: 40px;
}

.invoice.content .demon-large-item {
    margin-top: 65px !important;
}

.credit-changes .finish-list {
    margin-top: 50px;
    width: 80%;
}

.credit-changes .finish-item.ui-list-item:last-of-type {
    margin-bottom: 50px;
}

.series-options-page .finish-list {
    width: 80%;
    min-width: 200px;
    max-width: 600px;
    margin-top: 50px;
}

.series-options.modal {
    width: 600px;
    height: 400px;
}

.add-to-campaign.modal {
    width: 700px;
    height: 500px;
}

body.left-bias {
    width: calc(100% - 320px);
}

.left-bias .topbar {
    width: calc(100% + 320px);
}

.remote-entry-data {
    position: absolute;
    width: 275px;
    left: unset;
    right: -270px;
    height: 400px;
    transform: translate(0,-50%);
}

.left-bias-data {
    width: 320px;
    right: -320px;
    height: calc(100% - 50px);
    top: 50px;
    position: fixed;
    z-index: 1;
    overflow: hidden;
    border-left: 1px solid #00000036;
}

.left-bias-data .order-data {
    width: 300px;
    height: 468px;
    position: relative;
    transform: translate(-50%,0%);
    top: 3%;
}

i.fa.fa-times {}

i.fa.fa-times.close {
    position: absolute;
    margin-top: 14px;
    margin-left: 12px;
    font-size: 19px;
    right: 0px;
    cursor: pointer;
}

.left-bias-data .transaction-preview {
    left: unset;
    width: 450px;
    transform: scale(.6666);
    right: 10px;
    transform-origin: top right;
    margin-top: 44px;
    transition: all 200ms;
    border-radius: 10px;
    z-index: 2;
    position: absolute;
    box-shadow: 0 0 9px #0000002e;
}

.controls {
    position: absolute;
    bottom: 30px;
    width: calc(100% - 80px);
    height: 48px;
    background-color: #f6f6f6;
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
    padding: 0px 20px;
    margin-left: 20px;
}

.left-bias-data .controls i {
    cursor: pointer;
}

.content.overflow {
    overflow: visible;
}

.left-bias .modal.modal-presentation {
    width: calc(100% + 320px);
    transform: translate(0,-50%);
    left: unset;
}

.left-bias-data center.empty {
    position: relative;
    top: 36%;
}


.finish-list.tab .finish-item {padding-left: 50px;}

.finish-list.collapse {
    height: 0;
}

.embedded.finish-list {
    margin-top: unset;
    margin-left: 10px;
}

.data-item {
    margin-top: 20px;
    width: 90%;
    margin: auto;
    margin-top: 20px;
    margin-bottom: 20px;
    height: 125px;
    box-shadow: 0 0 6px #00000030;
    border-radius: 5px;
    position: relative;
    overflow: hidden;
    display: flex;
    justify-content: space-between;
    align-items: center;
    cursor: grab;
}

.customer-card .personal-info .add {
    position: relative;
}

.data-item .data-label {
    font-weight: lighter;
    margin-left: 7px;
    margin-top: 5px;
    font-size: 12px;
}

.address .address-line {
    position: relative;
    margin-left: 15px;
    font-weight: lighter;
    max-width: 65%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.data-item .modify {
    margin-right: 12px;
    font-size: 11px;
    white-space: nowrap;
    transform: translateY(-5%);
}

.data-item .modify>* {
    margin-left: 6px;
    cursor: pointer;
    padding: 0 5px;
}

.pii-container .notes {
    width: 500px;
    min-height: 250px;
    margin-bottom: 20px;
    margin: auto;
    margin-top: 20px;
    overflow: hidden;
    box-shadow: 0 0 8px #00000029;
    border-radius: 5px;
    padding: unset;
}

.customer-info {
    position: relative;
    width: 400px;
    padding-bottom: 29px;
    margin-left: 20px;
    margin-right: 20px;
    z-index: 1;
    height: fit-content;
    margin-top: 20px;
    height: -moz-fit-content;
    padding: 0px 20px 0px;
}

.personal-data {
    width: 500px;
    padding-bottom: 33px;
    margin-left: auto;
    margin-right: auto;
    box-shadow: 0 0 8px #00000029;
    border-radius: 5px;
    overflow: hidden;
}

.personal-data input {
    width: 150px;
    text-align: left;
}

.account-data-container {
    margin-left: auto;
    margin-right: auto;
}

.personal-info {
    margin-top: 60px;
    display: flex;
    justify-content: center;
    align-items: center;
    margin-bottom: 60px;
    flex-wrap: wrap;
    padding: 0px 0px;
}

.personal-info .telephones, .personal-info .emails, .personal-info .addresses, .personal-info .tags, .personal-info .attributes {
    width: 440px;
    height: 275px;
    padding: 0px 0px;
    overflow-y: scroll;
    overflow-x: hidden;
    position: relative;
    align-self: baseline;
    margin: 10px;
    box-shadow: 0 0 8px #00000029;
    border-radius: 5px;
}

.data-item.phone, .data-item.email {
    height: 50px;
}

.phone-line, .email-line {padding-left: 13px;max-width: 64%;overflow: hidden;text-overflow: ellipsis;}

.modify {
    font-size: 12px;
}

.modify>* {
    margin-left: 10px;
    cursor: pointer;
}

.personal-info .finish-list p {
    max-width: 87%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.edit-email, .edit-phone, .edit-address, .add-tag, .edit-note, .edit-attribute {
    width: 600px;
    height: 400px;
}

.edit-email .finish-list {
}

.personal-info .finish-list small {
    font-size: 12px;
    text-align: center;
}

.personal-info .flex-v.special>i, .object-container .flex-v.special>i {
    font-size: 10px;
    color: black;
}

.edit-address.modal {
    height: 560px;
    width: 740px;
}

.lookup-result {
    display: inline-block;
    margin-right: 20px;
    font-size: 11px;
    max-width: 190px;
    overflow: hidden;
    text-align: right;
    text-overflow: ellipsis;
}

.lookup-result-container{
	align-items: center;
  display: flex;
}

.partial-address {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 160px;
    position: absolute;
    transform: scale(.75);
    transform-origin: center right;
    right: 55px;
    top: 21px;
}

.personal-info .finish-list {
    padding-bottom: 20px;
    margin-top: unset;
}

[handler] li .value * {
    margin-left: 20px;
}

.label-item {
    text-align: center;
    margin-top: 30px;
    font-weight: 100;
    font-size: 17px;
    margin-bottom: 7px;
    border-bottom: 1px solid #eaeaea;
    padding-bottom: 5px;
}

.customer-list center h2 {
    margin-bottom: 6px;
}

div {}

.warnings {
    font-size: 12px;
    position: relative;
    width: fit-content;
    width: -moz-fit-content;
    border: 1px solid gray;
    padding: 5px;
    cursor: pointer;
    transition: all 100ms;
    border-radius: 5px;
    margin-top: 20px;
}

.warnings .fa {
    margin-left: 12px;
    margin-right: 12px;
    font-size: 10px;
}

.warnings:hover {
    background-color: #ab0006;
    color: white;
    border: 1px solid transparent;
}

.modal.warnings-ui {
    width: 700px;
    padding-bottom: 25px;
    min-height: 300px;
}

.customer.ui-list-item .finish-list {
    width: 100%;
    margin-top: unset;
}

.customer.ui-list-item .customer-header, .campaign.ui-list-item .campaign-header, .large-object .object-header {
    width: 100%;
    position: relative;
    height: 40px;
    display: flex;
    left: 0;
    align-items: center;
    padding-top: 4px;
    padding-bottom: 4px;
    z-index: 2;
    border-bottom: 1px solid lightgrey;
    flex-shrink: 0;
    cursor: pointer;
}

.customer.ui-list-item .customer-name {
    margin-left: 15px;
    white-space: nowrap;
    text-overflow: ellipsis;
    max-width: 82%;
    overflow: hidden;
}

.large-object.ui-list-item .finish-list .finish-item {
    padding-left: 10px;
    padding-right: 10px;
}

.customer-body-section, .object-body-section {
    position: relative;
    left: 0;
    padding: 0px 0px;
    height: calc(100% - 49px);
    width: 100%;
    margin: auto;
    max-height: 185px;
    overflow-y: scroll;
    overflow-x: hidden;
    padding-bottom: unset;
}

.customer:not(.empty):hover {
    background-color: #1a62bf03;
}

.customer.new.ui-list-item {
    /*height: 15px;*/
}


.customer.population-selected .customer-header {
    color: white !important;
    border-bottom: 1px solid #ffffffb3;
}
.customer.highlight-selected .customer-header {
    color: white;
    border-bottom: 1px solid #ffffffb3;
}

.customer.population-selected {
    background-color: white;
    box-shadow: 0 0 0px 2px #2c71f0;
}

.customer.highlight-selected {
    background-color: white;
    /*box-shadow: 0 0 0px 2px #802ef0;*/
}

.modal.bulk-customer-actions {
    width: 700px;
    height: 500px;
}


.pii-row-item {
    margin: 10px;
    margin-top: 20px;
}

.edit-address .finish-item i.fa.fa-arrow-right {
    margin-left: 20px;
}

.iso-lookup-tab.modal {
    width: 700px;
    height: 530px;
}

.system-page {
    width: 100%;
    height: calc(100% - 50px);
    margin-top: 50px;
    position: absolute;
}

.campaign-list {
    display: flex;
    margin: auto;
    margin-top: 20px;
    max-width: 900px;
    justify-content: center;
}

.campaign.ui-list-item {
}

.campaign-code {
    margin-top: 0;
    font-weight: lighter;
    font-size: 11px;
}

.campaign-name {}

.system-page .sidebar {
    top: 0;
    height: 100%;
}


.transaction-item {
    width: 500px;
    box-shadow: 0 0 4px #0000003d;
    border-radius: 6px;
    margin: auto;
    position: relative;
    margin-bottom: 20px;
    cursor: pointer;
    overflow: hidden;
    z-index: 2;
}

.transaction-item:first-of-type {
    margin-top: 20px;
}

.transaction-item .object-header {
    height: 45px;
    border-bottom: 1px solid #0000002b;
    display: flex;
    padding: 0px 20px;
    align-items: center;
    justify-content: left;
    font-size: 12px;
    background-color: white;
    width: calc(100% - 40px);
}

.transaction-item .dates {
    text-align: right;
}

.object-body {
    height: fit-content;
    position: relative;
    width: 100%;
    overflow-y: scroll;
    background-color: #fbfbfb;
}

.dates.flex-right {
    margin-left: auto !important;
}

.object-header>*:not(:first-of-type) {
    margin-left: 25px;
}

.transaction-item .object-header .fa {
    font-size: 10px;
    margin-left: 4px;
}

.icon-tags {
    position: absolute;
    bottom: 8px;
    right: 10px;
    display: flex;
    color: #000000cf;
    font-size: 12px;
    align-items: center;
    flex-direction: row-reverse;
}

.icon-tags>i {
    margin-left: 8px !important;
}

.transaction-item.small.campaign-log-item {
    height: 60px;
}

.transaction-item.small .object-header {
    border-bottom: unset;
}

.object-header .icon-tags {
    position: relative;
    bottom: unset;
    right: unset;
    margin-left: 10px;
}

.transaction-item:hover {box-shadow: 0 0 0px 1px #2c71f0;}

.object-header .type {
    min-width: 70px;
    max-width: 70px;
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
}


.object-body div.itemlist {height: 200px;width: 100%;padding: unset;border-radius: unset;box-shadow: unset;border: unset;border-top: 1px solid #ececec8f;}


.object-body i.icon.fa.fa-shopping-cart {
    font-size: 8px;
    top: 7px;
    left: 7px;
}

.customer-card i.has-action {
    color: #4d82ef !important;
    transition: all 200ms;
    cursor: pointer;
}

.customer-card i.has-action:hover {
    transform-origin: center center;
}

.parallel-customer-container{
	width: 95%;
	margin: auto;
	display: flex;
	flex-wrap: wrap;
	justify-content: space-evenly;
	margin-bottom: 100px;
}

.transaction-item.medium {
}

center {}

.transaction-item .sub-range {
    text-align: center;
    font-size: 15px;
    display: flex;
    align-items: center;
}

.transaction-item .sub-range i {
    margin: 0px 10px;
    font-size: 7px;
}

.remote-order-screen {
    width: 700px;
    height: 500px;
}

.topbar.remote-entry-topbar.main-topbar {
}

.topbar .next.white.exit {
    margin-left: auto;
}

.encapsulation-topbar .next, .topbar .next, .next.right {
    top: unset;
    left: unset;
    margin-right: 20px;
    margin-left: auto;
    transform: unset;
    position: relative;
    bottom: unset;
    transform: translate(8px, 0px) scale(0.8);
}

.topbar div.first {
    margin-left: 30px;
}

.topbar>* {
    position: relative;
}

.next:not(.error):hover {
    box-shadow: 0 0 5px #00000059;
}

.topbar .item {
    margin-left: 5px;
    margin-right: 5px;
}

.item.search {
}

.view-transaction {
	width: 1200px;
	height: 750px;
}

.view-transaction .transaction-item {
    margin: auto;
    margin-top: 80px;
}

.view-transaction .main>.finish-list {
    width: 90%;
    bottom: 20px;
    position: absolute;
}

.view-transaction .content .finish-item>i {
    margin-right: 20px;
}

.view-transaction .content>.finish-list {
    width: 90%;
}

.red {
}

.create-transaction .transaction-item {
    margin-top: 0px !important;
    flex-grow: 0;
    margin-bottom: 0px;
}

.create-transaction .vertical-middle {
    height: 80%;
    position: absolute;
    width: 100%;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.transaction-item .finish-item:last-of-type {
    margin-bottom: 5px;
}

.transaction-item.limited .object-body {
    max-height: calc(244px - 45px);
}

.edit-transaction .finish-item p i {
    margin-right: 20px;
}

.view-transaction i.fa.fa-question-circle {
    margin-right: 13px;
}

.active-indicator {
    width: 4px;
    height: 4px;
    border-radius: 100%;
    position: absolute;
    top: calc(45px / 2);
    left: 9px;
    transform: translate(0,-50%);
    z-index: 2;
}

.green {
}

.active-indicator.active {
    background-color: green;
}

.active-indicator.inactive {
    background-color: red;
}

.live-object.order-item {
    height: fit-content;
    width: auto;
    padding: 35px 20px 10px 20px;
    display: flex;
    justify-content: left;
    border-bottom: 1px solid #00000029;
    position: relative;
    transition: all 200ms;
}

.live-object .monitors {
    height: 100%;
    width: fit-content;
    display: flex;
    flex-direction: column;
    align-items: center;
}

.live-object .monitors>* {
    margin-top: 2px;
    margin-bottom: 2px;
    font-size: 9px;
}

.live-object .monitors>.inactive {
    color: #00000021;
}

.live-object .body {
    width: -webkit-fill-available;
    padding-left: 16px;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.live-object .order-item .type {
    font-weight: 100;
}

.live-object.order-item {
    font-weight: lighter;
    cursor: pointer;
}

.order-item .type {
    font-size: 16px;
    position: absolute;
    top: 10px;
    left: 20px;
}

.order-item .time {
    position: absolute;
    top: 7px;
    right: 12px;
    font-size: 10px;
}

.live-object.order-item:hover {background-color: #fafafa;}

.order-item .person {
    font-size: 12px;
}

.yellow {
    color: #f37916;
}

.queue-item .transaction-item.minimize {
    position: absolute;
    margin: unset;
    top: 20px;
    right: 20px;
    transition: all 200ms;
    transform: scale(.4);
    transform-origin: top right;
}

.queue-item .transaction-item.minimize:hover {
    transform: scale(1);
}

.queue-item .finish-list.order-options {
    width: 580px;
    bottom: 160px;
    position: absolute;
}

.queue-column {
    width: 500px;
}

.note {
    max-width: 270px;
}

.queue-item>.itemlist {
    width: 500px;
    margin: auto;
    margin-top: 170px;
}

.queue-item .transaction-item:not(.minimize) {
    margin-top: 110px;
}

.product .product-info, .flow .flow-info {
    width: -webkit-fill-available;
    margin-right: auto;
    height: 100%;
    margin-top: 20px;
}

.product .product-info h2 {
		margin-top: 0;
		margin-left: 0;
		text-align: center;
		overflow: hidden;
		white-space: nowrap;
		max-width: 100%;
		text-overflow: ellipsis;
		margin: auto !important;
		margin-bottom: 10px;
}


.product .product-info>p {
		margin-left: 0;
		text-align: center;
		overflow: hidden;
		white-space: nowrap;
		max-width: 100%;
		text-overflow: ellipsis;
		margin: auto !important;
		margin-top: 5px !important;
		margin-bottom: -20px;
		font-size: 12px;
		height: 14px;
}

.product.product-small .product-info>p {
		margin-left: 0;
		text-align: center;
		overflow: hidden;
		white-space: nowrap;
		max-width: 100%;
		text-overflow: ellipsis;
		margin: auto !important;
		margin-top: 3px !important;
		margin-bottom: -20px;
		font-size: 8px;
		height: 14px;
}

.product-image {
    width: 200px;
}

.product .product-info i.fa.fa-arrow-right {
}

.product:hover {}

.topbar>i.fa.fa-arrow-left.back {
    z-index: 2;
    font-size: 17px;
    position: relative;
    margin-left: unset;
    top: 0;
    left: 0;
    margin-left: 35px;
    margin-right: -14px;
}

.topbar i.fa.fa-arrow-left.back {
    position: relative;
    top: 0;
    left: 0;
    margin-left: 35px;
    margin-right: 0px;
}

.product-image, .system-image {
    width: 200px;
    height: 200px;
    justify-content: center;
    display: flex;
    margin-right: 40px;
    position: relative;
}

.product-card .product-options .finish-list {
}

.variant .flex, .flex {
    display: flex;
    flex-direction: row;
}

.product-card .flex.product-head {
    padding: 40px;
    justify-content: space-around;
    border-bottom: 1px solid #00000012;
    height: 220px;
}

.product-card .product-options, .product-card .product-tags {
    width: -webkit-fill-available;
    width: 382px;
    position: relative;
}

.product-card .title {
    margin-bottom: -20px;
    margin-left: 40px;
    font-size: 24px;
    color: #4e4e4e;
}

.product-options h3, .product-tags h3 {
    margin-top: 15px;
    margin-bottom: 25px;
}

.product-card .variants-list {
    margin: auto;
    width: 700px;
    margin-top: 40px;
    position: relative;
}

.variant {
    width: 370px;
    height: 350px;
    box-shadow: 0 0 4px #0000003d;
    border-radius: 4px;
    margin: 20px;
    position: relative;
    display: flex;
    flex-direction: column;
    padding-top: 40px;
}

.variant .product-image {
    height: 130px;
    width: 130px;
    justify-content: center;
    display: flex;
    margin-right: 0;
}

.variant .data-body {
    font-family: monospace;
}

.variant .table {
    margin-left: 1px;
    font-size: 10px;
    font-family: monospace;
    width: 160px;
    margin-right: 10px;
}

.variant input {
    width: 95px;
    border-radius: 0;
}

.variant .modify {
    margin-left: auto;
    margin-right: 40px;
    font-size: 20px;
}

.variant .variant-option-data {
    margin-left: 0px;
    font-size: 13px;
    width: fit-content;
    min-width: 100px;
    text-transform: capitalize;
    margin-top: 20px;
    position: absolute;
    top: 0px;
}

.variant .table.sku {
    margin-left: auto;
    margin-right: 20px;
    width: 180px;
}


.product-image.editable:hover img {
    filter: brightness(0.5);
}

.product-image .modify {
    display: none;
    position: absolute;
    z-index: 12;
}

.product-image:hover modify {
    display: block;
}

.product-image.editable:hover .modify {
    display: flex;
    flex-direction: column;
    top: 50%;
    transform: translate(0,-50%);
    font-size: 30px;
    color: white;
}

.product-image .fa {
    padding: 20px;
}

.variant-count .fa-plus {
    font-size: 18px;
    float: right;
    margin-right: 38px;
    cursor: pointer;
}

.variants-list .add {
    position: absolute;
    right: 40px;
    left: unset;
    margin-top: 4px !important;
}

.variant:last-of-type {
}

.edit-variant {
    width: 1200px;
    height: 700px;
}

.edit-variant .finish-list.variant-options {
}

.edit-variant .variant-head {
    display: flex;
}

.edit-variant .variant-head {
    margin-top: 35px;
    margin-left: 40px;
    margin-right: 40px;
    justify-content: center;
    align-items: start;
    padding-bottom: 40px;
    border-bottom: 1px solid #0000000d;
}

.edit-variant .other.finish-list {
    margin-top: 30px;
    width: 80%;
}

.topbar.white .item.open {
    outline: 1px solid #00000029;
}

.tab-list {
    height: 50px;
    box-shadow: 0px 2px 4px #0000001a;
    display: flex;
    align-items: center;
}

.tab-list .item {
    width: fit-content;
    padding: 16px 50px;
    overflow: hidden;
    border-right: 1px solid #0000000f;
}

.tab-list .item:hover {
    background-color: #00000005;
    cursor: pointer;
}

.tab-list .item:last-of-type {
    border-right: unset;
}

.tab-page {
    position: relative;
    overflow: hidden;
    width: 100%;
}

.variant .data-body {
    height: 80px;
    display: flex;
    align-items: center;
    text-transform: uppercase;
    flex-wrap: wrap;
}

.variant-option-data {}

.variant .data-body .data {
    margin-right: 40px;
    height: 16px;
}

.variant-sub-data {
    height: 32px;
    margin-top: 20px;
    align-items: start;
    justify-content: center;
    display: flex;
    flex-wrap: wrap;
    flex-direction: column;
}

.variant .data-body .data:first-of-type {
}

.d-label {display: inline-block;width: 40px;}

.edit-variant .product-image {
    width: 280px;
    height: 200px;
    display: flex;
}

.notice {
    text-align: center;
    margin-top: 50px;
    font-weight: lighter;
}

.product-selector, .document-selector {
    width: 710px;
    height: 560px;
}

.product-boxed .product-image {
    width: 200px;
    height: 200px;
    margin-right: unset;
}

.product-boxed {
    width: 250px;
    height: 280px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    padding: 15px;
    position: relative;
    overflow: hidden;
    cursor: pointer;
}

.product-boxed p {
    width: 100%;
    height: 16px;
    overflow: hidden;
    margin-left: unset;
    white-space: nowrap;
    margin-top: 30px;
    text-align: center;
    text-overflow: ellipsis;
}

center {}

.product-boxed:hover .product-image {filter: brightness(0.5);}

.product-selector .products {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    margin: auto;
    margin-top: 40px;
    margin-bottom: 40px;
}

.product-small {
    width: 200px;
    height: 218px;
}

.product-small .product-image {
    width: 180px;
    height: 125px;
    margin-top: 0px;
}

.product-small .product-info h2 {font-size: 11px;}

.product-small .modify {
    margin-right: 10px;
    font-size: 13px;
    flex-shrink: 0;
}

.detail .product-image {
    height: 250px;
    width: 250px;
}

.detail .detail-head {
    margin: 40px;
    display: flex;
    align-items: center;
}

.detail-head .finish-list {
    width: 55%;
    left: unset;
    position: relative;
    transform: unset;
    margin: auto;
}

.next.error {
    background-color: #e83c3cc9 !important;
}

.next.error i.fa {
    top: 49%;
}

.series-card .topbar i.fa.fa-edit {
    margin-left: auto;
}

.series-card .topbar i.fa.fa-trash {
    margin-right: 30px;
}

.series-card .topbar i {
    cursor:pointer;
}

.topbar i.fa.fa-angle-left.back {
    position: relative;
    top: 0;
    left: 0;
    margin-left: 15px;
    margin-right: -30px;
}

.object-list{
    margin-top: 30px;
    display: flex;
    flex-direction: column;
    justify-content: start;
    align-items: center;
    width: 90%;
    position: relative;
    flex-wrap: wrap;
    justify-content: center;
    flex-direction: row;
    margin: auto;
    margin-bottom: 30px;
    margin-top: 30px;
    flex-wrap: wrap;
}

.flow i.fa.fa-project-diagram {font-size: 25px;margin-top: 0;margin-bottom: 60px;}

.flow .flow-info {
    margin-top: 0px;
    margin-bottom: 20px;
}

.block-editor {
    width: 100%;
    height: calc(100% - 50px);
}

.flow.ui-list-item {
    height: 113px;
}

.flow h2 {
    margin: 5px;
}


.page .add:not(button) {
    margin-top: 30px;
}

.modal.edit-flow {
    width: 600px;
    height: 400px;
}

.modal.manage-flow {
    width: 600px;
    height: 400px;
}

.modal.flow-point-select {
    width: 700px;
    height: 500px;
}

.flow-point-select .search {
    margin-right: 30px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 220px;
}

.modal.upload-flow-script {
    width: 570px;
    height: 350px;
}

.upload-flow-script input[type="file"] {
    width: 240px;
}


.modal.customer-select {
    width: 95%;
    height: 85%;
    overflow: hidden;
    background-color: #63a7ff;
}

.modal.customer-select iframe {
    width: 100%;
    height: calc(100% - 50px);
    border-radius: 3px;
    overflow: hidden;
    border: unset;
}

.customer-select .topbar .next {
    margin-left: 30px;
}

body.plain > .customer-card {
    top: 0px;
    height: 100%;
}

.search-sidebar h2 {
    margin-bottom: 3px;
    margin-top: 23px;
    margin-left: auto;
}

.create-transaction .customer.ui-list-item {transform-origin: top right;transform: scale(.6);position: absolute;right: 60px;}

.create-transaction .name-container {
    height: 135px;
}


.customer-card.flagged .card-name:not(.add-name) {
}

.customer-card .main>.status {
    right: unset;
    left: 20px;
    top: 25px;
    color: #3d3d3d;
    display: flex;
    flex-direction: column;
    justify-content: start;
    background-color: white;
    border-radius: 6px;
    border: 1px solid #3b3b3b;
}

.customer-card .status>* {
    margin-bottom: 17px;
}

.revision.flagged.open {
    background-color: #ff9720;
    color: white;
}

.revision.flagged {
    background-color: #ff97205c;
}

.customer.flagged .customer-header {
    background-color: #ff8800;
    color: white;
}

.customer.flagged i.fa {
    color: white;
}

.customer.flagged.population-selected {
    box-shadow: 0 0 0px 2px #ff8800;
}

.customer.flagged i.fa-flag {
    margin-left: auto;
    margin-right: 20px;
    font-size: 13px;
}

.flagged *:not(.pii-container)>.card-names>.card-name[contenteditable] {
    background-color: #ff9720bf;
}

.customer-card .finish-item.flagged-object {
    background-color: #ffa0004d;
    border-radius: 6px;
}

.transaction-item.flagged-object {
    box-shadow: 0 0 0px 1px #ffa000;
}
.modal.revision-menu {
    width: 900px;
    height: 600px;
}

.page {
    overflow-y: scroll;
    overflow-x: hidden;
    height: calc(100% - 50px);
    position: relative;
    z-index: 1;
    transition: all 300ms;
}

.encapsulate.encapsulate-presentation {
    width: 100%;
    height: 100%;
    position: fixed;
    background-color: white;
    z-index: 4;
    top: 0;
}

.flag-select .customer-card {
    position: absolute;
    transform: rotate(0deg);
    width: calc(100% - 250px);
    left: 250px;
    height: calc(100%);
}

.flag-action-bar {}

.flag-action-bar {
    background-color: white;
    position: absolute;
    position: absolute;
    height: calc(100% - 50px);
    bottom: 0px;
    width: 60px;
    right: 0px;
    box-shadow: 0 0 5px 0 #00000033;
    display: flex;
    flex-direction: column;
    align-items: center;
    z-index: 1;
    transition: all 200ms;
    transform: translateX(0px);
}

.flag-action-bar.right {
    transform: translateX(110%);
}

.encapsulate .page {
    height: 100%;
}

.next.relative {
    bottom: unset;
    transform: unset;
    left: unset;
}

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

.next.flag-queue {
    margin: auto;
    margin-bottom: 10px;
}

.central-actions {
    width: 200px;
    margin-right: auto;
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
}

.modal.flag-select {
    width: 1246px;
    height: 700px;
}

.flag-select .next.release {
    background-color: green;
}

.notification.move-left {
    transform: translateX(95%);
}

.status i.fa.fa-flag.has-action:hover {
    transform: scale(1.1);
    transition: all 200ms;
    cursor: pointer;
    filter: invert(1);
}

.splash {
    width: 100%;
    height: 100%;
    position: fixed;
    background-color: #63a7ff;
    z-index: 1000;
    display: flex;
}

.splash img {
    width: 100px;
    object-fit: cover;
    position: relative;
    margin: auto;
    transform: translateY(-55px);
}

[point-set='access-management-topbar'][point='users'] .finish-list {
    width: 60%;
    margin-top: 30px;
}

[point-set='access-management-topbar'][point='keys'] .finish-list {
    width: 60%;
    margin-top: 30px;
}

.topbar.white.retract {margin-top: -60px; margin-bottom:10px;}

.modal.invoice {
    width: 8.5in;
    height: 11in;
    max-height: 90%;
    max-width: 90%;
}

.modal.invoice .demon-large-item {
    box-shadow: unset;
    margin-top: 30px;
    margin-bottom: 20px !important;
    margin: 8px 20px 30px 20px;
}

.population-list-export .next.clear {
    background-color: #3f51b5;
}

.freeze * {
  -webkit-transition: none !important;
  -moz-transition: none !important;
  -o-transition: none !important;
  -ms-transition: none !important;
  transition: none !important;
}

.page.extend {
    height: 100%;
}

.modal.onboard-first {
    width: 1000px;
    height: 600px;
}

.page.content {
    position: absolute;
    top: 50px;
}

.user-detail i.fa.fa-user {
    margin-right: 7px;
}

.user-detail {
    padding: 6px 14px;
    border-radius: 5px;
    overflow: hidden;
    white-space: nowrap;
    flex-shrink: 0;
}

.modal.user-actions {
    width: 600px;
    height: 400px;
}

[point='overview'] .demon-large-item {
}

[point='modules'] .finish-list {
    margin-top: 0px;
}

.product-list, .object-list {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: center;
    margin-top: 40px;
    margin-bottom: 40px;
}


.topbar i.fa-plus.add {
    margin-left: auto;
    margin-right: 30px;
    cursor: pointer;
    left: unset;
    top: unset;
    margin-top: unset;
}

.sequenced-item {
    width: 600px;
    height: 260px;
    margin: 20px auto;
    display: flex;
    flex-direction: row;
    box-shadow: 0 0 4px #0000003d;
    padding: 20px;
    border-radius: 6px;
}

.sequenced-item:first-child {
}

.sequenced-item .product-small {
    box-shadow: unset;
    margin: unset;
    width: 250px;
}

.sequenced-item .finish-list i {
    margin-left: 15px;
}

.edit-series-item {
    width: 700px;
    height: 500px;
}

.nothing-to-show {
    text-align: center;
    position: absolute;
    left: 50%;
    transform: translate(-50%, -50%);
    top: 38%;
    white-space: nowrap;
}

.nothing-to-show h2 {
    margin: unset;
}

.nothing-to-show .fa {
    margin-bottom: 20px;
}

.nothing-to-show * {
    color: #4d4d4d !important;
}

.edit-variant .variant-options {
    position: relative;
    height: 200px;
    width: -webkit-fill-available;
    border-radius: 6px;
}

.topbar-push {
    margin-left: auto;
    margin-right: 30px;
}

.action {
    cursor: pointer;
}

.modal.edit-image {
    width: 700px;
    height: 500px;
}

.edit-image [point='address'] .system-image {
    margin-left: 30px;
}

.edit-image .flex {
    margin-top: 30px;
}

[point='address'] input {
    width: 212px;
}

.variant-options .nothing-to-show {top: 48%;}

.variant .body {
    width: 300px;
    margin-top: 20px;
}

.variant .finish-list {
    margin-top: unset;
    font-size: 12px;
}

.variant .flex {
    justify-content: space-around;
    margin-bottom: 10px;
}

.campaign h2 {
		margin-left: 0;
		text-align: center;
		overflow: hidden;
		white-space: nowrap;
		text-overflow: ellipsis;
		/*margin-bottom: 10px;
		/margin-top: 20px;*/
		margin: 10px auto;
		max-width: 100%;
		margin-bottom: 7px;
}

.campaign {
    margin: 21px;
    width: 380px;
    border-radius: 7px;
    position: relative;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    box-shadow: 0 0 4px #0000003d;
    height: 375px;
    position: relative;
}

[point-set='campaign-card-sidebar'] iframe {
    width: 100%;
    height: 100%;
    border: unset;
    display: block;
}


.campaign-mailing {
    margin: 20px;
    width: 330px;
    border-radius: 7px;
    position: relative;
    overflow: hidden;
    display: flex;
    align-items: center;
    flex-direction: column;
    box-shadow: 0 0 4px #0000003d;
    padding: 20px 20px;
    height: 120px;
}

.campaign-mailing>h2 {
    margin-left: unset;
}

[point-set='campaign-mailing-sidebar'] iframe {
    width: 100%;
    height: 100%;
    display: block;
    border: unset;
}




[point-set='campaign-mailing-sidebar'] iframe {
    width: 100%;
    height: 100%;
    display: block;
    border: unset;
}


.user {
    margin: 21px;
    width: 195px;
    position: relative;
    overflow: hidden;
    display: flex;
    align-items: center;
    flex-direction: column;
    box-shadow: 0 0 4px #0000003d;
    padding: 20px 20px;
    height: 241px;
    border-radius: 6px;
}

.user.key h2 {
    margin-top: 5px;
}

.user.key {
}

.user.key small {
    font-size: 11px;
}

.user h2 {
    margin-top: 10px;
}

.mailing-item {
    margin: 21px;
    width: 380px;
    border-radius: 7px;
    position: relative;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    box-shadow: 0 0 4px #0000003d;
    height: 375px;
    position: relative;
}

.mailing-item:first-child {
}

.mailing-item .finish-item i {
}

.switch.disabled {filter: grayscale(.6);cursor: no-drop;}

.switch.disabled::after {
    background-color: white;
}

.mailing-results-small {
    width: 250px;
    position: relative;
}

.mailing-item h2 {
    margin: unset;
    margin-bottom: 15px;
}

.mailing-item .finish-list {
    font-size: 13px;
}

.mailing-item .fa-check {
    color: green;
}

.mailing-item .flex>div>p {
}

.linear-list {
    margin-top: 60px;
    margin-bottom: 60px;
}

.create-transaction .desc {
    text-align: right;
}

.select-campaign.modal {
    width: 800px;
    height: 600px;
}

.select-address.modal {
    width: 800px;
    height: 600px;
}

.document {
    width: 330px;
    margin: 21px;
    width: 185px;
    border-radius: 7px;
    position: relative;
    overflow: hidden;
    display: flex;
    align-items: center;
    flex-direction: column;
    box-shadow: 0 0 4px #0000003d;
    padding: 20px 20px;
    height: 230px;
}

.document>.fa {
    font-size: 58px;
    margin-top: 30px;
    margin-bottom: 30px;
}

.document h2 {
    margin: 0 auto;
    margin-top: 10px;
    text-align: center;
    overflow: hidden;
    white-space: nowrap;
    max-width: 100%;
    text-overflow: ellipsis;
    margin-bottom: 10px;
    font-size: 15px;
}

.document .document-info {
    width: -webkit-fill-available;
    margin-right: auto;
    height: 100%;
    margin-top: 20px;
}

.document .fa-cog {
    font-size: unset;
    position: absolute;
    bottom: 2px;
    right: 20%;
}

div#html-container {
    height: 100%;
}



.tox-toolbar-overlord {
    margin-top: -1px !important;
}

.tox-toolbar__primary {
    position: relative !important;!i;!;!I;!;
    width: 100% !important;
}

.tox-sidebar-wrap {
    margin-top: 38px !important;
}

.custom-page-size.modal {
    width: 500px;
    height: 300px;
}

.page-setup.modal {
    width: 1000px;
    height: 600px;
}

.modal.merge-menu {
    width: 700px;
    height: 500px;
    z-index: 68;
}

.subscription-model {
    width: 500px;
    height: 300px;
    box-shadow: 0 0 4px #0000003d;
    border-radius: 6px;
    margin: 20px auto;
    overflow: hidden;
}

.subscription-model>p {
    margin-left: 30px;
    font-size: 16px;
}

.subscription-model i.fa.fa-cog {
    margin-left: auto;
    margin-right: 30px;
    cursor: pointer;
}

.edit-series-subscription-model {
    width: 800px;
    height: 500px;
}

.bulk-actions-menu.modal {
    width: 806px;
    height: 600px;
}

.create-mailing.modal {
    width: 600px;
    height: 400px;
}

.customer[noclick] {
    cursor: no-drop;
}

.customer i.fa-minus-circle {
    margin-left: auto;
    margin-right: 20px;
    color: red;
    font-size: 12px;
    cursor: pointer;
}

.topbar.white {
    padding: 0px 0;
}

.display-item.no-sep {
    border-right: unset;
}

.personal-info li, .object-container:not(.basic) li:not([category]) {padding-left: 40px !important;}

.iso-lookup-tab .finish-list {
    margin-top: 0px;
}

.finish-item.selectable.warn {
    background-color: #ffc04c;
    padding-left: 50px;
}

.finish-item.selectable.warn i.fa-exclamation-triangle {
    margin-right: 5px;
    margin-bottom: 5px;
    position: absolute;
    top: 50%;
    transform: translate(-31px, -50%);
}
.customer-info.notes .finish-list {
    margin-top: 0px;
}

datalist {
    display: none !important;
}

.user i.fa.fa-user, .user i.fa.fa-key {
    font-size: 35px;
    margin-top: 34px;
}

.view-credential .finish-list {
    width: 80%;
    margin-top: 30px;
    margin-bottom: 60px;
}

.modal.create-restriction {
    width: 600px;
    height: 400px;
}

.modal.refactor-product-variants {
    width: 950px;
    height: 650px;
}

.refactor-product-variants .finish-item .fa.action {
    transform: translateY(2px);
}


.refactor-product-variants div#options {
    transform: unset;
    left: unset;
    margin-top: unset;
}

.refactor-product-variants .finish-item {
    padding-top: 4px;
    padding-bottom: 4px;
    font-size: 13px;
}

.refactor-product-variants .finish-list {
    left: unset;
    transform: unset;
    margin-top: unset;
}

.refactor-product-variants input[type="text"] {
    width: 130px;
    font-size: inherit !important;
    padding: 3px;
    padding-right: 10px;
}

input[type="datetime-local"] {
    width: 220px !important;
    padding-left: 10px !important;
}


.campaign .display-item {
    max-width: 300px;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.campaign.small-campaign-card {
    height: 50px;
    width: 700px;
    margin: 5px;
    box-shadow: 0 0 2px 0 #00000054;
    border-radius: unset;
    padding: 2px;
    border-radius: 3px;
}

.campaign.small-campaign-card>.topbar {
    box-shadow: unset;
}
.campaign-mailing.small-mailing-card>.topbar {
    box-shadow: unset;
}

.campaign-mailing.small-mailing-card {
    height: 50px;
    width: 700px;
    margin: 5px;
    box-shadow: 0 0 2px 0 #00000054;
    border-radius: unset;
    padding: 2px;
    border-radius: 3px;
}


.modal.customer-toolbox {
    width: 700px;
    height: 500px;
}

.modal.merge-customers {}

.modal.merge-customers {
    width: 600px;
    height: 400px;
}

input[type="radio"] {
    width: unset;
    height: unset;
    padding: unset;
    -webkit-appearance: radio;
    cursor: default;
    border: unset !important;
    outline: none !important;
    border-radius: unset;
}

input[type="checkbox"] {
    width: unset;
    height: unset;
    padding: unset;
    -webkit-appearance: checkbox;
    cursor: default;
}

.flag-select .page>.finish-list {
    margin-top: unset;
}

.flag-select .history-sidebar i.fa.fa-arrow-left.back {
    display: none !important;
}

.checklist {
}

.path-vertical .checklist {
    text-align: left;
    padding-top: 13px;
    padding-bottom: 13px;
    margin-left: 40px;
    position: relative;
    transition: all 100ms;
    display: flex;
    align-items: center;
    user-select: none; -webkit-user-select: none;
}

.flow-bubble {
    width: 30px;
    height: 30px;
    background-color: #353535;
    border-radius: 100%;
    position: relative;
    transform: translate(-50%, 0px);
    z-index: 2;
    margin-right: 10px;
    box-shadow: 0 0 18px 2px #0000003b;
    transition: all 100ms;
    flex-grow: 0;
    flex-shrink: 0;
}

.flow-line {
    position: absolute;
    width: 17px;
    background-color: #adc8ff;
    left: 0px;
    top: 50%;
    height: 100%;
    transform: translate(-50%, 0px);
    box-shadow: 0 0 6px 0 #00000030;
    transition: all 100ms;
}

.checklist:not(.open):not(.active) .flow-line-top {
}

.checklist.open .flow-line, .checklist:not(.open):not(.active) .flow-line {
    background-color: #f2f2f2;
    outline: 2px dotted;
    outline-offset: -2px;
}

.active .flow-bubble {
    background-color: #adc8ff;
}

h3 {}

.checklist h3 {
    margin: unset;
}

.checklist i.fa.fa-lock {
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    color: #cccccc;
    font-size: 12px;
}

.checklist.open .flow-bubble {
    background-color: #558dff;
}

.checklist.open .fa, .checklist.active .fa {
    display: none;
}

.checklist.active .fa {}

.checklist.locked {
    cursor: not-allowed;
}

.checklist {
    cursor: pointer;
    position: relative;
}

.checklist:not(.locked):hover .flow-bubble{
    background-color: #75a2ff;
}

.checklist.locked:hover .flow-bubble .fa{
    color: white;
}

.checklist.locked:hover .flow-bubble{
    background-color: #262626;
}

.checklist.outline-hover-path .flow-line {
    outline: 2px solid #adc8ff !important;
    background-color: #adc8ff !important;
}

.checklist.outline-hover .flow-bubble {
    background-color: #adc8ff;
}

.checklist.outline-hover-path .flow-bubble{
    background-color: #adc8ff;
}

.checklist.outline-hover-exclude .flow-line, .checklist.outline-hover .flow-line {
    filter: opacity(.6);
    /*outline: 2px dotted;
    outline-offset:-2px;*/
}

.checklist.outline-hover-exclude .flow-bubble {
    background-color:#353535;
}

.checklist.outline-unreachable {
    cursor: not-allowed !important;
}

.checklist.outline-unreachable:hover .flow-bubble {
    background-color: #353535;
}

.sidebar-retracted i.fa.fa-arrow-right {
    position: absolute;
    top: 0;
    right: 0;
    width: 50px;
    height: 10000%;
    text-align: right;
    cursor: pointer;
    transform: translate(0px, 0px);
}

.sidebar.sidebar-retractable:not(.sidebar-retracted) i.fa.fa-arrow-right {
    display: none;
}

.sidebar-retracted .fa-arrow-right::before {
    position: relative;
    top: 20px;
    right: 18px;
}

.sidebar-retracted i.fa.fa-arrow-right:hover {
    background-color: #00000008;
}

[path-set='fulfill-path'] .itemlist {
    width: 70%;
    margin: auto;
    margin-top: 60px;
}

.path {
    position: relative;
    margin: auto;
    display: flex;
    flex-direction: row;
    align-items: center;
    width: fit-content;
    margin-top: 20px;
    padding-bottom: 30px;
    margin-bottom: 20px;
}

.path .checklist .flow-line {
    height: 17px;
    width: 100%;
    left: 15px;
    transform: translate(0%, -50%);
}

.path .checklist {
    padding-right: 40px;
    align-items: center;
    display: flex;
}

.path .flow-bubble {
    margin-right: unset;
    transform: translate(0px);
}

.path .checklist:last-of-type {
    padding-right: unset;
    width: 30px;
}

.path .checklist h3 {
    position: relative;
    transform: translate(calc(-50% + -15px), 30px);
    white-space: nowrap;
}

.checklist.list-in .flow-line {
    transform: rotate(-17deg);
}

.checklist.list-out .flow-line {
    transform: rotate(17deg) translate(-100%, 0);
}

.sidebar .checklist:hover {
    border-right: 3px solid #75a2ff;
}

.sidebar .checklist.locked:hover {
    border-right: none;
}

.queue-select .page>.itemlist {
    width: 70%;
    margin: auto;
    margin-top: 105px;
}

.checklist.list-tabbed {
    margin-left: 57px;
}

.modal.edit-product {
    width: 800px;
    height: 500px;
}

.create-transaction [point-set="subscription-config-topbar"] .itemlist {
    width: 80%;
    margin: auto;
    margin-top: 80px;
}

.modal.migrate-transaction {
    width: 500px;
    height: 300px;
}

.transaction-item.highlight {
    box-shadow: 0 0 0px 1px #2c6ff0;
}

.modal.edit-transaction-cart {
    width: 700px;
    height: 480px;
}

.modal.edit-transaction-cart .itemlist {
    width: 80%;
    margin: auto;
    margin-top: 50px;
}

.create-document.modal {
    width: 800px;
    height: 500px;
}

.modal.create-communication {
    width: 600px;
    height: 400px;
}

.modal.set-communication-recipients {
    width: 500px;
    height: 300px;
}

.payment-methods {
    height: 500px;
}

.modal.add-payment-method {
    width: 900px;
    height: 550px;
}

.modal.billing-information {
    width: 750px;
    height: 500px;
}

.demon-large-item.notification-settings .finish-list {
    margin-top: 30px;
    width: 95%;
}

ul {
    font-weight: lighter;
}

li, li[openable]>.open {}

.popover ul li:hover {outline: 1px solid #e8e8e8;}

ul[list] li {
    display: flex;
    justify-content: space-between;
    padding: 0.83em 30px;
    align-items: center;
    border-bottom: 1px solid #ececec8f;
    position: relative;
    align-items: center;

background-color: white;}

ul[list] li:last-of-type {
    border-bottom: unset;
}

li[openable], li[category] {display: block !important;cursor: pointer;user-select: none; -webkit-user-select: none;padding: 0px 0px !important;}

li[openable]>ul, li[category]>ul {border-left: 1px dashed #666666;width: calc(100% - 21px) !important;margin-left: 20px !important;transform: unset;}

li[openable]>.open, li[category]>.category {left: 0;top: 0;position: relative;display: flex;justify-content: space-between;align-items: center;padding: .8em 30px;}

li[openable] .open:hover {
    background-color: #f3f3f3;
    cursor: pointer;
}

li[openable][open]>.open>.fa-angle-right {
    transform: translate(-2px, 0px) rotate(90deg);
    transition: all 200ms;
}

li[openable]>.open>.fa-angle-right {
    transform: translate(-2px, 0) rotate(0);
    transition: all 200ms;
}

li[openable][open] {
    height: fit-content;
}

li[openable]:not([open])>ul {
    display: none;
}

li[category][hidden]>ul {
    display: none;
}

li[openable]>ul>li:first-of-type, li[category]>ul>li:first-of-type {
    border-top: 1px solid #00000008;
}

.edit-address-component.modal {
    width: 800px;
    height: 600px;
}

.popover li>i {
    margin-left: 20px;
    width: 20px;
    text-align: center;
}

p.preview {
    margin-right: 30px;
    margin-left: auto;
}

.topbar.white.large-topbar {
    transform: unset;
    padding: unset;
    height: 70px;
}

.advanced-search .topbar h2 {
    margin-left: auto;
    margin-right: auto;
}

.advanced-search i.fa.fa-info-circle {
    margin: 0px 10px 0px 0px;
}

.popover.right-top-arrow:before {
    left: unset;
    right: 1px;
    transform: translate(50%, -50%) rotate(45deg);
    top: 11px;
}

.popover.right-top-arrow:after {right: 1px;left: unset;top: 12px;}

.variant .flex {
    flex-direction: column;
    align-items: center;
    margin-top: 15px;
    height: 240px;
    justify-content: space-evenly;
}
.advanced-search ul li {
    background-color: white;
}

.advanced-search .main .value>* {
    margin-left: 10px;
    margin-right: 10px;
}

.advanced-search .main ul {
    height: calc(100% - 16% - 40px);
    overflow: scroll;
    margin-bottom: unset;
    margin-top: unset;
}
.object-selector {
    width: 200px;
    height: 20px;
    border: 1px solid #2a9bff;
    padding: 2px 5px 2px 5px;
    border-radius: 4px;
}

.object-select {
    min-width: 20px;
    transition: all 200ms;
    height: 22px;
    display: inline-flex;
    align-items: center;
    background-color: #4caf50;
    border: 1px dashed #4caf50;
    padding: 5px 20px 5px 15px;
    border-radius: 5px;
    white-space: nowrap;
    overflow: hidden;
    cursor: pointer;
}

.object-select:focus, .object-select:hover  {
}

.object-select i {
    margin-right: 13px;
}

.object-select span {
    width: calc(100%);
    overflow: hidden;
    text-overflow: ellipsis;
}

.object-select[required]:not([set]) {
    background-color: #fff0eb;
    border: 1px dashed #ff8686;
}

.object-select:not([required]):not([set]) {
    background-color: #fbfbfb;
    border: 1px dashed #b7b7b7;
}

.object-select[required]:not([set]) i.fa.fa-stroopwafel {

    color: #792020;
}

.object-select:not([required]):not([set]) i.fa.fa-stroopwafel{
    color:#474747;
}

.object-select[reqired]:not([set]) span {
    color: #b4a9a9;
}

.object-select[set] {
    color: white;
}

.object-select[set] i.fa.fa-ban {
    display: block;
    color: #293b2a42;
}

.object-select i.fa.fa-ban {
    display: none;
}

.object-select[set] i.fa.fa-stroopwafel {
    display: none;
}

.object-select i.fa.fa-stroopwafel {}

.object-select[set]:not([disabled]):hover i.fa.fa-ban {
    color: white;
}

.object-select[set]:not([no-change]):hover {
    background-color: #70b873;
    border: 1px solid #70b873;
}

.object-select:not([reqired]):not([set]) span {
    color: Gray;
}

.object-select:not([required]):not([set]):not([disabled]):hover {
    border: 1px solid #00000087;
}

.object-select[required]:not([set]):not([disabled]):hover {
    border: 1px solid #ff8686;
}


.graph {
    width: 500px;
    height: 250px;
}

.graph {
    border: 1px solid #00000014;
    position: relative;
    flex-grow: 0;
    flex-shrink: 0;
    margin: 10px;
}

.graph {}

.graph .load-throbber {
    top: 50%;
    position: absolute;
}

.topbar.white.fix-pad {
    padding: 0px 20px;
    transform: translateX(-40px);
    width: calc(100% + 20px);
}

.graph .page {
    padding: 20px;
}

[point='usage'] .graph:last-of-type {
    margin-bottom: 30px;
}

.modal.quick-product-information {
    width: 800px;
    height: 600px;
}

.modal.customer-communications {
    width: 1050px;
    height: 700px;
}

.modal.new-customer-communication {
    width: 650px;
    height: 450px;
}

.modal.pdf-preview {
    width: 90%;
    height: 90%;
}

.modal.email-preview {
    width: 90%;
    height: 80%;
}




/* Email Client UI */

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

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

.dropdown, .dropleft, .dropright, .dropup {
    position: relative;
}

svg {
    overflow: hidden;
    vertical-align: middle;
}

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

.flex-wrap {
    -ms-flex-wrap: wrap!important;
    flex-wrap: wrap!important;
}


@media (min-width: 992px) {
    .inbox-wrapper .email-aside .aside-content {
        padding-right: 10px;
    }
}

.inbox-wrapper .email-aside .aside-content .aside-header {
    padding: 0 0 5px;
    position: relative;
}

.inbox-wrapper .email-aside .aside-content .aside-header .title {
    display: block;
    margin: 3px 0 0;
    font-size: 1.1rem;
    line-height: 27px;
    color: #686868;
}

.inbox-wrapper .email-aside .aside-content .aside-header .navbar-toggle {
    background: 0 0;
    display: none;
    outline: 0;
    border: 0;
    padding: 0 11px 0 0;
    text-align: right;
    margin: 0;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    position: absolute;
}

@media (max-width: 991px) {
    .inbox-wrapper .email-aside .aside-content .aside-header .navbar-toggle {
        display: block;
    }
}

.inbox-wrapper .email-aside .aside-content .aside-header .navbar-toggle .icon {
    font-size: 24px;
    color: #71738d;
}

.inbox-wrapper .email-aside .aside-content .aside-compose {
    text-align: center;
    padding: 14px 0;
}

.inbox-wrapper .email-aside .aside-content .aside-compose .btn,
.inbox-wrapper .email-aside .aside-content .aside-compose .fc .fc-button,
.fc .inbox-wrapper .email-aside .aside-content .aside-compose .fc-button,
.inbox-wrapper .email-aside .aside-content .aside-compose .swal2-modal .swal2-actions button,
.swal2-modal .swal2-actions .inbox-wrapper .email-aside .aside-content .aside-compose button,
.inbox-wrapper .email-aside .aside-content .aside-compose .wizard > .actions a,
.wizard > .actions .inbox-wrapper .email-aside .aside-content .aside-compose a {
    padding: 11px;
}

.inbox-wrapper .email-aside .aside-content .aside-nav {
    visibility: visible;
    padding: 0 0;
}

.inbox-wrapper .email-aside .aside-content .aside-nav.collapse {
    display: block;
}

@media (max-width: 991px) {
    .inbox-wrapper .email-aside .aside-content .aside-nav.collapse {
        display: none;
    }
}

@media (max-width: 991px) {
    .inbox-wrapper .email-aside .aside-content .aside-nav.show {
        display: block;
    }
}

.inbox-wrapper .email-aside .aside-content .aside-nav .title {
    display: block;
    color: #3d405c;
    font-size: 12px;
    font-weight: 700;
    text-transform: uppercase;
    margin: 20px 0 0;
    padding: 8px 14px 4px;
}

.inbox-wrapper .email-aside .aside-content .aside-nav .nav li {
    width: 100%;
}

.inbox-wrapper .email-aside .aside-content .aside-nav .nav li a {
    display: -webkit-flex;
    display: flex;
    -webkit-align-items: center;
    align-items: center;
    position: relative;
    color: #71748d;
    padding: 7px 14px;
}

.inbox-wrapper .email-aside .aside-content .aside-nav .nav li a:hover {
    text-decoration: none;
    background-color: rgba(114, 124, 245, 0.1);
    color: #727cf5;
}

.inbox-wrapper .email-aside .aside-content .aside-nav .nav li a .icon svg {
    width: 18px;
    margin-right: 10px;
}

.inbox-wrapper .email-aside .aside-content .aside-nav .nav li a .badge {
    margin-left: auto;
}

.inbox-wrapper .email-aside .aside-content .aside-nav .nav li a svg {
    width: 18px;
    margin-right: 10px;
}

.inbox-wrapper .email-aside .aside-content .aside-nav .nav li.active a {
    color: #ff3366;
    background: rgba(255, 51, 102, 0.1);
}

.inbox-wrapper .email-aside .aside-content .aside-nav .nav li.active a .icon {
    color: #ff3366;
}

.inbox-wrapper .email-content .email-inbox-header {
    background-color: transparent;
    padding: 18px 18px;
}

.inbox-wrapper .email-content .email-inbox-header .email-title {
    display: -webkit-flex;
    display: flex;
    -webkit-align-items: center;
    align-items: center;
    font-size: 1rem;
}

.inbox-wrapper .email-content .email-inbox-header .email-title svg {
    width: 20px;
    margin-right: 10px;
    color: #686868;
}

.inbox-wrapper .email-content .email-inbox-header .email-title .new-messages {
    font-size: .875rem;
    color: #686868;
    margin-left: 3px;
}

.inbox-wrapper .email-content .email-inbox-header .input-search .input-group-btn .btn,
.inbox-wrapper .email-content .email-inbox-header .input-search .input-group-btn .fc .fc-button,
.fc .inbox-wrapper .email-content .email-inbox-header .input-search .input-group-btn .fc-button,
.inbox-wrapper .email-content .email-inbox-header .input-search .input-group-btn .swal2-modal .swal2-actions button,
.swal2-modal .swal2-actions .inbox-wrapper .email-content .email-inbox-header .input-search .input-group-btn button,
.inbox-wrapper .email-content .email-inbox-header .input-search .input-group-btn .wizard > .actions a,
.wizard > .actions .inbox-wrapper .email-content .email-inbox-header .input-search .input-group-btn a {
    border-radius: 0;
    padding: 4.5px 10px;
}

.inbox-wrapper .email-content .email-inbox-header .input-search .input-group-btn .btn svg,
.inbox-wrapper .email-content .email-inbox-header .input-search .input-group-btn .fc .fc-button svg,
.fc .inbox-wrapper .email-content .email-inbox-header .input-search .input-group-btn .fc-button svg,
.inbox-wrapper .email-content .email-inbox-header .input-search .input-group-btn .swal2-modal .swal2-actions button svg,
.swal2-modal .swal2-actions .inbox-wrapper .email-content .email-inbox-header .input-search .input-group-btn button svg,
.inbox-wrapper .email-content .email-inbox-header .input-search .input-group-btn .wizard > .actions a svg,
.wizard > .actions .inbox-wrapper .email-content .email-inbox-header .input-search .input-group-btn a svg {
    width: 18px;
}

.inbox-wrapper .email-content .email-filters {
    padding: 20px;
    border-bottom: 1px solid #e8ebf1;
    background-color: transparent;
    width: 100%;
    border-top: 1px solid #e8ebf1;
}

.inbox-wrapper .email-content .email-filters > div {
    display: -webkit-flex;
    display: flex;
    -webkit-align-items: center;
    align-items: center;
}

.inbox-wrapper .email-content .email-filters .email-filters-left .btn-group,
.inbox-wrapper .email-content .email-filters .email-filters-left .fc .fc-toolbar.fc-header-toolbar .fc-left .fc-button-group,
.fc .fc-toolbar.fc-header-toolbar .fc-left .inbox-wrapper .email-content .email-filters .email-filters-left .fc-button-group,
.inbox-wrapper .email-content .email-filters .email-filters-left .fc .fc-toolbar.fc-header-toolbar .fc-right .fc-button-group,
.fc .fc-toolbar.fc-header-toolbar .fc-right .inbox-wrapper .email-content .email-filters .email-filters-left .fc-button-group {
    margin-right: 5px;
}

.inbox-wrapper .email-content .email-filters .email-filters-left input {
    margin-right: 8px;
}

.inbox-wrapper .email-content .email-filters .email-filters-right {
    text-align: right;
}

@media (max-width: 767px) {
    .inbox-wrapper .email-content .email-filters .email-filters-right {
        width: 100%;
        display: flex;
        justify-content: space-between;
    }
}

.inbox-wrapper .email-content .email-filters .email-filters-right .email-pagination-indicator {
    display: inline-block;
    vertical-align: middle;
    margin-right: 13px;
}

.inbox-wrapper .email-content .email-filters .email-filters-right .email-pagination-nav .btn svg,
.inbox-wrapper .email-content .email-filters .email-filters-right .email-pagination-nav .fc .fc-button svg,
.fc .inbox-wrapper .email-content .email-filters .email-filters-right .email-pagination-nav .fc-button svg,
.inbox-wrapper .email-content .email-filters .email-filters-right .email-pagination-nav .swal2-modal .swal2-actions button svg,
.swal2-modal .swal2-actions .inbox-wrapper .email-content .email-filters .email-filters-right .email-pagination-nav button svg,
.inbox-wrapper .email-content .email-filters .email-filters-right .email-pagination-nav .wizard > .actions a svg,
.wizard > .actions .inbox-wrapper .email-content .email-filters .email-filters-right .email-pagination-nav a svg {
    width: 18px;
}

.inbox-wrapper .email-content .email-filters .be-select-all.custom-checkbox {
    display: inline-block;
    vertical-align: middle;
    padding: 0;
    margin: 0 30px 0 0;
}

.inbox-wrapper .email-content .email-list .email-list-item {
    display: -webkit-flex;
    display: flex;
    -webkit-align-items: center;
    align-items: center;
    border-bottom: 1px solid #e8ebf1;
    padding: 10px 20px;
    width: 100%;
    cursor: pointer;
    position: relative;
    font-size: 14px;
    cursor: pointer;
    transition: background .2s ease-in-out;
}

.inbox-wrapper .email-content .email-list .email-list-item:hover {
    background: rgba(114, 124, 245, 0.08);
}

.inbox-wrapper .email-content .email-list .email-list-item:last-child {
    margin-bottom: 5px;
}

.inbox-wrapper .email-content .email-list .email-list-item .email-list-actions {
    width: 40px;
    vertical-align: top;
    display: table-cell;
}

.inbox-wrapper .email-content .email-list .email-list-item .email-list-actions .form-check {
    margin-bottom: 0;
}

.inbox-wrapper .email-content .email-list .email-list-item .email-list-actions .form-check i::before {
    width: 15px;
    height: 15px;
}

.inbox-wrapper .email-content .email-list .email-list-item .email-list-actions .form-check i::after {
    font-size: .8rem;
}

.inbox-wrapper .email-content .email-list .email-list-item .email-list-actions .favorite {
    display: block;
    padding-left: 1px;
    line-height: 15px;
}

.inbox-wrapper .email-content .email-list .email-list-item .email-list-actions .favorite span svg {
    width: 14px;
    color: #686868;
}

.inbox-wrapper .email-content .email-list .email-list-item .email-list-actions .favorite:hover span {
    color: #8d8d8d;
}

.inbox-wrapper .email-content .email-list .email-list-item .email-list-actions .favorite.active span svg {
    color: #fbbc06;
}

.inbox-wrapper .email-content .email-list .email-list-item .email-list-detail {
    display: -webkit-flex;
    display: flex;
    -webkit-justify-content: space-between;
    justify-content: space-between;
    -webkit-flex-grow: 1;
    flex-grow: 1;
    -webkit-flex-wrap: wrap;
    flex-wrap: wrap;
}

.inbox-wrapper .email-content .email-list .email-list-item .email-list-detail .from {
    display: block;
    font-weight: 400;
    margin: 0 0 1px 0;
    color: #000;
}

.inbox-wrapper .email-content .email-list .email-list-item .email-list-detail .msg {
    margin: 0;
    color: #71738d;
    font-size: .8rem;
}

.inbox-wrapper .email-content .email-list .email-list-item .email-list-detail .date {
    color: #000;
}

.inbox-wrapper .email-content .email-list .email-list-item .email-list-detail .date .icon svg {
    width: 14px;
    margin-right: 7px;
    color: #3d405c;
}

.inbox-wrapper .email-content .email-list .email-list-item.email-list-item--unread {
    background-color: rgba(114, 124, 245, 0.09);
}

.inbox-wrapper .email-content .email-list .email-list-item.email-list-item--unread .from {
    color: #000;
    font-weight: 800;
}

.inbox-wrapper .email-content .email-list .email-list-item.email-list-item--unread .msg {
    font-weight: 700;
    color: #686868;
}

.rtl .inbox-wrapper .email-aside .aside-content .aside-header .navbar-toggle .icon {
    position: absolute;
    top: 0;
    left: 0;
}

.rtl .inbox-wrapper .email-aside .aside-content .aside-nav .nav {
    padding-right: 0;
}

.rtl .inbox-wrapper .email-aside .aside-content .aside-nav .nav li a .icon svg {
    margin-right: 0;
    margin-left: 10px;
}

.rtl .inbox-wrapper .email-aside .aside-content .aside-nav .nav li a .badge {
    margin-left: 0;
    margin-right: auto;
}

.rtl .inbox-wrapper .email-aside .aside-content .aside-nav .nav li a svg {
    margin-right: 0;
    margin-left: 10px;
}

.rtl .inbox-wrapper .email-content .email-inbox-header .email-title svg {
    margin-right: 0;
    margin-left: 10px;
}

.rtl .inbox-wrapper .email-content .email-inbox-header .email-title .new-messages {
    margin-left: 0;
    margin-right: 3px;
}

.rtl .inbox-wrapper .email-content .email-filters .email-pagination-indicator {
    margin-right: 0;
    margin-left: 13px;
}

.rtl .inbox-wrapper .email-content .email-list .email-list-item .email-list-detail .date .icon svg {
    margin-right: 0;
    margin-left: 7px;
}

.email-head {
    background-color: transparent;
}

.email-head-subject {
    padding: 25px 25px;
    border-bottom: 1px solid #e8ebf1;
}

@media (max-width: 767px) {
    .email-head-subject {
        padding: 25px 10px;
    }
}

.email-head-subject .title {
    display: block;
    font-size: .99rem;
}

.email-head-subject .title a.active .icon {
    color: #fbbc06;
}

.email-head-subject .title a .icon {
    color: silver;
    margin-right: 6px;
}

.email-head-subject .title a .icon svg {
    width: 18px;
}

.email-head-subject .icons {
    font-size: 14px;
    float: right;
}

.email-head-subject .icons .icon {
    color: #000;
    margin-left: 12px;
}

.email-head-subject .icons .icon svg {
    width: 18px;
}

.email-head-sender {
    padding: 13px 28px;
}

@media (max-width: 767px) {
    .email-head-sender {
        padding: 25px 10px;
    }
}

.email-head-sender .avatar {
    float: left;
    margin-right: 10px;
}

.email-head-sender .date {
    float: right;
    font-size: 12px;
}

.email-head-sender .avatar {
    float: left;
    margin-right: 10px;
}

.email-head-sender .avatar img {
    width: 36px;
}

.email-head-sender .sender > a {
    color: #000;
}

.email-head-sender .sender span {
    margin-right: 5px;
    margin-left: 5px;
}

.email-head-sender .sender .actions {
    display: inline-block;
    position: relative;
}

.email-head-sender .sender .actions .icon {
    color: #686868;
    margin-left: 7px;
}

.email-head-sender .sender .actions .icon svg {
    width: 18px;
}

.email-body {
    background-color: transparent;
    border-top: 1px solid #e8ebf1;
    padding: 30px 20px;
}

@media (max-width: 767px) {
    .email-body {
        padding: 30px 10px;
    }
}

.email-attachments {
    background-color: transparent;
    padding: 25px 28px 5px;
    border-top: 1px solid #e8ebf1;
}

@media (max-width: 767px) {
    .email-attachments {
        padding: 25px 10px 0;
    }
}

.email-attachments .title {
    display: block;
    font-weight: 500;
}

.email-attachments .title span {
    font-weight: 400;
}

.email-attachments ul {
    list-style: none;
    margin: 15px 0 0;
    padding: 0;
}

.email-attachments ul > li {
    margin-bottom: 5px;
}

.email-attachments ul > li:last-child {
    margin-bottom: 0;
}

.email-attachments ul > li a {
    color: #000;
}

.email-attachments ul > li a svg {
    width: 18px;
    color: #686868;
}

.email-attachments ul > li .icon {
    color: #737373;
    margin-right: 2px;
}

.email-attachments ul > li span {
    font-weight: 400;
}

.rtl .email-head-subject .title a .icon {
    margin-right: 0;
    margin-left: 6px;
}

.rtl .email-head-subject .icons .icon {
    margin-left: 0;
    margin-right: 12px;
}

.rtl .email-head-sender .avatar {
    margin-right: 0;
    margin-left: 10px;
}

.rtl .email-head-sender .sender .actions .icon {
    margin-left: 0;
    margin-right: 7px;
}

.email-head-title {
    padding: 15px;
    border-bottom: 1px solid #e8ebf1;
    font-weight: 400;
    color: #3d405c;
    font-size: .99rem;
}

.email-head-title .icon {
    color: #696969;
    margin-right: 12px;
    vertical-align: middle;
    line-height: 31px;
    position: relative;
    top: -1px;
    float: left;
    font-size: 1.538rem;
}

.email-compose-fields {
    background-color: transparent;
    padding: 20px 15px;
}

.email-compose-fields .select2-container--default .select2-selection--multiple .select2-selection__rendered {
    margin: -2px -14px;
}

.email-compose-fields .select2-container--default .select2-selection--multiple .select2-selection__rendered .select2-selection__choice {
    border-radius: 0;
    background: #727cf5;
    color: #ffffff;
    margin-top: 0px;
    padding: 4px 10px;
    font-size: 13px;
    border: 0;
}

.email-compose-fields .select2-container--default .select2-selection--multiple .select2-selection__rendered .select2-selection__choice span {
    color: #ffffff;
}

.email-compose-fields .select2-container--default .select2-selection--multiple .select2-selection__rendered .select2-search {
    line-height: 15px;
}

.form-group.row {
    margin-bottom: 0;
    padding: 12px 0;
}

.form-group.row label {
    white-space: nowrap;
}

.email-compose-fields label {
    padding-top: 6px;
}

.email.editor {
    background-color: transparent;
}

.email.editor .editor-statusbar {
    display: none;
}

.email.action-send {
    padding: 8px 0px 0;
}

.btn-space {
    margin-right: 5px;
    margin-bottom: 5px;
}

.breadcrumb {
    margin: 0;
    background-color: transparent;
}

.rtl .email-compose-fields .select2-container--default .select2-selection--multiple .select2-selection__rendered .select2-selection__choice {
    float: right;
}

.rtl .btn-space {
    margin-right: 0;
    margin-left: 5px;
}
.card {
    box-shadow: 0 0 10px 0 rgba(183, 192, 206, 0.2);
    -webkit-box-shadow: 0 0 10px 0 rgba(183, 192, 206, 0.2);
    -moz-box-shadow: 0 0 10px 0 rgba(183, 192, 206, 0.2);
    -ms-box-shadow: 0 0 10px 0 rgba(183, 192, 206, 0.2);
}
.card {
    position: relative;
    display: flex;
    flex-direction: column;
    min-width: 0;
    word-wrap: break-word;
    background-color: #fff;
    background-clip: border-box;
    border: 1px solid #f2f4f9;
    border-radius: 0.25rem;
}
.badge {
    padding: 6px 5px 3px;
}
.text-white {
    color: #ffffff !important;
}
.font-weight-bold {
    font-weight: 700 !important;
}
.float-right {
    float: right !important;
}
.badge-danger-muted {
    color: #212529;
    background-color: #f77eb9;
}

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

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

.flex-wrap {
    -ms-flex-wrap: wrap!important;
    flex-wrap: wrap!important;
}

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

*, ::after, ::before {
}

svg {
    overflow: hidden;
    vertical-align: middle;
}

.dropdown, .dropleft, .dropright, .dropup {
    position: relative;
}

.dropdown-menu {
    position: absolute;
    top: 100%;
    left: 0;
    z-index: 1000;
    display: none;
    float: left;
    min-width: 10rem;
    padding: .5rem 0;
    margin: .125rem 0 0;
    font-size: 1rem;
    color: #212529;
    text-align: left;
    list-style: none;
    background-color: #fff;
    background-clip: padding-box;
    border: 1px solid rgba(0,0,0,.15);
    border-radius: .25rem;
}

/* End Email Client UI*/

.email-preview iframe {
    border: unset;
    width: 100%;
}

.valid {outline: green auto 1px;}

.modal.geocode-result {
    width: 500px;
    height: 420px;
}

p[index='formatted_address'] {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 70%;
}

.button.red {
    background-color: #900909;
}

.advanced-search .object-select {
    margin: 0px 5px;
}

.modal.bulk-action {
    width: 600px;
    height: 400px;
}

.disabled>*, [disabled]>* {
    color: gray;
}

.content.filters li[filter-id] {
    cursor: default;
}

.content.filters li[filter-id] .fa-plus {
    cursor: pointer;
}

.transactions .topbar.white {
    margin-bottom: 60px;
}

.modal.tag-select {
    height: 300px;
    width: 500px;
}

.modal.edit-customer-name {
    width: 700px;
    height: 500px;
}

.modal.change-password {
    width: 650px;
    height: 425px;
}

.topbar.white.line {
    box-shadow: unset;
    border-bottom: 1px solid #00000012;
}

.topbar.white.line {
    box-shadow: unset;
    border-bottom: 1px solid #00000012;
}

.page[point-set='product-card-topbar'][point='configuration'] {
    overflow: hidden;
}

.flex-h {
    display: flex;
    flex-direction: row;
}

.remote-order .customer {
    margin: auto;
    margin-top: 29px;
    box-shadow: unset;
    width: 78%;
    border: 1px solid #dfdfdf;
    margin-bottom: 20px;
}

.remote-order .transaction-item:first-of-type {margin-top: 150px;}

.customer [category] i.fa.fa-star, .customer [openable] i.fa.fa-star, .customer [category] i.fa.fa-exclamation-triangle, .customer [openable] i.fa.fa-exclamation-triangle {
    font-size: 9px;
}

.customer i.fa {
    color: #5266ff;
    top: 20px;
    left: 20px;
}

.add-transaction-communication {
    width: 750px;
    height: 530px;
}

.object-select[no-change] {
    cursor: default;
}

.object-select[no-change][set] i {
    display: none !important;
}

.object-select[no-change] {
    padding-left: 20px;
}

.card-names .card-name.add-name {
    border: 1px dashed #3b3b3b;
    color:#3b3b3b;
}

.card-names .card-name.add-name:hover {
    cursor:pointer;
}

.card-names.status-left {
    margin-left: 80px;
}

.modal.auto-renew {
    width: 400px;
    height: 200px;
}

.modal.bulk-import {
    width: 1300px;
    height: 700px;
}

.bulk-import td {
    border-right: 1px solid white;
    white-space: nowrap;
    padding: 5px;
    border-collapse: separate;
}

.bulk-import td:first-of-type {padding-left: 7px;}

.bulk-import tr {
    border: unset;
}

.bulk-import tr:nth-child(odd) {}

.bulk-import tr td, .bulk-import tr th {
    border: 1px solid #444444;
}

.bulk-import table {
    border-collapse: collapse;
}

.load-throbber.mini {
    position: relative;
    left: unset;
    top: unset;
    width: 30px;
    height: 30px;
    transform: unset;
    font-size: 12px;
}

.mini .throbber {
}

.remote-order .warn {
    background-color: #ffddb7;
}

.bulk-import tr td {
    cursor: pointer;
}

.bulk-import .column-select {}

.bulk-import *:not(.file-header)>td.highlight {
    background-color: #ffe6c2;
}

.bulk-import tr[head]:first-of-type {
  position: -webkit-sticky; /* for Safari */
  position: sticky;
  top: 0px;
  background-color: white;
  z-index: 10;
  border: unset;
  outline: 2px solid #444444;
  outline-offset: -2px;
  box-shadow: 0 0 19px 0px #0000006b;
}

.bulk-import ul#columns i.fa.fa-arrow-right {
    color: gainsboro;
    margin-left: 15px;
}

.import-column-drag-ghost .rule-ui-tag{
	display:block !important;
	background-color:white;
}

#columns .rule-ui-tag {
    display: block;
}

p.rule-ui-tag {
    display: none;
}

.bulk-import #columns li.highlight, .bulk-import #dedupe li.highlight {
    background-color: #a4caff;
}

.bulk-import #columns li.highlight i.fa-arrow-right {
    color: white;
}

.modal.edit-campaign {
    width: 600px;
    height: 400px;
}

.transaction-item.medium.not-local-transaction {
    background-color: white;
}

.transaction-item.not-local-transaction .object-header {
    background-color: #ff57221c;
}

.report {
    margin: 21px;
    width: 300px;
    border-radius: 7px;
    position: relative;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    box-shadow: 0 0 4px #0000003d;
    height: 345px;
    position: relative;
}

.report i.fa.fa-chart-pie {
    font-size: 59px;
}

.flex-h {}

.flex-v {
    display: flex;
    flex-direction: column;
}

.modal.configure-report {
    width: 800px;
    height: 500px;
}

.modal.change-inventory {
    width: 520px;
    height: 358px;
}

.modal.full-sale-history {
    width: 50;
    width: 700px;
    height: 400px;
}

.modal.full-sale-history .itemlist {
    width: 80%;
    margin: auto;
    top: 47%;
    transform: translateY(-50%);
}

svg > g > g:last-child { pointer-events: none }

.modal.configure-mailing {
    width: 95%;
    height: 85%;
}

.next.include {
    background-color: #f6963c;
}

.next.exclude {
    background-color: #4e4e4e;
}

.next .fa-external-link-alt {margin: 0px 0px 0px 1px;}

.modal.configure-mailing iframe {
    width: 100%;
    height: 100%;
    border: unset;
    display: block;
}

.customer.ui-list-item li {
    white-space: nowrap;
}

.modal.configure-linkage {
    width: 700px;
    height: 500px;
}

.personal-info li[category]>ul {
    margin-left: 25px;
}

.slider {
    height: 42px;
    width: 410px;
    position: absolute;
    bottom: 30px;
    left: 50%;
    transform: translate(-50%, 0);
    border-radius: 46px;
    background-color: #f9f9f9;
    box-shadow: 0 0 6px 0 #0000004d;
    border: 1px solid #a9a9a9;
    overflow: hidden;
}

.slider .circle {
    width: 40px;
    height: 40px;
    border-radius: 100%;
    background-color: #ffffff;
    box-shadow: 0 0 8px 0 #00000033;
    border: 1px solid #dedede;
    z-index: 26;
    position: absolute;
}

.block {}

.slider .block {
    height: 100%;
    width: 300px;
    background-color: #f9f9f9;
    position: absolute;
    top: 0;
    right: 0;
}

.modal.manage-object-mirroring {
    width: 600px;
    height: 400px;
}

.modal.add-object-mirror {
    height: 400px;
    width: 700px;
}

.modal.add-object-mirroring {
    width: 550px;
    height: 320px;
}

.customer-list .customer.ui-list-item .customer-body-section, .small.customer.ui-list-item .customer-body-section {
    max-height: 130px;
    min-height: 130px;
}

i.fa.fa-send {
    transform: translate(-52%, -46%);
}

.modal.email-deliverability {
    width: 600px;
    height: 400px;
}

.graph p.graph-title {
    font-weight: normal;
    display: flex;
    align-items: center;
}

.graph i.fa.fa-info-circle {
    font-size: 13px;
    margin-left: 10px;
    transform: translate(0, 0px);
}

.graph .graph-body {
    padding: 20px;
    padding-bottom: 44px;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    height: -webkit-fill-available;
}

.graph-container {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
}

.graph .graph-header-box {
    height: 50px;
}

.graph p.graph-aggregate {
    font-size: 21px;
}

.graph .comparison-tag-box {
    color: #4f566b;
    background-color: #e3e8ee;
    border-radius: 6px;
    margin-left: 10px;
    padding-left: 10px;
    font-size: 13px;
    display: flex;
    align-items: center;
    padding-top: 0px;
    width: fit-content;
    padding-right: 10px;
    justify-content: center;
}

.comparison-tag-box .tag {
    height: fit-content;
}

.graph .graph-point {
    font-size: 13px;
    margin-top: 5px;
}

.load-throbber .load-text {
    position: absolute;
    white-space: nowrap;
    left: 50%;
    transform: translate(-50%, 21px);
    font-size: 21px;
}

.inline-throbber {
    display: flex;
    flex-direction: row;
    align-items: center;
    margin: auto;
}

.load-throbber.inline-throbber .load-text {
    left: 100%;
    top: 50%;
    transform: translate(30px, -50%);
}

.inline-throbber {}

.relative.load-throbber {
    position: relative;
    transform: unset;
    top: unset;
    left: unset;
    margin: unset;
}

.inline-throbber .load-text {
    margin-left: 21px;
}

.graph-ui-item {
    width: 100%;
    height: 100%;
    margin-bottom: 5px;
}

.graph-dashboard {
    margin: 30px 30px;
}

.dashboard-head-box {
    margin-bottom: 40px;
    padding-bottom: 10px;
    border-bottom: 1px solid #0000003d;
}

.dashboard-head-box h2 {
    margin-left: unset;
    font-weight: lighter;
    font-size: 26px;
    margin-top: unset;
}

.left-range-select {
    height: 30px;
    border-radius: 5px;
    border: 1px solid #d6d6d6;
    position: relative;
    flex-shrink: 0;
    flex-grow: 0;
}

button {
    appearance: none;
    border: unset;
    background-color: unset;
    font-size: 13px;
    padding: 5px;
    padding-left: 15px;
    color: #3b3b3b;
    font-weight: lighter;
    padding-right: 15px;
    transition: all 200ms;
    cursor: pointer;
    position: relative;
    height: 30px;
}

.graph-dashboard .controls-bar.flex-h {
    font-size: 15px;
    align-items: center;
}

.button i.fa.fa-angle-down {
    margin-right: 5px;
}

.controls-bar button i.fa.fa-angle-down {
    margin-left: 5px;
    transform: translate(0px, 1px);
}

.left-range-select button:not(:last-child) {margin-right: 1px;}

button:not([disabled]):hover {background-color: rgb(252, 252, 252);box-shadow: background-color: rgb(255, 255, 255);box-shadow: rgba(0, 0, 0, 0) 0px 0px 0px 0px, rgba(0, 0, 0, 0) 0px 0px 0px 0px, rgba(0, 0, 0, 0.12) 0px 1px 1px 0px, rgba(60, 66, 87, 0.16) 0px 0px 0px 1px, rgba(0, 0, 0, 0) 0px 0px 0px 0px, rgba(60, 66, 87, 0.08) 0px 3px 9px 0px, rgba(60, 66, 87, 0.08) 0px 2px 5px 0px;}

.button-bar button:first-child {
    border-top-left-radius: 4px;
    border-bottom-left-radius: 4px;
}

.button-bar button:last-child {
    border-top-right-radius: 4px;
    border-bottom-right-radius: 4px;
}

.button-bar button:after, .button-bar button:before{
    position: absolute;
    top: 0;
    bottom: 0;
    z-index: 1;
    display: block;
    width: 1px;
    background: #0000000a;
    content: "";
}

.button-bar button:first-child:before, .button-bar button:last-child:after{
    display:none;
}


.button-bar button:after {
    right: -1px;
}

.button-bar button:before {
    left: -1px;
}

i.fa.fa-calendar {}

button i.fa.fa-calendar {
    margin-right: 10px;
}

button:focus {
    box-shadow: rgb(0 0 0 / 0%) 0px 0px 0px 0px, rgb(58 151 212 / 36%) 0px 0px 0px 4px, rgb(0 0 0 / 12%) 0px 1px 1px 0px, rgb(60 66 87 / 16%) 0px 0px 0px 1px, rgb(0 0 0 / 0%) 0px 0px 0px 0px, rgb(0 0 0 / 0%) 0px 0px 0px 0px, rgb(60 66 87 / 8%) 0px 2px 5px 0px;
    z-index: 2;
}

.button-bar select {
    appearance: none;
    position: relative;
    z-index: 1;
    -ms-flex: 0 1 auto;
    flex: 0 1 auto;
    margin: 0;
    text-decoration: none;
    vertical-align: middle;
    word-break: normal;
    background: transparent;
    border: 0;
    outline: 0;
    transition: color .24s;
    -webkit-appearance: none;
    appearance: none;
    -webkit-user-select: auto;
    -ms-user-select: auto;
    user-select: auto;
    padding-left: 20px;
    padding-right: 35px;
    height: 30px;
}

.button-bar {
    display: flex;
    flex-direction: row;
    align-items: center;
    height: fit-content;
    height: -moz-fit-content;
    border-radius: 5px;
    border: 1px solid #d6d6d6;
    position: relative;
    flex-shrink: 0;
    flex-grow: 0;
    background-color: white;
}

.button-bar .fa.fa-arrows-alt-v {
    margin-right: 10px;
    position: absolute;
    right: 5px;
}

.button-bar button {}

.button-bar button i.fa.fa-cog {
  margin-right: 5px;
}

ul.custom-range-ul li {
    padding: 6px;
    padding-left: 40px;
    padding-right: 30px;
}

ul.custom-range-ul li:hover {
    background-color: #a2b7f41c;
    outline: unset;
}

ul.custom-range-ul {
    width: calc(100% + 30px);
    left: 0px;
    transform: translate(-15px);
    overflow: hidden;
}

ul.custom-range-ul li {
    border: unset;
}

.custom-range-ul li.selected .fa.fa-check {
    font-size: 10px;
    position: absolute;
    left: -7px;
}

ul.custom-range-ul li.selected {
    color: #7083e7;
}

.flex-h.comparison-tag-box.red {
    color: rgb(152, 55, 5);
    background-color: #f8e5b9;
}

p.graph-aggregate[compared-aggregate] {
    text-align: right;
}

p.graph-point[compared-point] {
    text-align: right;
}

.graph .comparison-tag-box.green {
    color: rgb(14, 98, 69);
    background-color: rgb(203, 244, 201);
}

 .customer.ui-list-item .customer-body-selection {
     overflow: hidden !important;
 }

 .customer.ui-list-item .customer-body-section {
 }


.customer-list .customer.ui-list-item.group .customer-body-section {
    overflow: scroll !important;
}

.extra {}

.graph .action.extra {
    position: absolute;
    color: #4e8cff;
    bottom: -6px;
    right: 12px;
    transform: translate(0, -100%);
    font-size: 14px;
    display: none;
}

.graph .action.extra .fa {
    margin-left: 5px;
}

.graph:hover .action.extra {
    display: block;
}

.graph:hover .action.extra:hover {
    color: #1f407b;
}

.graph .endpoint-labels {
    width: 100%;
    height: 10px;
    display: flex;
    justify-content: space-between;
    margin-top: -8px;
    margin-right: 5px;
}

.endpoint-labels p {
    font-size: 12px;
    margin-left: 3px;
    margin-right: 3px;
    padding: unset !important;
    white-space: nowrap;
    flex-wrap: nowrap;
    display: flex;
    height: 20px;
}

.customer-card.flagged .card-name *:not(button *, button) {
}

.credential-identity {
    width: 10px;
    height: 50px;
    border: 1px solid black;
    margin-left: 15px;
    cursor: pointer;
}

.identity.flex-h {
    margin-top: 25px;
    margin-left: 30px;
}

.identity.flex-h.status-left {
    margin-left: 80px;
}

.credential-identity:hover i {
    transform: scale(1.3);
    cursor: pointer;
    color: #3786ff;
}

.credential-identity i {
    transition: all 200ms;
}

.credential-identity:hover {
    background-color: #ffffff;
}

.modal.customer-credential-menu {
    width: 600px;
    height: 400px;
}

.button-bar.large>* {
    height: 41px;
    padding-left: 20px;
    padding-right: 20px;
}

.button-bar.large.finish {
    width: max-content;
    left: 50%;
    transform: translate(-50%, -5%);
    bottom: 30px;
    position: absolute;
}

.button-bar.large.finish {}

.modal.edit-automation {
    width: 95%;
    height: 90%;
    min-width: 800px;
    min-height: 500px;
}

.edit-automation .fa-ellipsis-h {
    margin-left: 30px;
}


.input-connector:not([connected]), .output-connector:not([connected]) {
    background-color: #00000003;
    border: 1px dashed #000000c7;
}

.input-connector[connected], .output-connector[connected] {
    background-color: #53c53dba;
    border: 1px dashed #000000c7;
}

.output-connector, .input-connector {
    width: 20px;
    height: 20px;
    border-radius: 25px;
    transition: all 200ms;
    margin-right: 15px;
    position: absolute;
    left: -29px;
    top: 50%;
    transform: translate(0, -50%);
    text-align: center;
}


.output-connector:not([connected]):not(.no-connect):hover, .input-connector:not([connected]):not(.no-connect):hover {

    cursor: crosshair;
    border: 1px solid #000000c7;
}

.edit-automation span.object-select {
    margin-left: auto;
}

.edit-automation canvas {
    position: absolute;
    z-index: 2;
    pointer-events: none;
}


.modal.select-action {
    width: 600px;
    height: 400px;
}

.output-connector::before, .input-connector::before {
    top: 4px;
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -49%);
    font-size: 12px;
}

.output-connector::before {
   transform: translate(-50%, -45%);
}

li[category][location_pipe_id]>ul {
    margin-left: 35px !important;
    width: calc(100% - 35px) !important;
    box-shadow: inset 6px 6px 10px 0 rgb(0 0 0 / 9%), inset -6px -6px 10px 0 rgb(232 232 232 / 24%);
    border-radius: 6px 0px 0px 6px;
    border-left: unset;
    }

li[category][location_pipe_id]>ul>li:last-of-type {

border-radius: 0px 0px 0px 6px;;border-bottom: unset;}

.input-connector.no-connect {opacity: .2;}

.input-connector.no-connect:hover {}

.automation-action-bar {
    margin-right: 15px;
    cursor: grab;
    left: 15px;
    position: absolute;
}

.edit-automation [category] p:first-child {
    margin-left: 15px;
}

.modal.purchase-number {
    width: 1000px;
    height: 600px;
}

.button-bar.finish {
    position: absolute;
    margin: auto;
    width: fit-content;
    bottom: 50px;
    left: 50%;
    transform: translate(-50%, 0);
}
.configure-mailing textarea {
    min-height:200px;
    max-height:300px;
    resize:none;
}

.edit-phone.modal {
    width: 700px;
    height: 450px;
}

.communication-label {
    font-size: 10px;
    margin-bottom: 5px;
}

li.communication {
    display: flex;
}

.communication-footer {
    font-size: 10px;
    margin-top: 4px;
}

p.communication-recipients:hover, p.communication-attachments:hover {
    color: #3b8ff8;
}

.status-icon .load-throbber.relative {
    height: 30px;
    width: 30px;
    font-size: 16px;
}

.status-icon i.fa:hover {
    transform: scale(1.3);
    color: #3b3b3b !important;
}

.status-icon i.fa {
    transition: all 100ms;
}

.queue-select .transaction-item:first-of-type, .view-transaction .transaction-item:first-of-type {
    margin-top: 20px;
    margin-bottom: 50px;
}

ul[list][embedded-list] li {
    padding-left: 0px;
    padding-right: 0px;
}

.object-select[set][disabled] span {
    color: white;
}

.object-select[set][disabled]:hover {
    background-color: #4caf50;
    border: 1px dashed #4caf50;
}

.object-select[set][disabled] .fa-ban {}

.advanced-search.modal.fullscreen {
    width: 95%;
    height: 95%;
}

.advanced-search.modal.tall {
    height: 101%;
}

.personal-info li[flagged], .customer-info.notes li[flagged], .object-container li[flagged] {
    background-color: #ff8800;
    color: white !important;
}

.personal-info li[flagged] .fa:not(button .fa), .object-container li[flagged] .fa:not(button .fa) {
    color: white !important;
}

.object-select[flagged] {
    background-color: #ff9720;
    border: 1px dashed #ff9720;
}

.object-select[flagged]:not([no-change]):hover {
    background-color: #ffaf54;
    border: 1px solid #ffaf54;
}

.object-select[error] {
    background-color: #fb6f6f;
    border: 1px dashed #fb6f6f;
}

.object-select[error]:not([no-change]):hover {
    background-color: #ff8585;
    border: 1px solid #ff8585;
}

.remote-order .object-select {
    max-width: 300px;
}

.flex-v.special {
}

.personal-info .flex-v.special, .object-container .flex-v.special {
    position: absolute;
    left: 14px;
    text-align: center;
}

.personal-info .flex-v.special>*, .object-container .flex-v.special>* {
    margin-top: 5px;
    margin-bottom: 5px;
}

.personal-info .flex-v.special .bad-address {
    color: #c32929;
    font-size: 10px;
}

.customer.flagged i.fa-star {
    color: #3b3b3b;
}

.customer [category] .flex-v.special {
    position: absolute;
    left: 12px;
    text-align: center;
}

.customer.flagged i.fa.fa-exclamation-triangle {
    color: #c32929;
}

.customer [category] .flex-v.special>* {
    margin-top: 2px;
    margin-bottom: 2px;
}

.invoice iframe {
    width: 100%;
    height: 100%;
    border: unset;
}

ul li[icon-button] {
    width: 100px;
    height: 120px;
    border: 1px;
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    justify-content: space-around;
    margin: 10px;
    box-shadow: 0 0 3px 0 #0000002e;
    border-radius: 2px;
    cursor: pointer;
    transition: all 100ms;
}

ul li[icon-button] .fa {
    font-size: 30px;
}

li[icon-button]:hover {
    background-color: #68a4fd;
    color: white;
}

.transaction-item:first-of-type {
}

.remote-order .transaction-item:last-of-type {
    margin-bottom: 250px;
}

.modal.view-remote-order {
    width: 1000px;
    height: 600px;
}

.modal.payment-methods {
    width: 700px;
}

ul[embedded-list]>li {
    height: 40px;
}

.view-transaction .transaction-item {
    width: 600px;
}

.modal.setup-integration {
    width: 91%;
    height: 700px;
}

.modal.integration-type-select {
    width: 800px;
    height: 500px;
}

.sidebar.path-vertical i.fa.fa-arrow-left.back {
    top: 22px;
    left: 25px;
}

.has-back-arrow.sidebar center h2 {
    width: 90%;
    margin-left: 10%;
}

.modal.oauth-window {
    width: 600px;
    height: 300px;
    padding: 20px;
}

.oauth-window h3 {}

.oauth-window ul {
    margin-top: 30px;
}

.oauth-window .fa-check {
    margin-right: 7px;
    padding-top: 7px;
    padding-bottom: 7px;
}

.customer.ui-list-item.individual.small.empty {
    filter: brightness(.6) blur(1px) !important;
    cursor: default !important;
}

.customer.ui-list-item.empty .customer-header, .campaign.ui-list-item.empty .campaign-header, .large-object.empty .object-header {
    cursor: default;
}

.customer.empty .assign {position: absolute;width: 100%;margin-top: 30px;}

.assign {}

.gift-giver-assign {
    position: absolute;
    top: 135px;
    left: 50%;
    transform: translateX(-50%);
    z-index: 3;
}

.customer.highlight-selected.flagged {}

.customer.highlight-selected.flagged .customer-header {
    background: rgb(128,46,240);
    background: linear-gradient(34deg, rgba(128,46,240,1) 0%, rgba(255,136,0,1) 100%);
}

.customer-left-side {
    width: 400px !important;
    border-right: 1px solid #d8d8d8;
    flex-shrink: 0;
}

.object-container .object-container-header {
    height: 44px;
    background-color: #f4f4f4b5;
    align-items: center;
    justify-content: space-between;
    border-bottom: 1px solid #e2e2e2;
}

.object-container {
    width: 100%;
    border-bottom: 1px solid #0000000f;
}

.customer-left-side {}

.alerts-bar {
    height: 50px;
}

.object-container:last-of-type {
    margin-bottom: 100px;
}

.flex-v.status-bar {
    height: 50px;
}

.flex-v.customer-left-hug {
    position: relative;
    box-shadow: inset 0 0 4px 0 #0000003b;
    width: 45px;
}

.status-item {
    color: white;
    width: 45px;
    height: 45px;
    transition: all 200ms;
    cursor: pointer;
}

.status-item>* {
    margin: auto;
}

.status-item.flag {
    background-color: #ff8800;
}

.status-item.flag:hover {background-color: #c26801;}

.customer-top-hug {
    background-color: white;
    border-bottom: 1px dashed #cacaca;
    height: 45px;
}

.status-item.grouped {
    background-color: #3e1874;
}

.status-item.duplicate {
    background-color: #aa0000;
}

.status-item.delete {
    background-color: #252525;
}

.status-item.flex.merge {
    background-color: #2359f0;
}

.status-item.history {
    background-color: #00805c;
}

.status-item:hover {
    filter: saturate(1.3);
}

.flex-h.hug-actions>* {
    border-right: unset;
    border-left: 1px solid white;
}

.object-container.names .object-container-header {
}

.flex-h.midway-tile {
}

.flex-v.midway-tile {
    min-width: 550px;
    flex-grow: 1;
    border-right: 1px solid #d8d8d8;
}

.customer-card .flex-h.right-tile {
    height: 100%;
    flex-grow: 1;
}

.object-container.transactions {padding-bottom: 0px;margin-bottom: 0px;}

.customer-top-hug {
    background-color: white;
}

.object-header .listing {
    max-width: 63%;
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
}

.object-container-header.superior-header {
    background-color: #fdfdfd;
}

.object-container.superior {
    height: 45px;
}

.itemlist.multiline {height: fit-content;min-height: 200px;overflow-y: scroll;max-height: 400px;}

.itemlist.multiline .contents {
    position: relative;
    flex-wrap: wrap;
    overflow-y: scroll;
    justify-content: center;
    margin-top: 10px;
}

.status-item.dedupe {
    background-color: #ff8d35;
}

.object-container.history .itemlist.multiline {
    width: 100%;
    border-radius: 0;
}

.status-item.flex.inbox {
    background-color: #438eb6;
}

.flex-left-sidebar {
    width: 400px;
    flex-shrink: 0;
    border-right: 1px solid #d8d8d8;
}

ul[list] li[selectable][selected] {
    background-color: #cce2ff;
}

ul[list] li[selectable][selected]::after {
    font-family: "Font Awesome 5 Free";
    content: "\f105";
    font-weight: 800;
    font-style: normal;
    font-variant: normal;
    text-rendering: auto;
    line-height: 1;
}

.button-bar.small button {padding: 3px;padding-right: 12px;padding-left: 13px;height: 27px;}
.button-bar.xsmall button {font-size: 11px;padding: 1px;padding-right: 12px;padding-left: 12px;height: 23px;;}
.button-bar.xxsmall button {font-size: 10px;padding: 0px;padding-right: 9px;padding-left: 9px;height: 19px;}


.default-tag {margin-left: 15px;background-color: #c2e2ff;padding: 3px 11px;border-radius: 4px;color: #0e83ec;}

.graph.minified {border: unset;padding: unset;height: 70px;width: 250px;}

.graph.minified .graph-body {padding: unset;}

.modal.preview-document {width: 95%;height: 90%;;}

.modal.select-transaction {width: 600px;;height: 600px;}

.preview-page-body {background-color: white;margin: 50px;padding: .5in;margin-top: 25px;border: unset;width: calc(100% - 100px - 1in);}

.preview-page-header {background-color: white;margin: 50px;padding: .2in;margin-bottom: 0px;padding-left: 0.5in;font-weight: lighter;font-size: 18px;display: flex;flex-direction: row;align-items: center;font-weight: bold;position: relative;}

.attachment {background-color: white;padding: 20px;position: relative;margin-right: 15px;flex-grow: 0;flex-shrink: 0;margin-bottom: 15px;}

.attachment p {text-align: center;margin-bottom: 20px;margin-top: 15px;}

.attachment i.fa.fa-file-pdf {position: absolute;left: 10px;top: 10px;font-size: 15px;color: #00000061;}

.button-bar.bottom {position: absolute;left: 50%;transform: translateX(-50%);bottom: 30px;}

table {width: 100%;}

table td, table th {padding: 2px 10px 2px 10px;}

table>tbody>tr:nth-child(odd) {background-color: #e3e7ef !important;!i;!;}

table {border-collapse: collapse;}

table th {text-align: left;}

table td, table th {font-weight: lighter;border: 1px solid #c9c9c9;}

table th {font-weight: 400;color: black;}

.modal.select-advanced-search {width: 800px;height: 500px;}

.loop-access .output-connector {position: relative;left: unset;margin: unset;transform: unset;margin-left: 25px;}

.loop-access {display: flex;align-items: center;outline: 1px solid #e5e5e5;outline-offset: 7px;padding: 0px 12px;margin-left: 40px;}

.input-output .input-connector {top: 28%;}

.input-output .output-connector {top: 72%;}

.category.input-output {min-height: 40px;}

button.select.disabled {box-shadow: unset;}

button.select.disabled:hover {cursor: default;box-shadow: unset;}

    .sidebar.right {right: 0px;left: unset;box-shadow: -2px -3px 6px #00000030;}

.sidebar.right.large {width: 30%;}

.demon-large-item ul#sequence {margin-left: unset;border-left: unset;}

i.fa.fa-play {color: #80c380;}

i.fa.fa-pause {color: #cf7070;}

button[toggleable][pressed] {box-shadow: inset 6px 6px 10px 0 rgb(0 0 0 / 6%), inset -6px -6px 10px 0 rgb(253 253 253);transition: all 50ms ease-in;}

button[toggleable]:not([pressed]) {box-shadow: inset 0 0 0px 0px #0000002e;transition: all 50ms ease-in;}



.modal.printers {width: 900px;height: 400px;}

.folder {width: 280px;display: flex;flex-direction: row;padding: 16px 17px;background-color: white;box-shadow: 0 0 0 0 black;border: 1px solid gray;border-radius: 10px; margin:21px;}

.folder i.fa.fa-folder {margin-right: 22px;margin-left: 8px;}

.folder:active {background-color: #8181ff29;cursor: pointer;}

li[location_pipe_id]>.category {height: 20px;}

[add-action], [add-subaction] {height: 16px;}

li[category][location_pipe_id], li[add-action], li[add-subaction], li[add-case] {z-index: 0;position: relative;background-color: unset !important;}

li[location_pipe_id]>.category[tail] {}

li[category][location_pipe_id]:hover, li[add-action]:hover, li[add-subaction]:hover, li[add-case]:hover {background-color: #aeaeae0f !important;}

li[category].pipe-selected {background-color: #3a9aff80 !important;}

li>ul {background-color: white;}

li[category].pipe-selected:hover {background-color: #3a9aff91 !important;}

li[category][location_pipe_id]>ul>li:first-of-type {border-top: unset;border-radius: 6px 0px 0px 0px;}
li[category].log-highlighted {background-color: #349eff82 !important;}
li[category].no-code-coverage {background-color: #ffc10066 !important;}

li[category].log-highlighted:hover {background-color: #46a7ff8f !important;}
li[category].no-code-coverage:hover {background-color: #ffc1004a !important;}


li[category].pipe-selected {
    background-color: #3a9aff80 !important;
}

li[category][location_pipe_id]>ul>li:first-of-type:last-of-type {border-top: unset;border-bottom: unset;border-radius: 6px 0px 0px 6px;}

.button-bar.noborder {}
.customer-left-side li {padding-right: 10px !important;}

.midway-tile  .object-container li {padding-right: 20px !important;}

li[flagged] .button-bar.xsmall.noborder, .customer-card.flagged li.card-name .button-bar {}


*:not(.page, .sidebar-page, .content){
  -ms-overflow-style: none;  /* IE and Edge */
  scrollbar-width: none;  /* Firefox */
}

wi{
	-ms-overflow-style: unset;  /* IE and Edge */
  scrollbar-width: unset;  /* Firefox */
}

.customer-card ul[list].main>li[category] {padding-right: unset !important;}

.advanced-search .main li.select {background-color: #8686ff;color: white;}

.advanced-search .main .select .object-select[set] {border: 1px solid white;}

.advanced-search-onboard * {color: #767676;}

.advanced-search-onboard {position: relative;width: 680px;height: 480px;margin: auto;margin-top: 50px;}

.advanced-search-onboard {}

li.filter-drag-selected {background-color: #a08cea !important;color: white;}

li.filter-drag-selected .object-select[set] {border: 1px solid white;}

.from-and-to {font-size: 13px;margin-left: 30px;display: flex;align-items: flex-start;font-weight: 100;display: flex;flex-direction: column;}

.from-and-to>small {margin-left: 10px;}

.preview-page-header::before {content: "";position: absolute;width: 14px;height: 14px;border: 2px solid #3b3b3b;left: calc(.25in - 7px);}

.footer {}

.search-footer {
    position: absolute;
    bottom: 0;
    width: 100%;
    height: 100px;
    background-color: white;
    border-top: 1px dashed #d5d5d5;
}

.flag-select .last-viewed {
    background-color: #c0dcff;
}

.itemlist:not(.multiline) .contents {
    align-items: center;
    height: calc(100%);
}

.itemlist.multiline .item:last-of-type {
    margin-bottom: 100px;
}

.customer.population-selected .customer-header {
    border-bottom: 1px solid transparent;
    outline: unset;
}

.customer.object.population-selected {
    background: #2c71f0;
}

.customer.ui-list-item.object .customer-name {
    white-space: pre-line;
}

.customer-card .transaction-item {
    width: 90%;
    max-width: 500px;
}

.transaction-item.flagged.population-selected {
    box-shadow: 0 0 0px 2px #ff8800;
}

.transaction-item.flagged.population-selected .object-header {
    background-color: #ff8800;
}

.population-selected.flagged-object .object-header, .population-selected.flagged-object .customer-header {
    background-color: #ff8800 !important;
}

.transaction-item.population-selected .object-header .fa {
    color: white;
}

.transaction-item.population-selected .active-indicator.active {
    background-color: white;
}

.transaction-item.population-selected .active-indicator:not(.active) {
    background-color: black;
}

.customer.population-selected.flagged-object {
}

.flagged-object.customer .customer-header {
    background-color: white;
    color: #3b3b3b;
    border-bottom: unset;
}

.flagged-object.customer .customer-header .fa {
    color: #5266ff;
}

.flagged-object.customer {}

.customer.object.flagged-object {
    box-shadow: 0 0 0px 1px #ffa000;
}

.customer-card div#pending {
    min-height: 190px;
}

.modal.email-preferences {
    width: 65%;
    max-height: 600px;
    height: 66%;
    max-width: 800px;
}

.minified .graph-title-line.flex-h {
    display: none;
}

.minified .comparison-head .flex-v {
    position: relative;
    display: flex;
}

.minified .comparison-head.flex-h {
}

.minified .graph-header-box {
    position: absolute;
    left: 50%;
    transform: translate(-50%, 0);
    bottom: -34px;
    text-align: center;
    font-size: 10px !important;
}

.minified p.graph-aggregate {
    font-size: 12px;
}

.minified p.graph-point {
    font-size: 9px;
    margin-top: 3px;
}

li[disabled] {
    color: #bbbbbb;
    cursor: default !important;
}

li[disabled]:hover {
    background-color: unset !important;
}

.graph.pie-graph {
    /*height: 350px;*/
}

button.disabled {
    color: #797979;
}

button.disabled:hover {
    box-shadow: unset;
}

button.disabled:focus {
    box-shadow: unset;
}

a {
    color: #7878d0;
    font-weight: 600;
}

.bulk-import tr.file-header {
    margin-left: 20px;
    top: 0;
    position: sticky;
    background-color: white;
    color: #3b3b3b;
    font-weight: bold;
    box-shadow: 0 0 16px 0 #00000066;
    outline: 2px solid #444444;
    outline-offset: -2px;
}

.bulk-import [head] td.highlight {
    background-color: #506df5;
    color: white;
    font-weight: bold;
}

.bulk-import [head] td {
    font-weight: bold;
}

.bulk-import tr {
    height: 30px;
}

.bulk-import [scroll] .file-header {
    position: revert;
    top: unset;
}

.searchable i.fa.fa-keyboard {
    padding-right: 10px;
    height: 30px;
    top: -5px;
    position: relative;
    line-height: 30px;
    left: -16px;
    width: 30px;
    padding-left: 10px;
    box-shadow: 4px 0px 11px 3px #00000012;
}

.input-collection .searchable i.fa.fa-image {
    height: 39px;
    line-height: 39px;
}

.searchable i.fa.fa-image {
    padding-right: 10px;
    height: 30px;
    top: -5px;
    position: relative;
    line-height: 30px;
    left: -16px;
    width: 30px;
    padding-left: 10px;
    box-shadow: 4px 0px 11px 3px #00000012;
}

button.searchable:hover {
    box-shadow: unset;
    cursor: text;
}

button.searchable:hover span.text {
    color: #5c5c5c;
}

button.searchable {
    overflow: hidden;
}

button.searchable span.text {height: 30px;top: -5px;position: relative;margin-left: auto;line-height: 30px;margin-left: 15px;padding-right: 20px;max-width: 100%;text-overflow: ellipsis;white-space: nowrap;overflow: hidden;}

button.searchable {
    min-width: 150px;
    position: relative;
    display: flex;
}

button.searchable:focus {
    box-shadow: unset;
}

.modal.select-searchable {
    width: 600px;
    height: 400px;
}

.select-searchable>.content>.button-bar {
    border-radius: unset;
    border: unset;
    box-shadow: 0px 4px 6px 0 #00000033;
    z-index: 2;
    position: sticky;
    top: 0;
}

.searchable input.text {
    border: unset;
    outline: unset;
    box-shadow: unset;
    height: 30px;
    padding: unset;
    top: -5px;
    position: relative;
    width: -webkit-fill-available;
    height: 50px;
    font-size: 18px;
    color: #2c2c2c;
    padding-left: 15px;
}

.select-searchable button.searchable {
    width: 100%;
    height: 50px;
    position: relative;
    border: unset;
}

.select-searchable i.fa.fa-keyboard {
    width: 80px;
    height: 50px;
    line-height: 50px;
}

.select-searchable i.fa.fa-image {
	width: 80px;
    height: 50px;
    line-height: 50px;
}

button.searchable.selecting {
    background-color: #5895fd;
    color: white;
}

.bulk-import [head] td.unassigned {
    background-color: #95122933;
}

.bulk-import [head] td.assigned {
    background-color: #1f870f4f;
}

.bulk-import [head] td.assigned.highlight {
    background-color: #229210bf;
}

.bulk-import [head] td.unassigned.highlight {
    background-color: #951229ba;
}

.select-searchable .body i.fa.fa-check {
    color: white;
}

.select-searchable li.selected {
    background-color: #a1e0a1;
}

.bulk-import [head] td {
    outline-offset: -1px;
    border: 0px solid #444444;
    outline: 1px solid #444444;
}

.bulk-import tr:nth-child(2) td {border-top: unset;}

.bulk-import tr.file-header td {
    border: unset;
    outline: 1px solid #444444;
    outline-offset: -1px;
}
.bulk-import tr:nth-child(2) td {border-top: unset;}

.bulk-import tr.file-header td {
    border: unset;
    outline: 1px solid #444444;
    outline-offset: -1px;
}

.bulk-import [path-page-index='4'] .file-header {
    outline: unset;
}

.bulk-import [path-page-index='4'] .file-header td {
    outline: unset;
    border-left: 1px solid #444444;
    font-weight: bold;
}

.padded-content {
    padding: 50px;
    padding-top: 70px;
}

.warning-triangle{
	vertical-align: middle !important;
	color: #f08100;
	font-size: 22px !important;
	margin-left:10px;
	vertical-align: -webkit-baseline-middle !important;
}


.padded-content h1 {
    margin-left: unset;
    margin-bottom: 8px;
    margin-top: unset;
}

.padded-content ul[list] li:not(ul[list] ul[list] li) {
    padding-left: unset;
    padding-right: unset;
}

p.subtable-notice {
    margin-top: -6px;
    font-weight: 500;
    font-size: 13px;
    color: #697386;
    text-transform: uppercase;
    text-align: left;
    padding: 0 16px 13px 16px;
    vertical-align: bottom;
    white-space: nowrap;
}

.padded-content ul[list] .category:not(ul[list] ul[list] .category) {
    padding-left: unset;
    padding-right: unset;
}

.padded-content ul[list] ul[list] {
    margin-left: unset;
    margin-right: unset !important;
    width: 100%;
}

.padded-content ul[list] li {
    padding-right: unset;
}

.mobile-close{
	display:none;
}

.select-searchable .fa-times{
	display:none;
}

.onboard-first [index='address'] .button-bar {
    max-width: 90%;
}

.striped caption.tableexport-caption {
    margin-bottom: 30px;
    position: relative;
}

i.fa.fa-times.mobile-close {
    display: none;
}

.itemlist .contents .actions .fa-plus {
    margin-left: auto;
}

.itemlist .actions .fa-minus {
    margin-right: auto;
}

.padded-content h1 {
    margin-left: unset;
    margin-bottom: 8px;
    margin-top: unset;
    color: #3b3b3b;
}

.padded-content {
    padding: 70px;
    padding-bottom: 0px;
    padding-top: 70px;
    display: flex;
    flex-direction: column;
    height: -webkit-fill-available;
}


.padded-content h1 {
    font-size: 38px;
    line-height: 48px;
}

table.striped tr {
    vertical-align: middle;
}

.code-editor, .sql-entry {
    min-height: 80px;
    margin-top: 30px;
    border: 1px solid #535353;
    border-radius: 7px;
    background-color: #2f2f2f;
    padding-left: unset;
    font-size: 15px !important;
    cursor: text;
    font-family: 'Lucida Console', monospace;
    letter-spacing: 0px;
    font-weight: bold;
    position: relative;
    white-space: nowrap;
    user-select: none;
    -webkit-user-select: none;
    overscroll-behavior-y: none;
    flex-shrink: 0;
    overscroll-behavior: none;
}

.sql-entry *:not(span.comment)>span.keyword {
    color: #5ca8ff;
    text-transform: uppercase;
}

.sql-entry span:not(.keyword) {
    color: white;
    display: flex;
    flex-direction: row;
    align-items: center;
}

.sql-entry[language='Markdown'] span.link-text {
    text-transform: none;
	color:#80a9ff;
}

.sql-entry[language='Markdown'] span.link-url {
    text-transform: none;
	color:#96b1ff;
	text-decoration:underline;
}


.sql-entry span.variable {
    color: #ffb734;
    text-transform: uppercase;
}

.sql-entry[language='Markdown'] span.variable {
    text-transform: none;
}

.sql-entry[language='Handlebars'] span.variable {
    text-transform: none;
}

.codebox[language='Markdown'] span.keyword{
  color: #9888ff;
  text-transform: none !important;
}


.codebox[language='Markdown'] span.member{
  color: #f45858;
  text-transform: none !important;
}


.codebox[language='PHP'] span.keyword{
  color: #9888ff;
  text-transform: none !important;
}

.codebox[language='PHP'] span.variable{
  color: #f45858;
  text-transform: none !important;
}

.codebox[language='PHP'] span.member{
  color: #f45858;
  text-transform: none !important;
}


.codebox[language='PHP'] span.string{
  color: #82cf6b;
  text-transform: none !important;
}

.codebox[language='PHP'] span.operator{
  color: #af8dff;
  text-transform: none !important;
}

.codebox[language='PHP'] span.function{
  color: #7aacff;
  text-transform: none !important;
}

.codebox[language='PHP'] span.class{
  color: #ffb249;
  text-transform: none !important;
}

.line-no {
    color: #ffffff;
    padding-right: 10px;
    border-right: 1px solid #f4f4f4;
    user-select: none;
    -webkit-user-select: none;
    white-space: nowrap;
    height: 100%;
    text-align: right;
    width: calc(1em * 4) !important;
    flex-shrink: 0;
    position: sticky;
    left: 0;
    background-color: #171717;
    right: 0;
    z-index: 1000;
    height: 18px;
}

.sql-entry .line {
    position: relative;
    z-index: 3;
    width: max-content;
    padding-right: 50px;
    user-select: none;
    -webkit-user-select: none;
    width: 100%;
}

.sql-entry .line .line-content {
    margin-left: 10px;
    line-height: 18px !important;
    height: 18px !important;
}

span.keyword {}

.cursor {
    height: 1.15em;
    width: .15em;
    background-color: #ffffff;
    position: absolute;
    position: absolute;
    margin-top: 2px;
    user-select: none; -webkit-user-select: none;
    z-index: 3;
    transform: translateY(-2px);
}

@keyframes blink {
  0%, 20% {
    opacity: 0;
  }
  40%, 100% {
    opacity: 1;
  }
}

.cursor.idle {
    animation: blink 1s infinite;
}

.sql-entry canvas {
    top: 0;
    left: 0;
    z-index: 0;
    z-index:4;
    position: absolute;
    will-change: transform;
    transform: translateZ(0px);
}

.sql-entry span.comment {
    color: #868686;
}

.sql-entry span.comment span {
    color: #868686 !important;
}

.sql-entry .line.locked .line-no {color: #acacac;border-right-color: #424242;}

.sql-entry .line.locked {
    background-color: #1d1d1d;
}

.sql-entry *:not(span.comment)>span.placeholder {
    text-transform: uppercase;
    color: #4dc74d;
}

.sql-entry span.special-value {
    color: #ff9b63;
    text-transform: uppercase;
}

.sql-entry[language='PHP'] span.special-value {
    color: #ff9b63;
    text-transform: unset;
}

.sql-entry span.curly{
    color:inherit;
}

.sql-entry span.paren {
    color: inherit;
    position: relative;
    transform: translate(0px, -1px);
}

.sql-entry span.square{
  color: inherit;
}

.sql-entry span.paren.active:after {
    content: " ";
    position: absolute;
    width: 86%;
    left: 7%;
    height: 1px;
    background-color: #8976ff;
    bottom: -1px;
    z-index: 1000;
}

.sql-entry span.bash-tag{
    color: #ff9b63;
}

.flex-h.center {
    justify-content: center;
}

.flex-h.center.bottom {
    position: relative;
    margin-top: auto;
    padding-top: 50px;
    padding-bottom: 60px;
}

.sql-entry .editor-contents {
    overflow: hidden;
    padding-top: 35px;
    padding-bottom: 35px;
    z-index: 29;
    overflow: scroll;
    display: flex;
    flex-direction: column;
    height: calc(100% - 35px * 2) !important;
    will-change: transform;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
}

.example-editor .editor-contents {
    min-height: unset;
}


.sql-entry[language='Markdown'] span.string {
    color: #4dc74d;
}


.sql-entry span.number {
    color: #ff9d76;
}

.sql-entry .editor-contents.empty {
    filter: grayscale(.5) brightness(0.7) !important;
}

.sql-entry[disabled] .editor-contents {
    filter: brightness(0.8);
}

.sql-entry * {
    font-family: 'Lucida Console', monospace !important;
    font-size: 15px !important;
}

.edit-automation .sql-entry.codebox {
    height: calc(100% - 120px);
    margin: 30px;
    margin-bottom: unset;
}

.codebox[language='PHP'] span.operator.gopt {
    transform: translate(0px, 0px);
}

.graph.graph-table {width: 100%;height: auto;border: unset;}

.graph-body.table-graph-body {
    padding: 10px;
}

.padded-content.medium-padded-content {
    padding: 40px;
}

.modal.bulk-mailing-labels {
    width: 90%;
    height: 75%;
    max-width: 1200px;
    min-height: 700px;
    max-height: 90%;
}

.padded-title{
	font-size:26px;margin:unset;margin-bottom:15px;display: flex;
}

.padded-heading{
	margin-left:unset;
}


iframe.label-preview-page {
    width: 100%;
    height: 100%;
    border: 0px;
    background-color: #5c5c5c;
}

.topbar.large.white {
    height: 60px;
}

.page.large {
    height: calc(100% - 60px);
}

.page:not(.show-scroll)::-webkit-scrollbar, .content:not(.show-scroll)::-webkit-scrollbar, *:not(.show-scroll)::-webkit-scrollbar {
  display: none;
}


*:not(.show-scroll) {
  -ms-overflow-style: none;  /* IE and Edge */
  scrollbar-width: none;  /* Firefox */
}

.large-header {
    width: 100%;
    height: 140px;
    position: relative;
    position: fixed;
}

.header-top-content {
    display: flex;
    flex-direction: row;
    height: 100px;
    width: 100%;
    box-shadow: 0 0 9px 0 #00000030;
}

.large-header .header-top-left {margin-left: 60px;min-width: 300px;}

.header-tab-content {
    position: absolute;
    bottom: 0;
    display: flex;
    height: 40px;
    border-top: 1px solid #f5f5f5;
    width: 100%;
}

.header-tab-content>tab {
    padding: 0px 44px;
    border-top: unset;
    background-color: #ffffff1a;
    color: black;
    border-left: unset;
    min-width: 140px;
    text-align: center;
    line-height: 38px;
    cursor: pointer;
    border-bottom-left-radius: 12px;
    border-bottom-right-radius: 12px;
    margin-left: 5px;
    transition: all 150ms;
    font-weight: lighter;
    font-size: 17px;
    box-shadow: -1px 5px 7px 0 #00000021;
	transform: translateY(-2px);
}

tab {
    display: block;
}

tab.open {
    background-color: #4389ff;
    color: white;
    background: linear-gradient(45deg, #4892ff, #3d80ff);
}

.header-tab-content>tab:hover {background-color: white;transform: translateY(0px);}

.header-top-left .created-tag {
    margin-left: 17px;
    font-size: 12px;
}

.large-header .header-top-right {
    border-left: 1px solid #ededed;
    margin-left: 150px;
    padding-left: 150px;
}

.page.flex.large-header {}

.page.large-header-page {height: calc(100% - 140px);margin-top: 140px;}

.page-left .padded-content {
    padding: 30px;
}

.sidebar.large-sidebar {
    width: 429px;
}

.large-header i.fa.fa-arrow-left.back {
    top: 26px;
}

.bulk-import .configuration {
    display: flex;
    width: 100%;
    height: calc(100% - 30%);
    overflow-x: scroll;
}

.column-head {
    padding: 10px;
    font-size: 17px;
    padding-left: 30px;
    padding-top: 20px;
    padding-bottom: 20px;
    flex-shrink: 0;
    padding-right: 30px;
}

.bulk-import .configuration .column-bar-left {
    width: 100%;
    border-bottom: 1px solid #00000014;
    display: flex;
    align-items: center;
}

.bulk-import .column-bar-left .button-bar {
    margin-left: auto;
    margin-right: 20px;
}

.bulk-import .configuration .column-left {
    display: flex;
    width: 50%;
    border-right: 1px solid #00000014;
    flex-direction: column;
    flex-shrink: 0;
    position: relative;
    overflow-x: hidden;
    overflow-y: scroll;
}

.bulk-import p.edit-tab {
    font-size: 13px;
    color: #6464ff;
    font-weight: bold;
    margin-right: 20px;
    cursor: pointer;
}

.bulk-import p.edit-tab:hover {
    color: #8080ff;
}

.i.fa.fa-angle-left {}

.bulk-import #group-membership i.fa.fa-angle-up {
    position: absolute;
    top: 0;
    transform: translate(-50%, -95%);
    left: 50%;
}

.bulk-import #group-membership i.fa.fa-angle-down {
    position: absolute;
    top: 100%;
    transform: translate(-50%, 5%);
    left: 50%;
}

.object-group-block i {
    cursor: pointer;
}

.object-group-block i:hover {
    color: #6464ff;
}

.bulk-import .configuration .column-right {
    display: flex;
    width: 50%;
    flex-direction: column;
    flex-shrink: 0;
    max-height: 100%;
    overflow-y: scroll;
}

li.warn {
	background-color: #ffa614 !important;
}

li[openable]>.open.warn {
    background-color: #ffa614;
}

.bulk-import [head] td.assigned.warn {
    background-color: #ffa61475;
}

.bulk-import [head] td.assigned.warn.highlight {
    background-color: #ffa614;
}

.bulk-import li.flag {
    background-color: #ff7e003b;
}

li[category]>ul.shadow-inset {
    border-left: unset;
    box-shadow: inset 0px 0px 5px 0 #00000030;
    border-radius: 5px;
    margin-left: 30px;
		border-top-right-radius: 0px;
    border-bottom-right-radius: 0px;
}

li[category]>ul.shadow-inset>li {
    background-color: transparent;
		background: linear-gradient(90deg, transparent, #ffffffe8);
}


#foreign-keys i.fa.fa-exclamation-triangle {
    margin-right: 10px;
    color: orange;
}

.bulk-import .tester {
    position: absolute;
    display: flex;
    right: 30px;
    top: 15px;
    z-index: 1000;
}

.bulk-import .tester input {
    width: 100px;
    text-align: left;
    padding-left: 20px;
}

.bulk-import tr.highlight {
    background-color: #a2d6ff !important;
}

.bulk-import tr.highlight td {
    background-color: #a2d6ff !important;
}

.bulk-import tr.highlight td.highlight {
    background-color: #dbdbdb !important;
}

span.preview-format {
    font-weight: bold;
    color: #3F51B5;
}

.indicator {
    width: 10px;
    height: 10px;
    border-radius: 100%;
    position: absolute;
    transform: translate(-16px, -50%);
    background-color: green;
    top: 50%;
}

.indicator.red {
    background-color: #ed3939;
}

.indicator.orange {
    background-color: orange;
}

.indicator.purple {
    background-color: #b539ff;
}

.indicator {}

	.statistics-window {
	    float: right;
	    width: 350px;
	    height: calc(100%);
	    border-left: 1px solid #e6e6e6;
	    display: flex;
	    flex-direction: column;
	    flex-wrap: nowrap;
	    position: relative;
	    overflow: scroll;
	}

	.statistics-window .state {
	    height: 20px;
	    display: flex;
	    position: relative;
	    margin-left: 17px;
	    margin-bottom: 15px;
	    display: flex;
	    align-items: center;
	}

	.statistics-header .flex-v.header-title {
	    margin-top: 25px;
	}

	.statistics-header {
	    padding-left: 25px;
	    padding-top: 25px;
	    padding-bottom: 25px;
	    position: relative;
	    padding-right: 25px;
	}

	.progress-header {
	    padding-top: 30px;
	    padding-left: 25px;
	    padding-right: 25px;
	}

	.progress-header li {
	    padding-right: unset !important;
	    padding-left: unset !important;
	}

	hr {
	}

	.progress-header hr {border: 1px solid #3d3d3d;border-bottom: unset;border-radius: 5px;}

	progress {
	    width: 100%;
	    margin-bottom: 1px;
	}

progress {
  height: 6px;
  border-radius: 10px;
  background: #e1e1e1;
}

progress {
  color: #275eff;
  border-radius:40px;
}

progress::-moz-progress-bar {
  background: #275eff;
  border-radius:40px;
}

progress::-webkit-progress-value {
  background: #275eff;
	border-radius:40px;
}

progress::-webkit-progress-bar {
  background: #e1e1e1;
  border-radius:40px;
}

	progress {
	    width: 100%;
	    margin-bottom: 1px;
	}

progress {
  height: 6px;
  border-radius: 10px;
  background: #e1e1e1;
}

progress[stopped] {
  color: #ed3939;
  border-radius:40px;
}

progress[stopped]::-moz-progress-bar {
  background: #ed3939;
  border-radius:40px;
}

progress[stopped]::-webkit-progress-value {
  background: #ed3939;
	border-radius:40px;
}

progress[stopped]::-webkit-progress-bar {
  background: #e1e1e1;
  border-radius:40px;
}

progress[paused] {
  color: orange;
  border-radius:40px;
}

progress[paused]::-moz-progress-bar {
  background: orange;
  border-radius:40px;
}

progress[paused]::-webkit-progress-value {
  background: orange;
	border-radius:40px;
}

	p {}

	p.issue-tracker {
	    color: green;
	}

	p.issue-tracker.has-issues {
	    color: #bc1c1c;
	}

	.statistics-window li.issue {
	    color: #d11515;
	}

	p.issue-tracker.has-issues:hover {
	    content: "Test" !important;
	}

	.main-page {
	    width: calc(100% - 351px);
	    height: 100%;
	    position: absolute;
	}

	.main-page .header-tab-content {
	    bottom: unset;
	    height: 40px;
	    margin-bottom: 10px;
	    transition: all 300ms ease-in;
	    top: 0;
	}

	.header-tab-content>tab.open:hover {
	    transform: translateY(0px);
	}

.header-tab-content>tab.open {
    transform: translateY(0px);
}


.button-bar.large-button-bar {
    margin-top: 25px;
    width: fit-content;
    width: -moz-fit-content;
    height: 50px;
    position: relative;
    overflow: hidden;
}

.button-bar.large-button-bar button:first-child {
    background: linear-gradient(45deg, #2584fe, #64a8ff);
    font-size: 16px;
    height: 50px;
    padding: 0px 50px 0px 50px;
	color:white;
}

.button-bar.large-button-bar button.red:first-child {
    background: linear-gradient(45deg, #f84a4a, #ff3f3f);
    font-size: 16px;
    height: 50px;
    padding: 0px 50px 0px 50px;
    color:white;
}

.button-bar.large-button-bar button.blue:first-child {
    background: linear-gradient(45deg, #5d9eff, #387fff);
    font-size: 16px;
    height: 50px;
    padding: 0px 50px 0px 50px;
    color:white;
}

.header-tab-content>tab.white {
    background-color: white;
}


table.striped tr.warn td {
    background-color: #ffc9c9;
    border-bottom: 1px solid #ffc9c9;
	border-top: 1px solid #ffc9c9;
}

table.striped tr:nth-child(odd).warn td {
    background-color: #ffaaaa !important;
    border-bottom: 1px solid #ffaaaa;
	border-top: 1px solid #ffaaaa;
}

table.striped.top tbody tr td {
    vertical-align: top;
}

.modal.import-files {
    width: 700px;
    height: 450px;
}

.main-page .header-tab-content.retract {
    top: -50px;
}

.json-container .fa-caret-right, .json-container .fa-caret-down {
    transform: translateY(1px);
    color: #4389ff;
}

.json-container .fa-caret-down {
    transform: translateY(0px);
}

.json-container {}
.flex-h.submission-view.open {
    height: 100%;
    width: calc(100% - 575px);
    position: relative;
}

.submission-side-bar {
    position: absolute;
    right: 0;
    top: 0;
    width: 60px;
    height: 100%;
    box-shadow: 0 0 8px 0 #00000024;
    background-color: #cdcdcd;
    z-index: 2;
}

.submission-side-bar.open {
    width: 575px;
    background-color: white;
}

.submission-side-bar .closed-content {
    position: absolute;
    height: 100%;
    width: 60px;
    align-items: center;
    background-color: white;
    right: 0;
}

.menu-item {
    width: 60px;
    height: 60px;
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 25px;
    border-bottom: 1px solid #eaeaea;
    cursor: pointer;
}

.submission-side-bar.open .closed-content {
    border-left: 1px solid #eaeaea;
}

.submission-sidebar-page {
    width: calc(100% - 61px);
    height: 100%;
    position: relative;
}

.submission-sidebar-page .messaging-header {
    height: 50px;
    background-color: white;
    border-bottom: 1px solid  #eaeaea;
    padding-left: inherit;
    position: relative;
    display: flex;
    align-items: center;
    flex-direction: column;
    padding-bottom: 28px;
}

.messaging-body {
    height: calc(100% - (80px));
    display: flex;
    flex-direction: column-reverse;
    overflow: scroll;
    overflow-x: hidden;
}

.message-content-block {
    display: flex;
    width: calc(100% - 20px);
    padding-top: 8px;
    padding-left: 20px;
    padding-bottom: 8px;
    position: relative;
    flex-shrink: 0;
}

.user-icon {}

.message-content-block.turn-change-blocl {}

.message-content-block.turn-change-block .user-icon {
    width: 50px;
    height: 50px;
    position: absolute;
}

.account-icon-actual {
    border-radius: 10px;
    height: 50px;
    width: 50px;
    background-color: #ffffff;
    color: white;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 24px;
    box-shadow: 0 0 4px 0 #00000029;
    background-size: cover !important;!i;!;
    background-color: #7d7dff;
}

.account-icon-actual i.fa {
    transform: translateY(-1px);
}

.message-content-block .message-content {
    margin-left: 61px;
    flex-shrink: 0;
    width: calc(100% - 61px);
    display: flex;
    flex-direction: column;
}

.turn-change-block .name-line {
    color: black;
    font-weight: 500;
    font-size: 17px;
}

.message-content-block.turn-change-block {
    min-height: 50px;
}

.message-content-block:last-of-type {
    margin-top: 10px;
}

.time-divider {
    margin-bottom: 5px;
    height: 1px;
    margin-top: 5px;
    background-color: #f6f6f6;
}

.message-content-block.turn-change-block {
}

.text-line {
    color: #333333;
    font-weight: lighter;
    line-height: 20.4px;
    flex-shrink: 0;
    width: calc(100% - 20px);
}

.message-content-block:hover {
    background-color: #f0f0f0;
    cursor: default;
}

.flex-h.turn-change-line {
    margin-bottom: 10px;
    align-items: center;
}

.time-line {
    font-weight: lighter;
    color: #616161;
    font-size: 14px;
    margin-left: 15px;
}

.time-line:hover {
    text-decoration: underline;
    cursor: pointer;
}

.name-line:hover {
    text-decoration: underline;
    cursor: pointer;
}

.message-content-block:not(.turn-change-block) .user-icon {
    display: none;
}

.message-content-block:not(.turn-change-block) .flex-h.turn-change-line {
    display: none;
}

.message-content-block .time {
    position: absolute;
    display: none;
}

.message-content-block .time .time-line {
    margin-left: unset;
    line-height: 1.6;
}

.message-content-block:not(.turn-change-block):hover .time {
    display: block;
}

.draft-box {
    width: 100%;
    height: min-content;
    bottom: 0;
    position: absolute;
    background: linear-gradient(0deg, white, transparent);
    z-index: 100;
}

.draft-input {
    width: calc(100% - 40px);
    position: relative;
    margin: auto;
    background-color: white;
    border: 1px solid #cccccc;
    border-radius: 8px;
    margin-bottom: 20px;
    overflow: hidden;
}

.draft-topbar, .draft-bottombar {
    height: 35px;
    border-bottom: 1px solid #eeeeee;
}

.draft-input div#chat, .draft-input div#recipient  {
    outline: unset;
    padding-left: 20px;
    padding-top: 15px;
    padding-bottom: 15px;
    padding-right: 20px;
    min-height: 30px;
    min-height: 18px;
    height: auto;
    width: 100%;
    resize: none;
    border: unset;
    font-family: sans-serif;
    font-weight: lighter;
    font-size: 16px;
    box-sizing: border-box;
    overflow: hidden;
    position: relative;
    z-index: 2;
    background-color: transparent;
}

.draft-bottombar {
    border-top: 1px solid #eeeeee;
    border-bottom: unset;
    display: flex;
    align-items: center;
}

.draft-input div#chat:empty:after, .draft-input div#recipient:empty:after {
    content: attr(placeholder);
    color: #6e6e6e;
}


.message-content-block.pending {opacity: 0.6;}

.nothing-here-yet {
    position: absolute;
    left: 50%;
    top: 37%;
    transform: translate(-50%, -50%);
    width: 80%;
    height: 100px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
}

.message-content-block.turn-change-block.skeleton {}

.message-conent-block.turn-change-block.skeleton .user-icon .account-icon-actual {
    background: black !important;
}

.message-content-block.turn-change-block.skeleton .user-icon .account-icon-actual {
    background: #dddddd !important;
    box-shadow: unset;
    border-radius: 5px;
}

.message-content-block.skeleton .message-content .name-line {
    color: transparent;
    background-color: #dddddd;
    border-radius: 5px;
}

.message-content-block.skeleton .message-content .text-line {
    color: transparent;
    background-color: #dddddd;
    max-width: 80%;
    border-radius: 5px;
    width: max-content;
}

.message-content-block.skeleton .time-line {
    color: transparent;
    background-color: #dddddd;
    border-radius: 5px;
    font-size: 17px;
    margin-left: 9px;
}

.time-separator {}

.time-separator {
    height: 30px;
    position: relative;
    margin-top: 30px;
    margin-bottom: 30px;
}

.timeline .line {
    position: absolute;
    width: 100%;
    height: 1px;
    background-color: #0000001c;
    top: 50%;
}

.time-separator .time {
    background-color: white;
    width: 100px;
    left: 50%;
    position: absolute;
    top: 50%;
    transform: translate(-50%, -50%);
    text-align: center;
    padding: 5px 25px;
    border: 1px solid #0000001c;
    border-radius: 20px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    white-space: nowrap;
    width: min-content;
}

.time-separator .time i.fa.fa-angle-down {
    margin-left: 8px;
    font-size: 11px;
}


.messaging-body:not(.no-draft-box) .message-content-block:first-of-type {
    margin-bottom: calc(170px - 30px);
}

.scope {
    font-size: 10px;
    margin-left: 20px;
}

h2.thread-selector {
    margin: unset;
    font-weight: normal;
    font-size: 18px !important;
    padding: 5px;
    border: 1px solid transparent;
    padding-left: 15px;
    padding-right: 15px;
    align-items: center;
    display: flex;
    cursor: pointer;
    transition: all 200ms ease-in;
}

h2.thread-selector:hover {
    /* border: 1px solid #00000012; */
    border-radius: 5px;
}

.thread-selector i.fa.fa-angle-down {
    font-size: 12px;
    margin-left: 10px;
    transform: translateY(1px);
    display: none;
}

h2.thread-selector:hover i.fa-angle-down, h2.thread-selector.selecting i.fa-angle-down {
    display: block;
}

.thread-selector-modal {
    position: absolute;
    height: auto;
    max-width: 300px;
    width: 267px;
    background-color: white;
    border: 1px solid #00000030;
    border-radius: 6px;
    border-top-left-radius: 0px;
    border-top-right-radius: 0px;
    border-top: unset;
    z-index: 2;
    left: 35px;
    top: 42px;
    overflow: hidden;
}

h2.thread-selector:hover {}

.thread-selector-modal .input-header {
    width: 100%;
    position: relative;
    height: 45px;
    border-bottom: 1px solid #ececec;
    display: flex;
    overflow: hidden;
}

.thread-selector-modal input.input-search-bar {
    box-shadow: unset;
    height: calc(100% - 10px);
    outline: unset;
    width: 100%;
}

.thread-lookup-body {
    width: 100%;
    display: flex;
    flex-direction: column;
    overflow-y: scroll;
    overflow-x: hidden;
    max-height: 400px;
}

.thread-selector-modal .thread {
    width: 100%;
    height: 45px;
    border-bottom: 1px solid #00000008;
    display: flex;
    align-items: center;
    position: relative;
    cursor: pointer;
    flex-grow: 0;
    flex-shrink: 0;
}

.thread-selector-modal .thread-name, .mention-candidate .thread-name {
    padding-left: 40px;
    display: flex;
    align-items: center;
}

.thread-lookup-body .thread .badge, .mention-candidate.thread .badge {
    position: absolute;
    background-color: #f44949;
    color: white;
    border-radius: 100%;
    padding: 5px;
    width: 10px;
    height: 10px;
    top: 50%;
    transform: translate(0, -50%);
    left: 10px;
    line-height: 10px;
    font-size: 8px;
    text-align: center;
    white-space: nowrap;
}

.thread-selector-modal .thread .badge-count, .mention-candidate.thread .badge-count {
    position: absolute;
    left: 50%;
    transform: translate(-50%, -50%);
    top: 50%;
}

.thread-selector-modal .thread:hover {
    background-color: #fcfcfc;
}

.thread-lookup-body .thread-name .flex-v {
    margin-left: 10px;
}

.thread-selector-modal .thread.local {
    height: 60px;
}

.thread-selector-modal i, .mention-candidate i:not(i.fa-user):not(i.fa-user-plus) {
    font-size: 14px;
    margin-right: 10px;
}

.thread-selector-modal .thread.local span.local-thread-alert, .mention-candidate span.local-thread-alert {
    font-size: 10px;
    display: block;
}

.thread-selector-modal .thread:not(.local) span.local-thread-alert, .mention-candidate.thread:not(.local) span.local-thread-alert {
    display: none;
}

.thread-selector-modal i.fa-hashtag {
    transform: translateX(1px);
}

h2.thread-selector.selecting {
    border: 1px solid #00000030;
    border-radius: 5px;
    padding-top: 8px;
}

.message-content-block i.fa.fa-exclamation-triangle {
    position: absolute;
    right: 20px;
    top: 50%;
    transform: translateY(-50%);
}

.thread.current .badge, .mention-suggestions .thread.current .badge {
    width: 4px;
    height: 4px;
    left: 14.5px;
    color: transparent;
    background-color: #3d8000;
}

.thread.current {
    background-color: #19a71924;
}

.thread.current:not(.mention-candidate):hover {
    background-color: #19a71924;
}

div#chat-copy, div#recipient-copy{
    position: absolute;
    padding-left: 20px;
    font-weight: lighter;
    font-size: 16px;
    padding-top: 15px;
    padding-left: 20px;
    padding-top: 15px;
    padding-bottom: 15px;
    padding-right: 20px;
    min-height: 18px;
    width: 100%;
    resize: none;
    border: unset;
    font-family: sans-serif;
    font-weight: lighter;
    font-size: 16px;
    box-sizing: border-box;
    z-index: 3;
    white-space: wrap;
    word-wrap: break-word;
    pointer-events: none;
}

.mention-suggestions {
    position: relative;
    width: calc(100% - 40px);
    margin-bottom: 15px;
    margin-left: 20px;
    background-color: white;
    border-radius: 8px;
    border: 1px solid #cccccc;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    z-index: 2;
}

.mention-candidate {}

.mention-candidate {
    display: flex;
    align-items: center;
    height: 50px;
    flex-grow: 0;
    flex-shrink: 0;
    border-bottom: 1px solid #e7e7e7;
    position: relative;
}

.mention-candidate .profile-image {
    width: 35px;
    margin-left: 20px;
    margin-right: 20px;
}

.mention-candidate .mention-username {
    font-size: 14px;
    margin-left: 20px;
}

.mention-candidate .account-icon-actual {
    width: 35px;
    height: 35px;
    position: relative;
}

.mention-candidate:last-of-type {
    border-bottom: unset;
}

.mention-suggestions .hint-bar, .mention-display .hint-bar, .poll .hint-bar{
    height: 25px;
    background-color: #e9e9e9;
    display: flex;
    flex-direction: row;
    align-items: center;
}

.mention-candidate.highlight {
    background-color: #8585ff;
    color: White;
}

.candidates {
    max-height: 275px;
    overflow: scroll;
    overflow-x: hidden;
}

.draft-input .suggesting {
    font-weight: bold;
    color: #545454;
    display: inline-block;
}

.mention {
    border-radius: 10px;
    display: inline-block;
    color: #6666ff;
    font-weight: bold;
}

.messaging-header .mention {
    border-radius: 5px;
    display: inline-block;
    color: #6666ff;
    background-color:#f5f5f5;
    font-weight: bold;
    padding-left:5px;
    padding-right:5px;
    padding-top:3px;
    padding-bottom:3px;
    margin-right:4px;
    line-height: 16px;
}

.mention-not-found {
  display: inline-block;
  background-color: #ffe9e9;
  padding-left: 4px;
  padding-right: 4px;
  outline: 1px dashed black;
  border-radius: 4px;
}

.hint-bar .nav-hint {
    font-size: 12px;
    color: #2d2d2d;
    margin-left: 20px;
    display: flex;
    align-items: center;
}

.hint-bar .nav-hint>* {
    margin-right: 4px;
}

.hint-bar .nav-hint i:last-of-type {
    margin-right: 7px;
    text-emphasis: none;
    font-style: normal;
}

.bar-item {
    height: 24px;
    display: flex;
    width: 40px;
    justify-content: center;
    line-height: 35px;
    justify-content: center;
    align-items: center;
    cursor: pointer;
}

.bar-item i.fa.fa-font {}

.bar-item:hover {
    background-color: #dfdfdf14;
}

.mention-candidate .mention-name.thread-name i {
    margin-right: 20px;
}

.mention-candidate .thread-name {
    padding-left: 45px;
}

.mention-candidate .thread .badge {
    left: 13px;
}

.mention-display {
    position: absolute;
    width: calc(100% - 40px);
    height: auto;
    top: 100px;
    left: 20px;
    background-color: white;
    border-radius: 10px;
    overflow: hidden;
    border: 1px solid #cccccc;
    z-index: 1;
}

.mention-display .mention-candidate .profile-image {
    width: 100px;
}

.mention-display .mention-candidate .profile-image .account-icon-actual {
    width: 80px;
    height: 80px;
}

.mention-display .mention-candidate {
    align-items: start;
    margin-top: 20px;
    height: auto;
    padding-bottom: 20px;
    background-color: transparent;
    position: relative;
}

.mention-display .mention-name {
    font-weight: bold;
}

.mention-display .mention-candidate.thread {
    align-items: center !important;
    margin-top: unset;
    padding-bottom: unset;
    height: 70px;
}

.mention-candidate .mention-time {
    display: flex;
    align-items: center;
}

.thread-members {
    border: 1px solid #eaeaea;
    padding: 3px;
    display: flex;
    align-items: center;
    border-radius: 5px;
    cursor: pointer;
		margin-right:20px;
		flex-shrink:0;
		flex-grow:0;
		margin-left:auto;
}

.member-images {
    display: flex;
    flex-direction: row-reverse;
    padding-right: 6px;
    overflow: hidden;
    height: 25px;
}

.thread-members .member {
    width: 20px;
    height: 25px;
    z-index: 1;
    border-radius: 3px;
}

.member-icon .account-icon-actual {
    width: 25px;
    height: 25px;
    border-radius: 0px;
    outline: 3px solid white;
    border-radius: 3px;
    font-size: 12px;
    background-color: #7d7dff;
}

.member-icon {
    width: 27px;
    height: 25px;
    border-radius: 3px;
}

.thread-members .count {
    margin-left: 9px;
    margin-right: 4px;
    font-size: 14px;
}


.thread-members:hover {
    background-color: #f3f3f3;
}

.thread-members .member .account-icon-actual i {
    transform: translateY(1px);
}

.thread-members:hover .member.account-icon-actual {
    outline: 3px solid white;
}

.thread-members:hover .member .account-icon-actual {
    outline: 3px solid #f3f3f3;
}

.header-tab-content.plain-tabs {
    bottom: unset;
    position: relative;
    border-top: unset;
    margin-top: 20px;
    border-bottom: 2px solid #f6f6f6;
    height: 35px;
    overflow: scroll;
    flex-shrink: 0;
}

.header-tab-content.plain-tabs>tab {
    background: unset;
    color: black;
    border-radius: 0px;
    width: auto;
    min-width: unset;
    padding: 0px 0px;
    margin: 0px 35px;
    transform: none;
    line-height: 35px;
    box-shadow: unset;
    border-bottom: 3px solid transparent;
    margin-left: unset;
    white-space: nowrap;
}

.header-tab-content.plain-tabs>tab.open {
    transform: none;
    border-bottom: 3px solid #617bff;
}

.content[point-set="messaging-threads"] .header-tab-content.plain-tabs {
    width: calc(100% + 120px);
    left: -60px;
    padding-left: 60px;
    padding-right: 60px;
}

.header-tab-content.plain-tabs>tab:not(.open):hover {
    border-bottom: 3px solid #637cff1f;
    color: #2e2e2e;
}

.content[point-set="messaging-threads"] .page#tab-content {
    width: calc(100% + 120px);
    left: -60px;
}

.mention-candidate.member-card .profile-image {
    width: 50px;
    height: 50px;
}

.mention-candidate.member-card .account-icon-actual {
    width: 50px;
    height: 50px;
}

.mention-candidate.member-card {
    height: 80px;
    padding-left: 10px;
    border-bottom: 0px;
}

input.member-search-input {
    width: calc(100% - 80px);
    margin: auto;
    margin-top: 17px;
    height: 30px;
    left: 50%;
    position: relative;
    transform: translateX(-50%);
    border-radius: 8px;
}

.mention-candidate i.fa-user-plus {
    font-size: 20px;
    transform: translateX(1px) translateY(0px);
}

.mention-candidate.member-card.add-member:hover {
    background-color: #f2f2f2;
    cursor: pointer;
}

.member-location-separator {
    margin-left: 30px;
    font-weight: 400;
    color: #0e0e0e;
    margin-top: 10px;
    margin-bottom: 10px;
}

.button-bar i.fa.fa-user-plus {
    margin-right: 6px;
    font-size: 13px;
}

.flex-h.submission-view {
    height: 100%;
    position: relative;
    width: 100%;
}

.timeline {
    position: relative;
    display: flex;
    flex-direction: column;
    border-top: 2px solid #00000008;
    border-bottom: 2px solid #00000008;
    transform-origin: top left;
    overflow: visible;
    overflow-x: scroll;
}

.timeline-item {
    display: flex;
    flex-direction: row;
    align-items: center;
    margin-top: 7px;
    margin-bottom: 7px;
    position: relative;
}

.item .children {}

.timeline-children {
    padding-left: 30px;
    margin-left: 0;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.timeline-start {
    width: 50px;
    height: 50px;
    position: relative;
}

.timeline-start .profile-image {
    width: 50px;
    height: 50px;
}

.timeline-item:first-child {padding-top: 0px;}

.timeline-item:last-child {padding-bottom: 0px;}

#assignees .mention-candidate .profile-image {
    margin-left: unset;
}

.profile-image.active {
    border-radius: 14px;
}

.timeline .profile-image:not(.active) {
    filter: brightness(0.5);
}

.profile-image:not(.active) {}

	timeline-item .line {
	    left: 0;
	}

	.timeline-item .line {
	    left: -17.5px;
	    width: calc(100% + 34px);
	    height: 5px;
	    background-color: #a6a6ff;
	    z-index: -1;
	    transform: translateY(-50%);
	    border-radius: 20px;
	}

.timeline .vertical-join {
    height: 100%;
    width: 5px;
    background-color: #a7a6ff;
    position: absolute;
    left: 62px;
    border-radius: 20px;
}

.timeline-item .line.no-children {
    width: calc(100%);
}

.timeline .markers {
    position: absolute;
    height: 100%;
    z-index: 2;
    display: flex;
    user-select: none; -webkit-user-select: none;
    pointer-events: none;
    display: flex;
    flex-shrink: 0;
    flex-grow: 0;
}

.timeline .markers .marker {
    width: 64px;
    border-right: 1px dashed #00000026;
    height: 100%;
    margin-right: 15px;
}

.timeline-container {
    width: 100%;
    overflow-y: visible;
    padding-bottom: 50px;
}

.status-item.import {
    background-color: #4d82ef;
}

.customer-card i.has-action:hover {
    transform: scale(1.3) !important;
}

.customer-card li .icon-tags {
    top: 50%;
    height: 5px;
    transform: translateY(-50%);
    right: 90px;
}

.customer-card .notes li .icon-tags {
    right: 100px;
}

textarea {
    border: unset;
    border: 1px solid #d4d4da !important;
    border-radius: 5px;
    padding-left: 10px;
    padding-top: 10px;
    padding-bottom: 10px;
    padding-right: 10px;
}

label[for] {
    margin-bottom: 10px;
    font-size: 14px;
    font-weight: 500;
    color: #726e6e;
    flex-shrink: 1;
}

input {}

.flex-v.input-collection {
}

.flex-v.input-collection input:not(input[type='checkbox']) {
    width: -webkit-fill-available;
    box-shadow: unset;
    border: 1px solid #d4d4da !important;
    padding-top: 7px;
    padding-bottom: 7px;
    font-size: 16px;
    border-radius: 5px;
    height: 25px;
}

.flex-h>.flex-v.input-collection:not(:last-child) {
    margin-right: 20px;
}

.input-container-root {
    margin-top: 20px;
    margin-bottom: 20px;
}

.input-collection input {
    box-shadow: unset;
    border: unset !important;
}

.modal.edit-email {
    width: 700px;
    min-height: 490px;
    height: auto;
}

textarea {
    border: unset;
    border: 1px solid #d4d4da !important;
    border-radius: 5px;
    padding-left: 15px;
    padding-top: 10px;
    padding-bottom: 10px;
    padding-right: 15px;
    font-family:sans-serif;
    font-size:16px;
    box-sizing: border-box;
}

table.paging.striped i.fa {
    padding: 0px 15px;
    cursor: pointer;
    top: 0;
    position: relative;
    left: 0;
}

.paging.striped i.fa.disabled {
    color: #05050524;
}

.button-bar.small-button-bar {
    padding: 0px !important;
}

.button-bar.small-button-bar>button {
    padding: 0px;
}

.modal.bulk-submission-action {
    width: 650px;
    height: 660px;
}

.mention-candidate.member-card.selected {
}

.mention-candidate i.fa-check {
    display: none;
}

.mention-candidate.selected i.fa-check {
    display: block;
    color: #7083e7;
    font-size: 18px !important;
    margin-left: auto;
    margin-right: 35px !important;
}

.mention-candidate.selected {
    color: #7083e7;
    background-color: #a2b7f41c;
}

.chat-side {
    width: 500px;
    position: absolute;
    right: 0;
    top: 0;
    z-index: 100;
    height: 100%;
    background-color: white;
    border-left: 1px solid #dee6ee;
    box-shadow: 0 0 7px 0 #0000001a;
}

.chat-side.submission-sidebar-page {
    width: 500px;
    height: 100%;
    background-color: white;
    right: 0;
    top: 0;
    z-index: 2;
    position: absolute;
    font-family: sans-serif;
    box-shadow: 0 0 9px 0 #00000038;
    transform: translate(0, 0);
    transition: all 300ms;
    overflow: hidden;
}

.chat-side.submission-sidebar-page.right {
    transform:translateX(102%);
}

body.chat-open{
	width:calc(100% - 500px);
}

.chat-side i.fa.fa-bars, .chat-side i.fa.fa-edit {
    transform: translateY(1px);
    margin-left: 15px;
    margin-right: 0px;
    padding: 10px;
    transition: all 200ms ease-in;
    outline: 1px transparent;
}

.chat-side i.fa.fa-bars:hover, .chat-side i.fa.fa-edit:hover {
    color: #3b3b3b;
    outline: 1px solid #00000017;
    border-radius: 2px;
    cursor: pointer;
    color: #777bfd;
}

.content.right-peek:not(.left) {
    transform: translateX(80%);
    border-left: 1px solid #e6e6e6;
}

.chat-side .sidebar {
    box-shadow: unset;
    width: calc(100% - 20% + 1px);
    max-width: 400px;
    display: flex;
    flex-direction: row;
    transition: all 400ms;
    overflow: hidden;
}

.mini-bar {
    width: 75px;
    height: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
}

.sidebar-main {
    width: calc(100% - 15px);
    height: calc(100% - 61px);
    border-top-left-radius: 9px;
    border: 1px solid #e6e6e6;
    border-right: unset;
    border-bottom: unset;
    padding-left: 14px;
}

.mini-bar .user-icon {
    margin-bottom: 13px;
    margin-top: 17px;
}

.mini-bar .account-icon-actual {
    width: 45px;
    height: 45px;
    cursor: pointer;
}

.mini-bar .create {
    width: 35px;
    height: 35px;
    border-radius: 100%;
    background-color: #6666ff;
    position: relative;
    margin-top: auto;
    cursor: pointer;
}

.mini-bar .create i {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    color: White;
    font-size: 20px;
    right: unset;
}

.sidebar-core {
    width: calc(100% - 75px);
    height: 100%;
}

.chat-side .sidebar-head {
    height: 60px;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.sidebar-head {
    position: relative;
    top: 0;
    width: 100%;
}

.sidebar-head h2 {
    margin-top: 0px;
    margin-left: 20px;
    margin-top: unset;
    margin-bottom: unset;
}

.chat-side .sidebar i.fa.fa-edit {
    margin-right: 20px;
    padding: 10px;
}

.sidebar-main .channels {
    margin-top: 20px;
    font-weight: lighter;
}

.channel-head i {
    margin-right: 3px;
    font-size: 15px;
}

.sidebar-main .channel-head {
    display: flex;
    align-items: center;
    margin-bottom: 7px;
    margin-left: 6px;
}

.sidebar-main .channels .head-text {
    padding: 4px 8px;
    display: flex;
    align-items: center;
    margin-left: 5px;
    cursor: pointer;
}

.channel-head i.fa-angle-down {
    font-size: 12px;
    margin-left: 8px;
}

.sidebar-main .channels .head-text:hover {
    outline: 1px solid #00000014;
    border-radius: 5px;
}

.channel-head i.fa.fa-caret-down {
    padding: 5px 8px;
    transition: all 200ms;
}

.channel-head i.fa.fa-caret-down:hover {
    outline: 1px solid #00000014;
    border-radius: 5px;
    color: #777bfd;
    cursor: pointer;
}

.channel {
    display: flex;
    align-items: center;
    padding: 5px 7px;
    padding-left: 12px;
    user-select: none; -webkit-user-select: none;
}

.channel i.fa {
}

.channel-name {
    margin-left: 21px;
}

.channel:hover {
    color: #777bfd;
    cursor: pointer;
    background-color: #4c7fff1f;
    border-radius: 10px;
    margin-right: 20px;
}

.channel.active {
    color: #666cff;
    background-color: #c2c8ff24;
    border-radius: 10px;
    margin-right: 20px;
}

.channels.hidden .channel {
    display: none;
}

.channels.hidden .channel-head i.fa-caret-down {
    transform: rotate(-90deg);
}

.channels.hidden .channel-head {
    font-weight: normal;
    color: #3b3b3b;
}
.chat-side.submission-sidebar-page.full {
    width: 80%;
}

.chat-side.full .sidebar {
    transform: unset;
}

.chat-side.full>*:not(.modal) .content[open-depth] {
    width: calc(100% - 400px);
    margin-left: 400px;
    border-left: 1px solid #eaeaea;
}

.chat-side.full .content[open-depth='0'].right-peek:not(.left) {
    transform: unset;
    border-left: 1px solid #eaeaea;
}

.chat-side .icons .icon {
    width: 12px;
    height: 12px;
    border-radius: 100%;
    background-color: #28c83f;
    margin-left: 4px;
    margin-right: 4px;
    position: relative;
    cursor: pointer;
}

.chat-side .icons .icon.orange {
    background-color: #febc2e;
}

.chat-side .icons .icon.red {
    background-color: #fe5f56;
}

.chat-side .icons {
    display: flex;
    flex-direction: row;
    margin-top: 15px;
    padding-top: 5px;
    padding-bottom: 5px;
}

.chat-side .icons .icon i {
    font-size: 8px;
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -45%);
    display: none;
}

.chat-side .icons .icon i.fa-expand {
    font-size: 6px;
}

.chat-side .icons:hover .icon i {
    display: block;
}

.chat-side .create-channel {
    position: absolute;
    width: 80%;
    max-width: 400px;
    height: 250px;
    top: 50%;
    transform: translate(-50%, -50%);
    left: 50%;
    background-color: white;
    border-radius: 10px;
    resize: unset;
}

input#work-title {}

input#channel-name::after {
    content: "#";
    position: absolute;
    height: 10px;
    width: 10px;
    top: 0;
    left: 0;
    display: block;
    background-color: blue;
    z-index: 2;
}

.create-channel i.fa.fa-times, .create-period i.fa.fa-times, .create-category i.fa.fa-times {
    cursor: pointer;
    margin-left: auto;
} {
    cursor: pointer;
    margin-left: auto;
}

.padded-content>h2:first-child i.fa-arrow-left.back {
    position: relative;
    top: unset;
    left: unset;
    margin-right: 15px;
}

.channel-preview {
    font-size: 11px;
    display: flex;
    align-items: center;
    position: absolute;
    top: 61px;
    left: 50px;
}

.channel-preview i {
    margin-right: 4px;
    font-size: 12px;
}

.create-channel li {
    padding-top: 8px !important;
    padding-bottom: 8px !important;
    font-size: 15px;
}

.chat-side:not(.full)>.content>.content[open-depth='0']:not(.left):not(.right):not(.right-peek) {
    border-left: 1px solid #e6e6e6;
    transform: translateX(-1px);
}

.message-content-block.unsent .text-line {
    font-size: 12px;
    color: #ff7474;
}

.flex-v.input-collection {
    width: -webkit-fill-available;
}

div#tab-content.page {
    height: max-content;
    overflow:visible;
}

div#tab-content>.page {
    position: relative;
    height: max-content;
    overflow: visible;
}

.sql-entry span.tag {
    color: #ff42a6;
}

.sql-entry span.tag span.member {
    color: #ffa879;
}

.modal.add-file {
    width: 500px;
    height: 400px;
}

.modal.workflow-viewer {
    padding-bottom: 100px;
    height: 500px;
		width:1000px;
}

.modal.list-cart-items {
    width: 1000px;
    height: 650px;
}

ul>table.striped {
    width: 100%;
    padding-left: 30px;
    margin-left: unset !important;
}

.modal.select-searchable.image-search {
    width: 700px;
    height: 500px;
}

.image-search .image-result {
    width: 200px;
    height: 217px;
    overflow: hidden;
    border: 1px solid #f1f1f1;
    cursor: pointer;
}

.image-container {
    padding: 10px;
    width: calc(100% - 20px);
    height: 67%;
    position: relative;
}

.image-search .image-result .image-container img {
    width: 100%;
    height: 100%;
    object-fit: scale-down;
}

.image-search>.body {
    display: flex;
    grid-template-columns: repeat(3, 1fr);
    align-items: center;
    justify-content: center;
    padding-top: 30px;
    flex-wrap: wrap;
    row-gap: 24px;
    justify-content: left;
    padding-bottom: 150px;
}

.image-search>.body>* {
    align-self: center;
    justify-self: center;
    border-radius: 10px;
    margin-left: 24px;
    cursor: pointer;
}

.image-search .image-size {
    font-size: 11px;
    text-align: center;
    margin-top: 2px;
}

.image-search .info {
    border-top: 1px solid #0000000a;
    padding-top: 5px;
}

.image-search .image-name {
    font-size: 15px;
    text-align: center;
    margin: auto;
    margin-top: 4px;
    padding-bottom: 10px;
    white-space: nowrap;
    text-overflow: ellipsis;
    width: 90%;
    overflow: hidden;
}

.image-search .image-result:hover {background-color: #567bff0a;}

.image-search .body {
    display: flex;
    row-gap: 30px;
    padding-top: 24px;
    padding-bottom: 150px;
    flex-wrap: wrap;
}

.image-search .body>* {
    margin-left: 24px;
	border-radius:10px;
}

.image-search .padded-content {
    padding: 70px;
    padding-top: 40px;
}

button.searchable.select .text {
    max-width: 200px;
}

.searchable.select .selected {
    width: 100px;
    height: 100px;
}

.searchable.select .selected img {
    object-fit: scale-down;
    width: 100%;
    height: 100%;
}

button.searchable.select.selected {
    height: 120px;
    padding-top: 10px;
    padding-bottom: 10px;
}

.searchable.selected i.fa.fa-image {
    line-height: 100px;
    height: calc(100% + 20px);
    top: -10px;
}

.char-side>.content>.messaging-header>.icons {}

.chat-side>.content>.content>.messaging-header>.icons {
    position: absolute;
    top: -5px;
    left: 10px;
    padding-bottom: 10px;
}

input[type="color"] {
    background-color: white;
}

.padded-content.modal-padding {
	padding: 70px;
	padding-top: 40px;
}

.chat-side .update-profile {
    height: 400px;
}

.page#tab-content .graph-dashboard {
    margin: unset;
    margin-top: 30px;
}

button[disabled] {
    cursor: default;
}

.select-searchable .button-bar {}

.select-searchable .body {
    overflow: scroll;
    height: calc(100% - 52px);
}

#fee-list input {
    border: unset;
    outline: unset;
    box-shadow: unset;
    height: 30px;
    padding-top: unset;
    padding-bottom: unset;
    border-left: 1px solid #d8d8d8;
    border-radius: unset;
    margin-left: 30px !important;
    font-size: 14px;
}

#fee-list input[description] {
    margin-left: 30px !Important;
    border-left: unset;
}

#attribute-list input {
    border: unset;
    outline: unset;
    box-shadow: unset;
    height: 30px;
    padding-top: unset;
    padding-bottom: unset;
    border-left: 1px solid #d8d8d8;
    border-radius: unset;
    margin-left: 30px !important;
    font-size: 14px;
}

#attribute-list input[attribute_name] {
    margin-left: 0px !important;
    border-left: unset;
}

.notification-circle {
    color: white;
    background-color: #ff5d5d;
    width: 26px;
    height: 26px;
    text-align: center;
    line-height: normal;
    border-radius: 100%;
    justify-content: center;
    display: flex;
    align-items: center;
    cursor: pointer;
}

.vote-score {
    color: white;
    background-color: #ff5d5d;
    width: 26px;
    height: 26px;
    text-align: center;
    line-height: normal;
    border-radius: 100%;
    justify-content: center;
    display: flex;
    align-items: center;
    cursor: pointer;
}


.channels .channel .notification-circle {
    width: 18.5px;
    height: 18.5px;
    font-size: 10px;
    margin-left: auto;
    margin-right: 20px;
}

.channels .channel:not(.active):hover .notification-circle, .channel.active .notification-circle {
    margin-right: unset;
}

.messaging-header .notification-circle {
    width: 10px;
    height: 10px;
    position: absolute;
    left: 34px;
    top: 42px;
    user-select: none; -webkit-user-select: none;
    pointer-events: none;
}

.monitor-item .notification-circle {
    position: absolute;
    top: 5px;
    left: 14px;
    width: 8px;
    height: 8px;
}

.messaging-body hr.new-messages {
    background-color: #ff5a5a !important;
    width: calc(100% - 65px);
    height: 1px !important;
    border: unset;
    flex-shrink: 0;
    border-radius: 10px;
    margin-top: 5px;
    margin-bottom: 5px;
}

.channel-head i.fa.fa-plus:hover {
    outline: 1px solid #00000014;
    border-radius: 5px;
    color: #777bfd;
    cursor: pointer;
}

.channel-head i.fa.fa-plus {
    padding: 5px 5px;
    top: unset;
    right: unset;
    position: relative;
    margin-left: auto;
    margin-right: 30px;
    display: none;
}

.channel-head:hover i.fa.fa-plus {
    display: block;
}

.messaging-body div.new-messages {
    display: flex;
    flex-direction: row;
    color: #ff5a5a;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    user-select: none; -webkit-user-select: none;
}

.new-messages p {
    margin-right: 10px;
    font-size: 15px;
}

.modal.create-period {
    width: 600px;
    height: 440px;
}

.input-collection .switch {margin-top: 8px;margin-left: 2px;}

.modal.create-category {
    width: 1060px;
    height: 670px;
}

.input-collection .button-bar {}

.input-collection .button-bar button {
    max-height: unset;
    height: 39px;
}

.input-collection .button-bar button.searchable i.fa.fa-keyboard {
    height: 39px;
    line-height: 39px;
}

.input-collection .button-bar button.searchable .text {
    height: 39px;
    line-height: 39px;
}

table.striped tr.highlight, table.striped tr.highlight td {
    background-color: #bdcae2 !important;
    filter: contrast(1.2) !important;
}

table.striped tr.anti-highlight {
    filter: blur(1px);
}

table.striped tr.source-highlight, table.striped tr.source-highlight td {
    filter: contrast(1.2) !important;
    background-color: #cfbfff !important;
}

.reactions, .reacted {
    position: absolute;
    background-color: #dddddd;
    color: #494949;
    width: auto;
    height: auto;
    display: flex;
    padding: 8px;
    border-radius: 20px;
    top: -35px;
    right: 15px;
    animation: popIn 0.3s ease forwards; /* Animation name, duration, timing function, fill mode */
}

.reactions>*, .reacted>* {
    margin-left: 6px;
    margin-right: 6px;
    cursor: pointer;
    transition: all 100ms;
    display: flex;
}

.reactions::after, .reacted::after {
    content: "";
    width: 16px;
    height: 16px;
    background-color: inherit;
    left: 1px;
    top: 67%;
    position: absolute;
    border-radius: 20px;
}

.reactions::before, .reacted::before{
    content: "";
    width: 8px;
    height: 8px;
    background-color: inherit;
    left: -3px;
    top: 111%;
    position: absolute;
    border-radius: 20px;
    border: 1px solid white;
}

.message-content-block.reacting {
    background-color: white;
}

.messaging-body.reacting >.message-content-block:not(.reacting), .messaging-body.reacting .time-separator {
    background-color: #ffffff;
    z-index: -1;
    background-color: unset;
}

.reactions>*:hover {
    transform: scale(1.2);
}

.message-content-block.turn-change-block.reacting:hover {
    background-color: white;
}

.message-content-block {}

.message-content-block.reacting:not(.turn-change-block) .time {
    display: block;
}

.messaging-body.reacting {background-color: #f0f0f0ab;overflow: hidden;}

@keyframes popIn {
    0% {
        transform: scale(0); /* Start scaled down to nothing */
        opacity: 0;
    }
    50% {
        transform: scale(1.1); /* Slightly overshoot the normal size */
        opacity: 0.5;
    }
    100% {
        transform: scale(1); /* Scale back to normal size */
        opacity: 1;
    }
}

.reacted:not(.self)::after{
	left: unset;
	right: 1.4px !important;!i;!;!;
	transform: rotate(-75.3deg);
}

.turn-change-block .reacted {
    z-index: 100;
    padding: 8px;
    top: -10px;
}

.reacted {
    z-index: 100;
    width: 17px;
    height: 17px;
    text-align: center;
    display: flex;
    align-items: center;
    justify-content: center;
    line-height: 17px;
    border: 1px solid white;
}

.reacted>* {
    margin-left: unset;
    margin-right: unset;
    height: 16px;
    display: flex;
}

.reacted::after {
    width: 13px;
    height: 13px;
    left: 1.5px;
    top: 22.2px;
    z-index: -4;
    border: 1px solid white;
    border-top-color: transparent;
    border-right-color: transparent;
    transform: rotate(345deg);
}

.reactions {
    z-index: 101;
}

.message-content-block.reacting .reaction-collection {
    opacity: 0.4;
}

.reacted.self {
    background-color: #3d81ff;
    color: white;
}


[index='exclamation'] i.fa.fa-exclamation {
    font-size: 18px;
}

[index='exclamation'] i.fa.fa-exclamation:first-child {
    transform: rotate(-2deg) translate(-1px, -1px);
    margin-right: unset;
}

[index='exclamation'] i.fa.fa-exclamation:last-child {
    transform: rotate(-2deg) translate(0px, 0px);
}

.message-content-block.turn-change-block .reaction-collection {
    transform: translateY(20px);
}

.message-content-block:not(.turn-change-block) .reaction-collection {
    transform: translateY(-1px);
}

.message-content-block .reaction-collection {
    z-index: 10;
}

.message-content-block.reacting.show-reactions .reaction-collection {
    opacity: 1;
}

.flex-h.reaction-members {
    align-items: center;
    justify-content: center;
    width: 100%;
}

.reaction-member .profile-image {
    !i;!;
}

.reaction-member .profile-image .account-icon-actual {
    !i;!;
    !i;!;
}

.reaction-member .reaction-counts {
    justify-content: center;
    margin-top: 14px;
    align-items: center;
    display: flex;
}

.reaction-counts [index='exclamation'] i.fa.fa-exclamation:first-child {
    margin-right: 3px;
}

.reaciton-counts {
    display: flex;
    flex-direction: column;
}

.reaction-counts [index='exclamation'] i.fa.fa-exclamation:last-child {
    margin-right: 0px;
}

.mention-display .mention-candidate .reaction-member .profile-image {
    width: 80px !important;!i;!;
}

.reaction-counts .real-reaction-count {
    margin-left: 9px;
}

.reaction-counts i {
    margin-right: unset !important;
}

.reaction-members[index] .side-reaction {
    margin-right: auto;
    display: flex;
}

.reaction-members[index] .close {
    margin-left: auto;
    margin-right: 10px;
    cursor: pointer;
}

.side-reaction {}

.side-reaction .count {
    margin-left: 12px;
    margin-right: 5px;
}

::before {}

.reacted:not(.self)::before {
    left: unset !important;
    right: -4px !important;
}

.message-content-block .poll {
    margin-right: 80px;
    width: -webkit-fill-available;
    background-color: #fcfcfc;
    border-radius: 10px;
    border: 1px solid #cccccc;
    position: relative;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    min-height: 150px;
    margin-top: 10px;
}

.poll .header .poll-title {
    font-weight: normal;
    margin-top: 12px;
    padding-left: 20px;
    padding-right: 20px;
}

.poll .icon {
    position: absolute;
    font-weight: normal;
    color: gray;
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 12px;
    margin-right: auto;
    left: 10px;
    top: 10px;
}

.poll .icon i {
    margin-right: 7px;
}

.poll .footer {
    margin-top: auto;
    height: 20px;
}

.poll .hint-bar {
    margin-top: auto;
}

.poll-body .option .select {
    width: 16px;
    height: 16px;
    background-color: white;
    margin-right: 13px;
    border-radius: 100%;
    border: 1px solid #777777;
    cursor: pointer;
    flex-shrink: 0;
}

.poll-body .option {
    display: flex;
    padding-left: 20px;
    padding-top: 7px;
    padding-bottom: 7px;
    font-size: 13px;
    align-items: center;
    border-bottom: 1px solid #efefef;
    cursor: pointer;
}

.poll .poll-body {
    margin-top: 20px;
    border-top: 1px solid #efefef;
}

.poll-body .option .select.selected {
    background-color: #6274e7;
}

.poll-body .option:hover {
    background-color: #f4f4f4;
}

.poll-body .option:not(.results):last-child {
    margin-bottom: 15px;
}

.poll-body .option .option-text {
    margin-right: 15px;
}

.poll .button-bar {
    margin-right: 10px;
    margin-bottom: 15px;
    width: max-content;
    margin-left: auto;
}

.option.results .votes-bar {
    width: calc(100% - 20px);
    height: 10px;
    background-color: #e0e0e0;
    margin-top: 6px;
    border-radius: 3px;
    overflow: hidden;
}

.option.results {
    flex-direction: column;
    align-items: flex-start;
}

.option.results .votes-bar .votes {
    background: linear-gradient(90deg, #6c75ff, #6c9bff);
    height: 100%;
    width: 0%;
}

.option.results .votes-text {
    margin-top: 7px;
    font-size: 11px;
}

.poll-options {
    border-top: 1px solid #eeeeee;
    padding-left: 20px;
    padding-right: 20px;
    padding-bottom: 20px;
}

#poll.active i.fa.fa-check-to-slot {
    color: #4f4fff;
}

.poll.skeleton {}

.poll.skeleton .poll-title {
    color: transparent;
    background-color: #dddddd;
    max-width: 80%;
    border-radius: 5px;
    width: max-content;
}

table.paging.striped .button-bar button#page-size i {
    padding: unset;
}

.modal .draft-input {}

.modal .draft-box {
    left: 0px;
    bottom: 60px;
    position: absolute;
    background: unset;
}

.modal .draft-box .draft-input {
    margin: 30px;
    width: calc(100% - 60px);
}

.modal .draft-box .mention-suggestions {
    position: absolute;
    top: 20px;
    transform: translateY(-100%);
    width: calc(100% - 60px);
    margin-left: 30px;
    z-index: 100000;
}

.modal .candidates {
    max-height: 145px;
}

.modal.create-assignment-rule {
    height: 665px;
    width: 670px;
}

.create-assignment-rule #members .mention {
    font-size: 16px;
}


.side-filter-menu {
    width: 587px;
    height: 100%;
    position: fixed;
    right: 0;
    top: 0;
    background-color: white;
    z-index: 1300;
    background-color: #ffffff30;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    transition: all 200ms;
    box-shadow: 0 0 7px 0 #00000014;
}

.side-filter-menu .backdrop {
    -webkit-backdrop-filter: saturate(180%) blur(20px);
    backdrop-filter: saturate(200%) blur(9px);
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
}

.side-filter-menu.right {
    transform: translateX(calc(100% - 65px));
}

.side-filter-menu .filter-menu-header {
    width: calc(100% - 80px);
    height: 105px;
    background-color: ff4c4c;
    background: linear-gradient(26deg, #191919, #1d1d1d);
    position: relative;
    z-index: 1;
    padding: 11px 30px 11px 50px;
    color: white;
    user-select: none; -webkit-user-select: none;
}

.filter-menu-header h2 {
    color: white;
    margin-top: unset;
    margin: unset;
    font-size: 24px;
}

.flex-h {
    display: flex;
    flex-direction: row;
}

.filter-menu-header .flex-h {
    align-items: center;
    justify-content: space-between;
}

input.borderless-input {
    outline: unset;
    border: unset;
    box-shadow: unset;
    padding-left: unset;
    width: calc(100%);
    border-bottom: 1px solid #00000036;
    border-radius: unset;
    font-size: 15px;
    padding-bottom: 15px;
    color: #3b3b3b;
}

.filter-menu-header input {
    box-shadow: unset;
    outline: unset;
    border: unset;
    width: 265px;
    border-radius: 3px;
    padding: 8px 20px;
    font-size: 16px;
}

input[type="checkbox"] {
    width: fit-content;
}

.filter-menu-header .flex-h.type-filter {
    margin-top: 5px;
    justify-content: start;
}

.filter-menu-header .flex-h.type-filter>.flex-h {
    margin-left: 15px;
    font-size: 17px;
}

.side-filter-menu.right .filter-menu-header {
    background: linear-gradient(45deg, #f35a5a, #886eff);
    cursor: pointer;
}

.side-filter-menu i.fa.fa-arrow-from-right {
    display: none;
}

.side-filter-menu.right i.fa.fa-arrow-from-right {
    position: absolute;
    z-index: 10000;
    color: white;
    left: 20px;
    top: 50%;
    transform: translateY(-50%);
    display: block;
    font-size: 25px;
}

.side-filter-menu.right .filter-menu-header:hover .fa {
    color: #ebebeb;
}

.filter-listing i.fa.fa-bars {
    padding: 10px;
    margin-right: 20px !important;
    background: linear-gradient(45deg, #ff7474, #7c6aff);
    color: white;
    border-radius: 5px;
}

.filter-listing ul[list] li {
    background-color: transparent;
    border-bottom: unset;
    user-select: none; -webkit-user-select: none;
}

.side-filter-menu.right h2 {
    color: transparent;
}

.side-filter-menu.right li {
    display: none;
}

.filter-listing li.sort-filter, .filter-listing li.ghost-drag {
    background-color: white;
    border-bottom:unset;
}

.settable .main .value>* {
    margin-left: 10px;
    margin-right: 10px;
}

.settable .main ul {
    height: calc(100% - 16% - 40px);
    overflow: scroll;
    margin-bottom: unset;
    margin-top: unset;
}

.filter-listing ul li .value>* {
    display: none;
}

.filter-menu-header input[filter-lookup] {
    width: 266px;
}
.filter-listing {
    overflow: scroll;
    height: calc(100% - 130px);
    background-color: white;
}

.side-filter-menu.right .filter-listing {
    display: none;
}

.filter-listing ul[list] li i.fa-bars {
    cursor: grab;
}

.filter-listing li[uuid] .value {
    color: transparent;
}

.search-sidebar.right-filter-sidebar {
    left: unset;
    right: 0;
    position: absolute;
    top: 0;
    z-index: 20;
    width: 350px;
    box-shadow: -1px 0px 6px #00000030;
}

.search-sidebar.right-filter-sidebar.right {
    right: -350px;
}

.right-filter-sidebar .padded-content {
    padding-top: 15px;
    padding: 30px;
    padding-top: 15px;
    !mportant;!I;!;
    width: calc(100% - 30px) !important;
}

.right-filter-sidebar h2 {
    margin-top: 15px;
}

.modal.printers.users {
    width: 700px;
    height: 570px;
}

.assignment-tags .assignment-tag {
    background-color: #f6f6f6;
    color: black;
    padding: 6px;
    margin-right: 5px;
    border-radius: 5px;
    padding-left: 5px;
    padding-right: 10px;
    display: flex;
    align-items: center;
    flex-shrink: 0;
    height: 20px;
    margin-top: 1px;
    position: relative;
    transform: rotate(0deg);
    transition: transform 50ms linear, filter 50ms linear, margin-right 200ms ease-in, background-color 25ms linear;
}

.assignment-tags {
    display: flex;
    width: calc(100% + 10px);
    overflow-x: scroll;
    overflow-y: visible;
    height: 80px;
    flex-shrink: 0;
    align-items: center;
    margin-top: -20px;
    margin-bottom: -20px;
    margin-left: -10px;
}

.assignment-tags .assignment-tag:first-child {
    margin-left: 1px;
}
.assignment-tags .assignment-tag .member-icon {
    margin-right: 5px;
}

.assignment-tags:empty {
    height: 0px;
}

.assignment-tags .assignment-tag * {
    outline: unset;
}

.modal.edit-category {
    width: 444px;
    height: 300px;
}

.assignment-tags.submission-tags .assignment-tag.tag {
    background-color: #5f40ff;
    color: white;
    font-size: 13px;
    padding: 2px 9px;
}

.assignment-tags .assignment-tag.create {
    background-color: #d0deff !important;!i;!;
    color: #5f40ff !important;!i;!;
    cursor: pointer;
    transition: all 100ms;
}

.assignment-tags:not(:hover) .assignment-tag:not(.create) ~ .assignment-tag.create {
    display: none;
}


.modal.add-submission-tag {
	width: 600px;
    height: 405px;
}

.modal.edit-tags {
    height: 500px;;
}

.messaging-header.expand {
    height: auto;
    display: flex;
    flex-direction: column;
    padding-top: 0px;
    padding-bottom: 0px;
}

.messaging-header.expand {
    overflow: visible;
}

.messaging-header.expand .draft-input div#recipient {
    border: unset !important;
    padding-top: 10px;
    padding-bottom: 10px;
    line-height: 26px;
}

.messaging-header.expand .draft-input {
    border: unset;
    margin-left: -5px;
    margin-bottom: unset;
    background-color: unset;
}

.create-modal-flex .icon i.fa.fa-edit {
    margin-left: unset;
    outline: unset;
    padding: unset;
}

.create-modal-flex .icon {
    margin-right: 20px;
    background-color: #3b3bff;
    border-radius: 100%;
    color: White;
    width: 40px;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
}

flex-v.create-modal-right>div:nth-child(1) {}

.flex-v.create-modal-right>div:nth-child(1) {
    font-size: 16px;
    margin-bottom: 4px;
    margin-top: -1px;
}

li#new-message:hover, li#new-channel:hover {
    background-color: #ededed !important;!
}

li#new-message, li#new-channel {
    padding-left: 30px;
}

i.fa.fa-question-circle {
    font-size: 18px;
    margin-left: 10px;
    color: #646ecb;
    transition: all 100ms;
}

i.fa.fa-question-circle[url]:hover {
    transform: scale(1.1);
    transform-origin: center center;
}

i.fa.fa-question-circle[url]:hover {
    cursor: pointer;
}

.modal.export-submissions {
    width: 490px;
    height: 330px;
}

.flex-h.submission-files {
    flex-wrap: wrap;
    justify-content: left;
    margin-left: -10px;
    width: calc(100% + 20px);
}

.submission-file {
    border: 1px solid #ededed;
    border-radius: 6px;
    overflow: hidden;
    padding: 10px;
    box-shadow: 0 0 3px 0 #00000005;
    justify-content: center;
    display: flex;
    flex-direction: column;
    margin-bottom: 20px;
    width: calc(50% - 42px);
    max-width: 50%;
    margin-right: 10px;
    margin-left: 10px;
    align-self: flex-start;
    position: relative;
}

.submission-file-flag {
    font-size: 12px;
}

.submission-file audio {
    width: calc(100% - 40px);
    padding-left: 20px;
    padding-right: 20px;
    padding-top: 18px;
    padding-bottom: 20px;
}

.submission-file embed {
    padding-left: unset;
    padding-right: unset;
    width: 100%;
    border-bottom: 2px solid #414547;
}

.sql-entry.no-pad .editor-contents {
    padding-top: unset;
    height: 100% !important;
    max-height: 100%;
}

.sql-entry.no-pad .editor-contents {
}

.no-pad .line[line='0'] {
    padding-top: 35px;
}



.login-double-pane>.flex-v {
    height: auto;
    position: relative;
}

.flex-v.login-window {
    width: 39%;
    max-width: 500px;
    flex-shrink: 0;
    min-width: 500px;
}

.flex-h.login-double-pane {
    height: auto;
    width: 100%;
    flex-wrap: nowrap;
}

.login-double-pane .flex-v.ui-window {
    background: url("https://sites.middlebury.edu/newenglandreview/files/2024/03/Cummings-Rose-Hat-4b8aaefb29ed778d.jpg");
    background-position: center center;
    border-radius: 20px;
    left: 20px;
    height: calc(100vh - 50px);
    min-width: 400px;
    position: sticky;
    top: 25px;
    bottom: 50px;
    margin-top: 25px;
    flex-grow: 1;
    flex-shrink: 0;
}

.login-double-pane .ui-window .ui-logo-pane {
    position: relative;
    top: calc(100% - 60px);
    cursor: pointer;
}

.login-pad {
    padding: 75px;
    height: auto;
    top: 0px;
    position: relative;
}

.login-pad h1 {
    font-size: 26px;
    margin: 0;
    margin-bottom: 15px;
    font-weight: 500;
}

input {
}

input.borderless-input {
    outline: unset;
    border: unset !important;
    box-shadow: unset !important;
    padding-left: unset !important;
    width: calc(100%) !important;
    border-bottom: 1px solid #00000036 !important;
    border-radius: unset !important;
    font-size: 16px !important;
    padding-bottom: 15px !important;
    color: #3b3b3b !important;
}

.flex-v {
}

.login-pad .flex-v.credentials {
}

input.borderless-input::placeholder {
    color: #00000054;
    font-weight: lighter;
}

input.borderless-input::-webkit-input-placeholder {
    color: #00000054;
    font-weight: lighter;
}

input.borderless-input::-moz-placeholder {
    color: #00000054;
    font-weight: lighter;
}

input.borderless-input::-ms-input-placeholder {
    color: #00000054;
    font-weight: lighter;
}

.login-pad .credentials input {
    margin-top: 15px;
    padding-top: 20px;
    font-size: 16px !important;
    !impo;!impot;!i;!; }

.flex-h.actions-bar {
    justify-content: space-between;
    margin-top: 13px;
}

.login-pad .flex-h.center.login-button {
    margin-top: 45px;
}

.login-button .button-bar {
    height: 45px;
    width: fit-content;
    width: -moz-fit-content;
    width: 100%;
}

.login-pad .login-button button.blue.login {
    padding: 0px 60px;
    height: 100%;
    font-size: 17px;
    background: #191919;
    width: 100%;
    box-shadow: unset;
    padding-bottom: unset;
    position: relative;
    transform: unset;
    left: unset;
    top: unset;
    color: white;
}

.login-pad .flex-h.center.sign-up {
    margin-top: 30px;
    font-size: 14px;
    padding-bottom: 100px;
}

.login-pad .sign-up a {
    color: black;
    font-weight: 500;
    margin-left: 5px;
    cursor: pointer;
}

input:-webkit-autofill, input:-webkit-autofill:hover, input:-webkit-autofill:focus, input:-webkit-autofill:active {
    -webkit-box-shadow: 0 0 0px 30px #ffffff inset !important;
}

input.error:-webkit-autofill, input.error:-webkit-autofill:hover, input.error:-webkit-autofill:focus, input.error:-webkit-autofill:active {
    -webkit-box-shadow: 0 0 0 30px #ffe7e8 inset !important;
    !inset !important;!iinset !important;!iminset !important;!impinset !important;!impoinset !important;!imporinset !important;!importinset !important;!importainset !important;!importaninset !important;!importantinset !important; }

input.borderless-input.error {
    border-bottom: 1px solid #a02118 !important;
    margin-top: 14px;
    width: calc(100%);
}

.login-window .credentials input.borderless-input.error:first-of-type {
    margin-top: 15px;
}

.login-window a.forgot {
    cursor: pointer;
    color: black;
    font-weight: 500;
    font-size: 14px;
}


.user-account-box {
}

.user-account-box {
    border: 1px solid #ffffff !important;
    padding: 5px 16px;
    border-radius: 4px;
    display: flex;
    align-items: center;
    padding-left: 5px;
    margin-right: 30px;
    cursor: pointer;
    background-color: white;
    color: #4a4a4a;
}

.user-account-box i.fa {
    font-size: 14px;
    transform: translateY(1px);
    margin-left: 10px;
    color: #7083e7;
}

.user-account-box i.fa.fa-user {
    margin-right: 13px;
    font-size: 12px;
    color: #7083e7;
}


@media screen and (max-width: 880px){
  .splash svg{
    width: 80%;
    transform: translate(0, -30px);
  }

  .login-pad {
  }

  .flex-v.login-window {
      width: 100%;
      min-width: unset;
      max-width: unset;
  }

  .flex-v.login-window .login-pad {
      padding-left: 45px;
      padding-right: 45px;
      padding-top: 20px;
      padding-bottom: 50px;
      top: 0;
  }

  .login-pad h1{
      font-size:28px;
  }

  .login-pad {
      margin: auto;
  }

  .login-pad.register-pad {
    top: 2% !important;
    margin-top: unset;
  }

  .button-bar#proceed button {
    width: 50%;
    font-size: 14px;
  }

  .button-bar#proceed {
      width: 100%;
  }

  div#no-credentials {
    padding: 8%;
  }

  [block='address']:not(.complete) h2 .button-bar {
      margin-right: unset;
  }

  table#runs-list tr td:nth-child(1), table#runs-list tr th:nth-child(1) {
      display: none;
  }
}

@media screen and (max-height: 1000px){
  .login-pad.register-pad {
  }
}


@media screen and (max-height: 770px){
  .login-pad.register-pad {
    padding-bottom: 100px;
    height: auto;
    overflow: visible;
  }

  .login-pad .flex-h.center.sign-up {
      padding-bottom: 100px;
  }
}

p.warning {
    color: #a42828;
    margin-top: 20px;
    font-size: 17px;
}

.login-pad .flex-h.sign-up {
    margin-top: 20px;
}

.personal-flag {
    position: absolute;
    font-size: 10px;
    background-color: #3e74ff;
    padding: 4px 6px;
    border-radius: 12px;
    color: white;
    right: 10px;
}

.notifications-view {
    width: 400px;
    height: 400px;
}

.notification-line .title {
    font-size: 17px;
    color: #000000;
}

.notification-line {
    transition: all 100ms;
    border-bottom: 1px solid #eaeaea;
    padding-bottom: 5px;
    padding-top: 5px;
    padding: 10px 6px;
    position: relative;
    cursor: pointer;
}

.notification-line .body {
    font-size: 13px;
    margin-top: 3px;
    color: #5e5e5e;
    margin-right: 30px;
}

.notification-line:first-child {
    border-top: 1px solid #eaeaea;
}

.notification-line .flex-h.bar>* {
    margin-right: 24px;
    font-size: 10px;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
}

.notification-line .flex-h.bar {
    margin-top: 6px;
    align-items: center;
}

.notification-line.unread {
    background-color: #ecf0ff;
}

.unread-bubble {
    width: 10px;
    height: 10px;
    position: absolute;
    right: 10px;
    top: 50%;
    transform: translate(-50%, -50%);
    background-color: #ff7c7c;
    border-radius: 100%;
    display: none;
}

.notification-line.unread .unread-bubble {
    display: block;
}

.notification-line:hover {
    background-color: #d9d9ff;
}

.notification-line:hover {}

.notifications-view .notification-header {
    width: calc(100% + 30px);
    margin-left: -15px;
    box-shadow: 0px 8px 7px 0 #0000001a;
    margin-top: -15px;
    background-color: white;
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
    height: 30px;
    padding-top: 0px;
    position: relative;
    z-index: 1000;
}


.module h1 {
    padding-left: 30px;
    font-size: 32px;
    display: flex;
}

.module h1 .default-tag {
    font-size: 12px !important;
    align-self: center;
    height: 20px;
    line-height: 20px;
    white-space: nowrap;
}

[point-set='billing-tabs'] .module {
    margin-bottom: 38px;
    padding-top: 20px;
    margin-top: 20px;
    border-top: 1px solid #ededed;
}

div[family] {
    border-bottom: 1px solid #999999;
    padding-top: 40px;
    padding-bottom: 30px;
}

div[family] .module #body ul {
    margin-bottom: unset !important;
}

[family] .module {
    box-shadow: 0 0 6px 0 #0000001a;
    margin-bottom: 20px;
    padding-top: 10px;
    padding-bottom: 5px;
    border-radius: 6px;
    position: relative;
}

.view-pricing {
        margin-right: 26px;
        font-size: 14px;
        color: #6767ff;
        font-weight: bold;
        cursor: pointer;
        display: flex;
        align-items: center;
        user-select: none; -webkit-user-select: none;
}

.modal *:not([family])>.module h1 {
    padding-left: unset !important;
}

.modal *:not([family])>.module #body ul {
    margin-left: unset !important;
}

.modal *:not([family])>.module #body h4.plan_desc {
    margin-left: unset !important;
}

.view-pricing.open i {
    transform: rotate(90deg);
}

.view-pricing i {
    transform: none;
    transition: 200ms;
}

div[family]:first-of-type {
    padding-top: unset;
}

.features-guide {
    padding-right: 30px;
    padding-top: 25px;
    width: calc(100% - 60px);
    border-top: 1px solid #e1e1e1;
    padding-left: 30px;
    padding-bottom: 25px;
}

.module div#body {
    position: relative;
    padding-bottom: 25px;
}

.features-guide article {
    margin-bottom: unset;
}

article h1 {
    padding-left: unset !important;
}


sup { vertical-align: top; font-size: 1em; }

.status-item.connected-account {
    background-color: #765fff !important;
}

.customer .customer-header i.fa.fa-plug {
    color: #6161e2;
    font-size: 11px;
    transform: translate(8px, -7px);
    position: absolute;
}


.currency-input::after {
    content: attr(currency);
    position: absolute;
    left: 12px;
    top: 50%;
    transform: translateY(-53%);
}

.currency-input {
    position: relative;
}

.currency-input input {
    padding-left: 25px;
}

label sup {
    color: #a83a3a;
    margin-left: 2px;
}

button#setup-payments {
    height: 51px;
    background-color: #6b81ff;
    font-weight: 500;
    color: white;
    font-size: 19px;
}

tr.archived:nth-child(2n+1) td {
    background-color: #ffcf78 !important;!i;!;
}

tr.archived:nth-child(2n) td {
    background-color: #ffebc6 !important;
}


.action-call:hover {
    transform: scale(1.05);
}

.profile-image.system.small {
    width: 35px;
    height: 35px;
    margin-bottom: unset;
}

.profile-image.small.no-image p {
    font-size: 16px !important;
}

.profile-section {
    display: flex;
    align-items: center;
    cursor: pointer;
}

.profile-section i.fa.fa-bars {
    margin-left: 15px;
    margin-right: 25px;
}

.profile-section:hover {
    opacity: .8;
}

.profile-modal {
    width: 235px;
    height: auto;
    position: absolute;
    top: 75px;
    right: 35px;
    background-color: white;
    border-radius: 8px;
    box-shadow: 0 0 6px 0 #00000029;
    display: flex;
    flex-direction: column;
    z-index: 10;
}

.profile-modal .profile-modal-header {
    padding-top: 14px;
    padding-bottom: 14px;
    width: 100%;
    padding-left: 16px;
}

.profile-modal .profile-name {
    margin-left: 13px;
    font-weight: 500;
}

.profile-modal .profile-image.small {
    width: 35px;
    height: 35px;
}

.profile-modal li {
    justify-content: start !important;
    align-items: center;
    border-bottom: unset !important;
    padding: 6px 23px !important;
    cursor: pointer;
    color: #3d3d3d;
}

.profile-modal li i {
    margin-right: 10px;
    font-size: 13px;
}

.profile-modal ul {
    padding-top: 10px;
    padding-bottom: 10px;
    border-top: 1px solid #efefef;
}

.profile-modal li:hover {
    cursor: pointer;
    opacity: 0.8;
}

.profile-modal .profile-modal-header i.fa-times{
  display:none;
}

.profile-modal.right{
  display:none;
}



.profile-header.flex-h {
    margin-top: 30px;
    align-items: center;
    padding-bottom: 30px;
    border-bottom: 1px solid #00000012;
    margin-bottom: 30px;
}


.full-name {
    font-size: 27px;
    display: flex;
    align-items: flex-end;
}

.profile-header .main-info {
    margin-left: 50px;
    height: auto;
}

.profile-image.no-image>p {
    display: block;
    font-size: 40px;
    width: 100%;
    text-align: center;
    color: white;
    height: max-content;
    line-height: 15px;
    font-weight: bold;
}

.profile-image>p {
    display: none;
}

.article-content-container.max {
    height: 100%;
}

.profile-image i.fa-pencil-alt {
    position: absolute;
    bottom: 0;
    color: #7f85dc;
    background-color: #ffffff;
    padding: 6px;
    border-radius: 100%;
    right: 0;
    border: 2px solid #ffffff;
    box-shadow: 0 0 4px 0 #0000003b;
    cursor: pointer;
    transition: all 100ms;
}

.profile-image i:hover {
    transform: scale(1.05);
}

.profile-header.flex-h {
    margin-top: 30px;
    align-items: center;
    padding-bottom: 30px;
    border-bottom: 1px solid #00000012;
    margin-bottom: 30px;
}

.profile-image.system {
    width: 100px;
    height: 100px;
    border-radius: 200px;
    background-color: #2c2c2c;
    overflow: visible;
    position: relative;
    display: flex;
    align-items: center;
    background-size: cover;
    background-position: center center;
    background-repeat: no-repeat;
    cursor: pointer;
}

.full-name {
    font-size: 27px;
    display: flex;
    align-items: flex-end;
}

.profile-header .main-info {
    margin-left: 50px;
    height: auto;
}

.profile-image.no-image>p {
    display: block;
    font-size: 40px;
    width: 100%;
    text-align: center;
    color: white;
    height: max-content;
    line-height: 15px;
    font-weight: bold;
}

.profile-image>p {
    display: none;
}

.article-content-container.max {
    height: 100%;
}

.profile-image i.fa-edit {
    position: absolute;
    bottom: 0;
    color: #7f85dc;
    background-color: #ffffff;
    padding: 6px;
    border-radius: 100%;
    right: 0;
    border: 2px solid #ffffff;
    box-shadow: 0 0 4px 0 #0000003b;
    cursor: pointer;
    transition: all 100ms;
}

.profile-image i:hover {
    transform: scale(1.05);
}

.edit-call {
    display: inline-block;
    font-size: 13px;
    align-self: center;
    vertical-align: middle;
    margin-left: 14px;
    cursor: pointer;
    color: #7f85dc;
    transition: all 100ms;
    transform-origin: center left;
    align-self: center;
    white-space: nowrap;
}

.edit-call i {
    font-size: 10px !important;
    margin-left: 5px;
    vertical-align: middle;
    transform: translateY(-1px);
}

.edit-call:hover {
    transform: scale(1.1);
}

textarea.biography:empty::after {
    content: attr(placeholder);
}

span.name-edit-container {
    white-space: nowrap;
    margin-bottom: 17px;
    margin-right: 20px;
}

label.small {
    font-size: 12px;
    margin-bottom: 4px;
}

.profile-image.large {
    width: 200px;
    height: 200px;
    margin: auto;
    margin-top: 30px;
    margin-bottom: 20px;
}

.profile-image.large.no-image>p {
    font-size: 60px;
}

.modal.change-address {
    width: 740px;
    height: 570px;
}


article>h2:not(article>h2:first-of-type) {
    font-weight: bold;
    padding-top: 15px;
    padding-bottom: 15px;
    margin-top: unset;
}

.image-wrapper img, .video-wrapper video {
    border-radius: 10px;
}

.article-content-container .right-box {
    width: 250px;
    display: block;
    position: sticky;
    top: 52px;
    padding-left: 50px;
    padding-right: 15px;
    flex: none;
    max-height: 600px;
    height: 100%;
}

.content-container .article-flex-box, .page .article-flex-box {
    padding-left: 100px;
    padding-right: 100px;
    padding-top: 25px;
    display: flex;
    position: relative;
}

span.table-of-contents-header {
    font-weight: 500;
    font-size: 13px;
}

.table-of-contents-item {
    padding: 10px 10px 10px 0px;
    cursor: pointer;
    font-size: 14px;
}

.table-of-contents-list {
    margin-top: 5px;
    flex-direction: column;
}


article {
    display: block;
    flex-grow: 1;
    flex-direction: column;
    max-width: 100%;
    min-width: 0
}

.tox.tox-tinymce {
    display: flex;
    flex-grow: 1;
    margin-bottom: 30px;
}

ul>.tox.tox-tinymce {
    margin-left: 30px;
    margin-top:30px;
}

#runs-list tr td:last-child, #runs-list tr th:last-child {
    position: sticky;
    right: 0;
    width: min-content !important;
    background: linear-gradient(90deg, transparent, #ffffff);
}


#submissions tr th:last-child {}

#runs-list>thead>tr td:last-child, #runs-list>thead>tr th:last-child {
    background: unset !important;
}

#runs-list tr:nth-child(odd) td:last-child, #runs-list tr:nth-child(odd) th:last-child {
    background: linear-gradient(90deg, transparent, #e3e7ef);
}

.tox-toolbar__primary {
    width: 91% !important;
}

.message-content-block.outbound {
    background-color: #eff1ff;
    border-top: 1px solid #93abff;
    border-bottom: 1px solid #93abff;
}

.extra {}

.outbound .extra, .inbound .extra {
    font-size: 12px;
    margin-left: auto;
    margin-right: 10px;
    color: #6666ff;
}

.message-content-block.outbound+.message-content-block.outbound {
    border-bottom: unset;
}

.message-content-block.inbound {
    background-color: #fff2ef;
    border-top: 1px solid #ed9b5e;
    border-bottom: 1px solid #ed9b5e;
}


.message-content-block.inbound+.message-content-block.inbound {
    border-bottom: unset;
}

.message-content-block.outbound+.message-content-block.inbound, .message-content-block.inbound+.message-content-block.outbound {
    border-bottom: unset;
}


.inbound .extra {
    font-size: 12px;
    margin-left: auto;
    margin-right: 10px;
    color: #cc6026;
}

.message-content-block.inbound+.new-messages, .new-messages+.message-content-block.outbound {
    padding-top: 15px;
    padding-bottom: 15px;
}

.new-messages+.message-content-block.outbound {}

.workflow-window {
    position: fixed;
    width: 336px;
    height: auto;
    z-index: 1000000000;
    overflow: hidden;
    box-shadow: 0 0 8px 0 #000000;
    top: 66px;
    cursor: pointer;
    cursor: cell;
    background-color: white;
    border-radius: 4px;
    right: 30px;
    min-height:100px;
}

.workflow-window img {
    user-select: none;
    width: 100%;
}

.workflow-window i.fa.fa-times {
    position: absolute;
    color: black;
    right: 20px;
    top: 20px;
    font-size: 20px;
    cursor: pointer;
    padding: 5px;
    background-color: white;
    height: 20px;
    width: 20px;
    border-radius: 100px;
    border: 1px solid black;
    text-align: center;
    vertical-align: middle;
}

.workflow-window.open {
    width: 800px;
    z-index:1000000001;
}

p {}

.workflow-window p {
    border-bottom: 1px solid gray;
    padding-top: 10px;
    padding-bottom: 10px;
    padding-left: 20px;
}

.input-collection .object-select {
    padding: 10px 20px;
}

.path-horizontal .checklist {}

.path-horizontal .checklist {
    position: relative;
    margin-left: unset;
    padding-right: 100px;
    height: 66px;
    align-items: start;
}

.checklist.flow-line {
    height: 17px;
    width: 100%;
    top: 20px;
    );
    left: 10px;
    transform: unset;
}

.path-vertical.path-horizontal {
    display: flex;
    flex-direction: row;
    padding-left: 75px;
    !i;!;
    justify-content: center;
    margin-top: -50px;
}

.path-horizontal .checklist h3 {
    position: absolute;
    top: 38px;
    white-space: nowrap;
    left: 15px;
    transform: translate(-50%, 50%);
}

.path-horizontal .flow-bubble {
    top: 0px;
    transform: unset;
}



.path-horizontal .checklist .flow-line {
    height: 17px;
    width: 100%;
    left: 10px;
    transform: unset;
    top: 20px;
}

.account-icon-actual i.fa.fa-poll {
    position: absolute;
    top: -2px;
    right: -9px;
    color: #222222;
}

.mention-candidate .account-icon-actual i.fa-poll {
    right: -16px;
}

.account-icon-actual {
    position: relative;
}

.assignment-tag .account-icon-actual i.fa-poll {
    right: -5px;
}


.modal.review-workflow {
    width: 1110px;
    height: 780px;
}

.tox .tox-sidebar-wrap {
  margin-top: unset !important;
}

#multi-options input {
    background-color: transparent;
    border: unset;
    height: 100%;
    outline: unset;
    box-shadow: unset;
    border-right: 1px solid #d0d0d0;
    border-radius: unset;
    padding-left: unset;
}

#multi-options [contenteditable].option-label {
    outline: unset;
    border-right: 1px solid #b6b6b6;
}

#multi-options [contenteditable].option-label:empty:after {
    content: attr(placeholder);
}

.question .admin-question-header {
    background-color: #f0f0f0;
    padding: 10px 10px;
    align-items: center;
    justify-content: space-between;
}

.create-category #form {
}

.question .admin-question-header .fa.fa-bars {
    cursor: grab;
    padding-left: 10px;
    padding-right: 10px;
}

.question>.question-body h2 {
    margin-left: unset;
}

.question .question-body {
    margin-left: 30px;
}

.question-body sup {
    color: #b22c2c;
    margin-left: 2px;
    position: absolute;
    transform: translate(0px, -2px);
}

.checkbox {
    width: 21px;
    height: 21px;
    background-color: #dcdcdc;
    border-radius: 3px;
    transition: all 100ms;
    position: relative;
	flex-shrink:0;
}

.checkbox:hover {
    background-color: gray;
    cursor: pointer;
}

.question-body .question-line.flex-h {
    align-items: center;
}

.question .question-body .question-label {
    margin-left: 10px;
}

.question-additional-price {
    margin-top: 8px;
    margin-left: 33px;
    font-size: 17px;
    color: #7b7979;
}

.question-body .question-option {
    margin-top: 10px;
}

#form .question, #defaults .question {
    margin-top:25px;
}

.radiobox {
    width: 21px;
    height: 21px;
    background-color: #dcdcdc;
    border-radius: 100%;
    transition: all 100ms;
    position: relative;
    flex-shrink: 0;
}

.radiobox:hover {
    background-color: gray;
    cursor: pointer;
}

.radiobox.selected, .checkbox.selected{
    background-color: #7171ff;
}

.checkbox.selected:after {
    content: "";
    width: 14px;
    height: 14px;
    background-color: #5e42f7;
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    border-radius: 3px;
}

.radiobox.selected:after {
    width: 14px;
    height: 14px;
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    background-color: #5e42f7;
    border-radius: 100%;
}

.question-footer {
    color: #818181;
    margin-top: 20px;
}

.custom-form-section .question-body {
    margin-left: unset;
}

.tag-color-flare {
    width: 36px;
    height: 36px;
    background-color: #353535;
    border: 1px solid gray;
    border-radius: 3px;
    overflow: hidden;
    position: relative;
}

.add-submission-tag .tag-color-flare {
    position: absolute;
    right: 32px;
    top: 111px;
}

.color-a, .color-b {
    width: 50%;
    background-color: gray;
    transform: rotate(45deg);
    top: 0;
    position: absolute;
}

.color-a {
    top: 0;
    left: 0;
    transform: translate(-50%, -50%) rotate(45deg);
    width: 51px;
    height: 51px;
}

.color-b {top: 36px;left: 36px;transform: translate(-50%, -50%) rotate(45deg);width: 51px;height: 51px;}

.tag-color-flare.small {
    width: 22px;
    height: 22px;
    margin-right: 0px;
    left: -9px;
    border: 1px solid #5f40ff;
}

.tag-color-flare.small .color-a {
    width: 31px;
    height: 31px;
}

.tag-color-flare.small .color-b {
    width: 31px;
    height: 35px;
    top: 22px;
    left: 22px;
}

.vote-score {
    width: 40px;
    height: 40px;
    background-color: #2e992e;
    border-radius: 3px;
    font-size: 16px !important;
}

.poll .vote-score {
    margin-right: 25px;
    margin-left: 10px;
}

.messaging-header.filtering {
    padding-bottom: 35px;
}

.filters {
    position: absolute;
    top: 71px;
    left: 17px;
    display: flex;
    flex-direction: row;
}

.chat-side .filters>.filter {
    padding: 5px 10px;
    background-color: #1f1f1f;
    'shape-rendering: geometricprecision';
    color: white;
    border-radius: 4px;
    display: flex;
    align-items: center;
    cursor: pointer;
    transition: all 100ms;
    flex-shrink: 0;
    margin-right: 5px;
}

.filter-name {}

.chat-side .filter>.filter-action {
    margin-left: 10px;
}

.chat-side .filters>.filter:hover {
    background-color: #5a1010;
}

.message-content-block.has-poll.has-system-poll.vote-required {
    background-color: #ffefe2;
}

.messaging-body.filtering {
    height: calc(100% - 115px);
}

.messaging-body:not(.no-draft-box) .message-content-block.filtered-first {
    margin-bottom: calc(170px - 30px);
}

.no-scroll {
  border: 0;
  overflow: hidden;          /* hides scrollbars + prevents scroll */
  scrollbar-width: none;     /* Firefox */
}
.no-scroll::-webkit-scrollbar { display: none; } /* WebKit */

.submission-file .click-target {
    width: 100%;
    height: 80%;
    position: absolute;
    top: 0;
    left: 0;
    cursor: pointer;
}

.question #delete i.fa.fa-cancel {
    margin-right: 5px;
}

.question #delete i.fa.fa-cancel, .question #delete i.fa.fa-plus{
    margin-right: 5px;
}

#form .question.default:not(:first-child), #defaults .question.default:not(:first-child) {
    margin-top: 10px;
}

#form .question.default.open+.question, #defaults .question.default.open+.question {
    margin-top: 25px;
}

.question span.default {
    padding: 5px 10px;
    background-color: #618ae3;
    color: white;
    border-radius: 5px;
    margin-left: 5px;
}

.question.default.disabled {filter: grayscale(1);}

button .notification-circle {
    width: 15px;
    height: 15px;
    position: absolute;
    top: -6px;
    right: -5px;
}

body {
    overscroll-behavior: none;
}

html {
    overscroll-behavior: none;
}

.filter-bar {
    height: 32px;
    width: max-content;
    max-width: 100%;
    margin-bottom: 20px;
    display: flex;
    overflow: hidden;
    overflow-x: scroll;
}

.filter-bar-item {
    border-radius: 6px;
    border: 1px solid #d4d4db;
    display: flex;
    line-height: 36px;
    align-items: center;
    padding: 0px 14px;
    cursor: pointer;
    font-size: 15px;
    transition: all 200ms;
    margin-right: 10px;
    flex-shrink: 0;
    user-select:none;
    background-color: white;
}

.filter-bar-item i {
    margin-right: 10px;
}

.filter-bar-item:hover {
    background-color: #ededed;
}

.filter-bar-item.active {
    background-color: #6767ff;
    color: white;
    border-color: white;
}

.page#tab-content>.page, .page#tab-content {
    overflow: visible;
}


.org-search {
    margin-top: 30px;
}

.assignment-tag.removable:hover {
    z-index: 2;
    box-shadow: 0 0 4px 0 #00000054;
    background-color: #ffeded;
    transform: rotate(-2deg);
}

.assignment-tag .remove {
    position: absolute;
    background-color: #de5454;
    width: 20px;
    height: 20px;
    border-radius: 10px;
    right: -5px;
    top: -9px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: White;
    line-height: 20px;
}

.assignment-tag .remove .fa {
    font-size: 12px;
}

.assignment-tags .assignment-tag:first-child {
    margin-left: 10px;
}

.assignment-tags .assignment-tag.removable {
    cursor: pointer;
    z-index: 4;
}

.assignment-tag.removable:hover {
    z-index: 2;
    box-shadow: 0 0 4px 0 #00000054;
    background-color: #ffeded;
    transform: rotate(-2deg) translate(0px, -2px);
}

.assignment-tag .remove {
    position: absolute;
    background-color: #de5454;
    width: 20px;
    height: 20px;
    border-radius: 10px;
    right: -5px;
    top: -9px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: White;
    line-height: 20px;
    display: none;
}

.assignment-tag .remove .fa {
    font-size: 12px;
}

.assignment-tags .assignment-tag:first-child {
    margin-left: 10px;
}

.assignment-tags .assignment-tag.removable {
    cursor: pointer;
    z-index: 4;
}

.assignment-tag:hover .remove {
    display: flex;
}

.assignment-tag.removable.lift {
    margin-right: -106px;
    background-color: #ffeded;
    transform: rotate(-7deg) translate(0px, -10px);
    filter: opacity(0);
}


.button-bar #range * {
    user-select: none;
    pointer-events: none;
}

.messages-circle {
    text-align: center;
    margin-right: 10px;
    background-color: #0000000d;
    padding: 4px 7px;
    min-width: 13px;
}

.messaging-tabs {
    height: 45px;
    display: flex;
    align-items: center;
    border-bottom: 1px solid #eaeaea;
}

.messaging-tabs .tab {
    padding: 0px 30px;
    height: 100%;
    box-sizing: border-box;
    background-color: #fafafa;
    width: -webkit-fill-available;
    width: -moz-available;
    text-align: center;
    transition: all 200ms;
    cursor: pointer;
    position: relative;
    vertical-align: middle;
    display: flex;
    align-items: center;
    justify-content: center;
}

.messaging-tabs .tab.active {
    background-color: #8686ff;
    color: white;
}

.messaging-tabs .tab:hover:not(.active) {
    background-color: #ebebeb;
    cursor: pointer;
}

.messaging-tabs .tab .notification-circle {
    position: absolute;
    width: 13px;
    height: 13px;
    top: -8px;
    right: -18px;
}

.messaging-tabs .tab:not(:last-child) {
    border-right: 1px solid #eaeaea;
}

.messaging-tabs .tab span {
    position: relative;
    font-size: 15px;
}

.messaging-header.submission-chat {
    padding-bottom: unset;
}

.messaging-body.submission-chat {
    height: calc(100% - 98px);
}

.messaging-body.no-draft-box .message-content-block:first-of-type {
    margin-bottom: 70px;
}

.assignment-tags.submission-tags {
    margin-top: 0px;
    margin-bottom: 0px;
    height: 40px;
}

.notification-circle {}.messaging-header.submission-chat .notification-circle {
    top: 12px;
}

tr.opened td, tr.opened th, #runs-list tr.opened td:last-child {
    background: #d0e0ff !important;
}

tr.opened:nth-child(odd) td, tr.opened:nth-child(odd) th, #runs-list tr:nth-child(odd).opened td:last-child {
    background-color: #b8caff !important;
}

.scroll-to-top {
    position: fixed;
    right: 41px;
    top: 30px;
    width: 60px;
    height: 60px;
    text-align: center;
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: #8282ff;
    color: white;
    font-size: 30px;
    cursor: pointer;
}

.input-collection .object-select {
    height: 17px;
}

.modal.advanced-answer-options {
    width: 615px;
    height: 500px;
}

.file-type-selector {
    width: 60%;
}

.file-type-class {
    background-color: white;
    border: 1px solid #d4d4db;
    padding: 11px 20px;
    border-radius: 5px;
}

.file-type-class>input {
    margin-right: 12px;
}

.file-type-class .file-class-header {
    display: flex;
    justify-content: center;
    font-size: 15px;
    align-items: center;
    color: black;
}

.file-type-class .file-class-header>input {
    margin-right: 12px;
}

.file-class-header .open-file-class, .change-page {
    margin-right: 0px;
    width: 36px;
    height: 36px;
    margin-left: auto;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 4px;
}

.change-page{
	color:White;
	background-color:#8b8bf9;
}

.file-class-header .open-file-class:hover, .change-page:hover {
    background-color: #f1f5f9;
    cursor: pointer;
}

 .change-page:hover {
	color:white;
    background-color: #586be4;
    cursor: pointer;
}

.change-page.disabled{

	color: white !important;
	background-color: #b9b9b9;
	cursor: default !important;
}

.open-file-class i.fa {
    font-size: 15px;
}

.file-class-member {
    display: flex;
    align-items: center;
    font-family: monospace;
    font-size: 14px;
    color: black;
}

.file-class-member {}

.file-class-members {
    padding-top: 7px;
    padding-left: 11px;
    padding-bottom: 10px;
}

.file-class-member input {
    margin-right: 10px;
}

.file-type-class.open .fa-angle-down {
    display: none;
}

.file-type-class.open .fa-angle-up {
    display: block;
}

.file-type-class:not(.open) .open-file-class .fa-angle-up {
    display: none;
}

.file-type-class+.file-type-class {
    margin-top: 4px;
}

.file-type-class:not(.open) .file-class-members {
    max-height: 0px;
    display: none;
    pointer-events: none;
    padding-left: 11px;
    padding-top: 0px;
    padding-bottom: 0px;
}

.file-type-class.open .file-class-members {
    height: revert;
    opacity: 1;
}

div#file-type-call a {
    font-weight: revert;
    margin-left: 2px;
}

.demon-large-item {
    width: 100%;
    max-width: 100%;
    min-height: unset;
    padding-top: 20px;
    padding-bottom: 20px;
}

table.paging i.change-page {
    padding: unset !important;
    display: flex;
    align-items: center;
    justify-content: center;
}