@keyframes elemContextAnim {
  from {
    height: 0px;
  }

  to {
    height: auto;
  }
}

@keyframes fadein {
    from { opacity: 0; }
    to   { opacity: 1; }
}

/* Firefox < 16 */
@-moz-keyframes fadein {
    from { opacity: 0; }
    to   { opacity: 1; }
}

/* Safari, Chrome and Opera > 12.1 */
@-webkit-keyframes fadein {
    from { opacity: 0; }
    to   { opacity: 1; }
}

/* Internet Explorer */
@-ms-keyframes fadein {
    from { opacity: 0; }
    to   { opacity: 1; }
}

/* Opera < 12.1 */
@-o-keyframes fadein {
    from { opacity: 0; }
    to   { opacity: 1; }
}

a {
  text-decoration: underline;
  color: #606273;
  cursor: pointer;
}

a:hover {
  text-decoration: underline;
  color: #606273;
}

body{
  background-color: #f2f2f5;
  /*background-color: rgba(34, 41, 47, 0.1)*/;
  font-family: "Roboto", sans-serif;
  font-size: 14px;
  line-height:19px;
  font-weight:normal;
  color: #363740;
}

h1{
  font-size:24px;
  font-family: "Roboto", sans-serif;
  line-height: 32px;
  font-weight:normal;
}

h2{
  font-size: 20px;
  line-height: 26px;
  font-weight: 600;
  color: #509E2F;
}

h3{
  font-size: 12px;
  line-height: 16px;
}

h4 {
  font-size: 14px;
  line-height: 19px;
  color: #363740;
  font-weight: 600;
}

h5{
  font-size: 18px;
  line-height: 26px;
  font-weight: 600;
  color: #509E2F;
}

input, .form-control {
  background: #F2F2F5;
  height: 48px;
  font-size: 12px
}

label {
  margin-left: 8px;
  font-weight:600;
  font-size: 12px;
  color: #363740;
}

option:disabled {
  color: #D0D3D4;
}

.absolute{
  position: absolute;
}

.absolute-bottom-right{
  position:absolute;
  bottom: 0;
  right: 0;
}

.active-switch-label{
  color: #363740;
  -webkit-transition: all 0.4s ease 0s;
  -moz-transition:   all 0.4s ease 0s;
  -o-transition:      all 0.4s ease 0s;
  -ms-transition:     all 0.4s ease 0s;
  transition:        all 0.4s ease 0s;
}

.admin-bottom-bar{
  background: #fff;
  width: 100vw;
  position: fixed;
  bottom: 0;
  left: 0;
  height: 64px;
  z-index: 2999;
  padding: 8px 24px;
}

.admin-bottom-bar-link-container{
  float: right;
  background: #509E2F !important;
  border-color: transparent !important;
  width: 192px;
}

.add_tag_button{
  max-width: 108px;
  width: 64px;
}

.admin-content-wrapper{
  padding: 0px 16px 72px 16px;
}

.admin-edit-user-back-button{
  margin: 16px 0px;
  float: right;
}

.admin-nav-wrapper{
  margin-top:64px;
}

.admin-nav-wrapper > .nav > .nav-item {
  padding: 12px 10px 11px 10px;
}

.admin-nav-wrapper > .nav > .nav-item > .nav-link:hover, .temp-var-container > .nav > .nav-link:hover{
  border-color: transparent transparent #9FA4AD;
}

.admin-nav-wrapper > .nav > .nav-item > .nav-link, .temp-var-container > .nav > .nav-link {
  border-width: 2px;
  color: #9FA4AD;
}

.admin-nav-wrapper > .nav > .nav-item > .active.nav-link, .temp-var-container > .nav > .active.nav-link {
  border-color: transparent transparent #363740;
  background: transparent;
  color: #363740;
}

.assign-image-container {
  max-height: 248px;
  overflow-y: hidden;
  zoom: 0.1;
  cursor: zoom-in;
}

.assignment_mini_preview {
  height: 360px;
}

.auth-wrapper {
  max-width: 100%;
  width: 100%;
  height: 100vh;
}

.badge-light {
  background-color: transparent;
  border: 1px #D0D3D4 solid;
  border-radius: 16px;
  padding: 4px 16px;
  color: #9FA4AD;
  margin: 4px;
  cursor: default;
  -webkit-transition: all 0.4s ease 0s;
  -moz-transition:   all 0.4s ease 0s;
  -o-transition:      all 0.4s ease 0s;
  -ms-transition:     all 0.4s ease 0s;
  transition:        all 0.4s ease 0s;
}

.badge-light:hover{
  color: #509E2F;
  border-color: #509E2F;
  -webkit-transition: all 0.4s ease 0s;
  -moz-transition:   all 0.4s ease 0s;
  -o-transition:      all 0.4s ease 0s;
  -ms-transition:     all 0.4s ease 0s;
  transition:        all 0.4s ease 0s;
}

.bottom-right-button-position{
  position:absolute;
  right: 16px;
  bottom:16px;
}

.btn{
  min-height: 40px;
  height: 48px;
  padding-left: 16px;
  padding-right:16px;
}

.btn-light {
  background: #F2F2F5;
  border-radius: 5px;
  color: #363740;
}

.btn-success{
  background: #fd4415;
  opacity: 1;
  -webkit-transition: opacity 0.4s ease 0s;
  -moz-transition:   opacity 0.4s ease 0s;
  -o-transition:      opacity 0.4s ease 0s;
  -ms-transition:     opacity 0.4s ease 0s;
  transition:        opacity 0.4s ease 0s;
}

.btn-success:hover{
  background: #fd4415;
  opacity: 0.8;
  -webkit-transition: opacity 0.4s ease 0s;
  -moz-transition:   opacity 0.4s ease 0s;
  -o-transition:      opacity 0.4s ease 0s;
  -ms-transition:     opacity 0.4s ease 0s;
  transition:        opacity 0.4s ease 0s;
}

.btn-success:disabled{
  background: #fd4415;
  opacity: 0.6;
  -webkit-transition: opacity 0.4s ease 0s;
  -moz-transition:   opacity 0.4s ease 0s;
  -o-transition:      opacity 0.4s ease 0s;
  -ms-transition:     opacity 0.4s ease 0s;
  transition:        opacity 0.4s ease 0s;
}

.btn-success:focus, .btn-success:active,.btn-success:not(:disabled):not(.disabled):active{
  background: transparent;
  -webkit-transition: all 0.4s ease 0s;
  -moz-transition:   all 0.4s ease 0s;
  -o-transition:      all 0.4s ease 0s;
  -ms-transition:     all 0.4s ease 0s;
  transition:        all 0.4s ease 0s;
}

.btn-secondary{
  background: transparent;
  border-color: #509e2f !important;
  color: #509E2F !important;
  -webkit-transition: all 0.4s ease 0s;
  -moz-transition:   all 0.4s ease 0s;
  -o-transition:      all 0.4s ease 0s;
  -ms-transition:     all 0.4s ease 0s;
  transition:        all 0.4s ease 0s;
}

.btn-secondary:hover, .btn-primary:hover, .btn-info:hover{
  background: #509e2f;
  border-color: #509e2f;
  color: #fff !important;
  -webkit-transition: all 0.4s ease 0s;
  -moz-transition:   all 0.4s ease 0s;
  -o-transition:      all 0.4s ease 0s;
  -ms-transition:     all 0.4s ease 0s;
  transition:        all 0.4s ease 0s;
}

.btn-secondary:focus, .btn-secondary:active, .btn-secondary:not(:disabled):not(.disabled):active,
.btn-primary:focus, .btn-primary:active,.btn-primary:not(:disabled):not(.disabled):active,
.btn-info:focus, .btn-info:active,.btn-info:not(:disabled):not(.disabled):active {
  background: #d6f7ff;
  border-color:  #509e2f !important;
  color: #509E2F !important;
  box-shadow: none;
  -webkit-transition: all 0.4s ease 0s;
  -moz-transition:   all 0.4s ease 0s;
  -o-transition:      all 0.4s ease 0s;
  -ms-transition:     all 0.4s ease 0s;
  transition:        all 0.4s ease 0s;
}

.btn-info {
  background: #d6f7ff;
  border-color: transparent !important;
  color: #509E2F !important;
  -webkit-transition: all 0.4s ease 0s;
  -moz-transition:   all 0.4s ease 0s;
  -o-transition:      all 0.4s ease 0s;
  -ms-transition:     all 0.4s ease 0s;
  transition:        all 0.4s ease 0s;
}

.btn-danger{
  background: #000;
  opacity: 1;
  -webkit-transition: opacity 0.4s ease 0s;
  -moz-transition:   opacity 0.4s ease 0s;
  -o-transition:      opacity 0.4s ease 0s;
  -ms-transition:     opacity 0.4s ease 0s;
  transition:        opacity 0.4s ease 0s;
}

.btn-danger:hover{
  background: #000;
  opacity: 0.8;
  -webkit-transition: opacity 0.4s ease 0s;
  -moz-transition:   opacity 0.4s ease 0s;
  -o-transition:      opacity 0.4s ease 0s;
  -ms-transition:     opacity 0.4s ease 0s;
  transition:        opacity 0.4s ease 0s;
}

.btn-danger:disabled{
  background: #000;
  opacity: 0.6;
  -webkit-transition: opacity 0.4s ease 0s;
  -moz-transition:   opacity 0.4s ease 0s;
  -o-transition:      opacity 0.4s ease 0s;
  -ms-transition:     opacity 0.4s ease 0s;
  transition:        opacity 0.4s ease 0s;
}

.btn-danger:focus, .btn-danger:active,.btn-danger:not(:disabled):not(.disabled):active{
  background: #000;
  opacity: 1;
  -webkit-transition: opacity 0.4s ease 0s;
  -moz-transition:   opacity 0.4s ease 0s;
  -o-transition:      opacity 0.4s ease 0s;
  -ms-transition:     opacity 0.4s ease 0s;
  transition:        opacity 0.4s ease 0s;
}

.btn-primary, .btn-primary:not(:disabled):not(.disabled).active{
  background: #509E2F;
  border-color: transparent;
  -webkit-transition: all 0.4s ease 0s;
  -moz-transition:   all 0.4s ease 0s;
  -o-transition:      all 0.4s ease 0s;
  -ms-transition:     all 0.4s ease 0s;
  transition:        all 0.4s ease 0s;
}

.btn-primary:disabled, .btn-secondary:disabled, .btn-info:disabled{
  background: transparent;
  border-color: #9fa4ad !important;
  color: #9fa4ad !important;
  -webkit-transition: all 0.4s ease 0s;
  -moz-transition:   all 0.4s ease 0s;
  -o-transition:      all 0.4s ease 0s;
  -ms-transition:     all 0.4s ease 0s;
  transition:        all 0.4s ease 0s;
}

.campaign-email-grid-item{
  width: 152px;
  height: 240px;
  background: #fff;
  cursor: pointer;
  border-radius: 5px;
  box-shadow: 0px 0px 5px #00000026;
  margin-left: 12px;
  margin-right: 12px;
  margin-bottom: 8px;
  margin-top: 8px;
}

.campaign-menu > div > ul{
  background: #EBECF2;
  padding: 0;
}

.campaign-menu > div > ul > li {
  background: #CDD2E0;
  width: 120px;
  height: 40px;
  margin-bottom: 0.5px;
  margin-top: 0.5px;
}

.campaign_preview_modal > div > div, .accept-terms-modal > div > div {
  top: 40px;
  max-height: calc(100vh - 80px) !important;
}

.canvas-connector-node{
  -webkit-transition: opacity 0.4s ease 0s;
  -moz-transition:   opacity 0.4s ease 0s;
  -o-transition:      opacity 0.4s ease 0s;
  -ms-transition:     opacity 0.4s ease 0s;
  transition:        opacity 0.4s ease 0s;
  z-index:1000;
}

.canvas-svg-scrollbox{
  min-height: calc(100vh - 216px);
  width: calc(100vw / 6 * 4);
  overflow:auto;
  min-width: 100%;
}

.clear-both{
  clear:both;
}

.coming-soon-box{
  width:240px;
  height:240px;
  padding:31px 31px;
  margin:15px;
}

.completely-hidden{
  max-height: 0px;
  max-width: 0px;
  z-index: -500;
  position: absolute;
  top: 0px;
  left: 0px;
  opacity: 0;
}

.comm-tab-content {
  padding: 32px 0px;
}

.communication-grid-item {
  background:white;
  border-radius: 5px;
  position:relative;
  overflow-x: hidden;
  overflow-y: hidden;
  cursor: pointer;
  height: 176px;
  width: 144px;
  margin: 8px;
  box-shadow: 0px 0px 5px #00000026;
  -webkit-transition: all 0.4s ease 0s;
  -moz-transition:   all 0.4s ease 0s;
  -o-transition:      all 0.4s ease 0s;
  -ms-transition:     all 0.4s ease 0s;
  transition:        all 0.4s ease 0s;
}

.communication-grid-item.selected{
  background:#509e2f;
  color: #fff;
  border-radius: 5px;
  position:relative;
  overflow-x: hidden;
  overflow-y: hidden;
  height: 176px;
  width: 144px;
  box-shadow: 0px 0px 5px #00000026;
  -webkit-transition: all 0.4s ease 0s;
  -moz-transition:   all 0.4s ease 0s;
  -o-transition:      all 0.4s ease 0s;
  -ms-transition:     all 0.4s ease 0s;
  transition:        all 0.4s ease 0s;
}

.pos-grid-item {
  background:white;
  border-radius: 5px;
  position:relative;
  overflow-x: hidden;
  overflow-y: hidden;
  cursor: pointer;
  height: 400px;
  width: 300px;
  margin: 8px;
  box-shadow: 0px 0px 5px #00000026;
  -webkit-transition: all 0.4s ease 0s;
  -moz-transition:   all 0.4s ease 0s;
  -o-transition:      all 0.4s ease 0s;
  -ms-transition:     all 0.4s ease 0s;
  transition:        all 0.4s ease 0s;
}

.pos-grid-item-withoutPreview {
  background:white;
  border-radius: 5px;
  position:relative;
  overflow-x: hidden;
  overflow-y: hidden;
  cursor: pointer;
  height: 100px;
  width: 300px;
  margin: 8px;
  box-shadow: 0px 0px 5px #00000026;
  -webkit-transition: all 0.4s ease 0s;
  -moz-transition:   all 0.4s ease 0s;
  -o-transition:      all 0.4s ease 0s;
  -ms-transition:     all 0.4s ease 0s;
  transition:        all 0.4s ease 0s;
}

.pos-grid-item.selected{
  background:#509e2f;
  color: #fff;
  border-radius: 5px;
  position:relative;
  overflow-x: hidden;
  overflow-y: hidden;
  height: 400px;
  width: 300px;
  box-shadow: 0px 0px 5px #00000026;
  -webkit-transition: all 0.4s ease 0s;
  -moz-transition:   all 0.4s ease 0s;
  -o-transition:      all 0.4s ease 0s;
  -ms-transition:     all 0.4s ease 0s;
  transition:        all 0.4s ease 0s;
}


.pt-grid-item {
  background:white;
  border-radius: 5px;
  position:relative;
  overflow-x: hidden;
  overflow-y: hidden;
  cursor: pointer;
  height: 400px;
  width: 300px;
  margin: 8px;
  box-shadow: 0px 0px 5px #00000026;
  -webkit-transition: all 0.4s ease 0s;
  -moz-transition:   all 0.4s ease 0s;
  -o-transition:      all 0.4s ease 0s;
  -ms-transition:     all 0.4s ease 0s;
  transition:        all 0.4s ease 0s;
}

.pt-grid-item.selected{
  background:#509e2f;
  color: #fff;
  border-radius: 5px;
  position:relative;
  overflow-x: hidden;
  overflow-y: hidden;
  height: 400px;
  width: 300px;
  box-shadow: 0px 0px 5px #00000026;
  -webkit-transition: all 0.4s ease 0s;
  -moz-transition:   all 0.4s ease 0s;
  -o-transition:      all 0.4s ease 0s;
  -ms-transition:     all 0.4s ease 0s;
  transition:        all 0.4s ease 0s;
}


.pos-grid-item-master {
  background:white;
  border-radius: 5px;
  position:relative;
  overflow-x: hidden;
  overflow-y: hidden;
  cursor: pointer;
  height: 419px;
  width: 300px;
  margin: 8px;
  box-shadow: 0px 0px 5px #00000026;
  -webkit-transition: all 0.4s ease 0s;
  -moz-transition:   all 0.4s ease 0s;
  -o-transition:      all 0.4s ease 0s;
  -ms-transition:     all 0.4s ease 0s;
  transition:        all 0.4s ease 0s;
}

.cursor-pointer {
  cursor: pointer;
}

.cursor-default {
  cursor: default;
}

.custom-file{
  margin-left: -8px;
  width: calc(100% + 8px);
}

.custom-paginate > .btn-primary:focus{
  background: #509E2F;
  color: #fff !important;
}

.custom-paginate{
  display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -webkit-flex-direction: row;
    -ms-flex-direction: row;
    flex-direction: row;
    -webkit-flex-wrap: nowrap;
    -ms-flex-wrap: nowrap;
    flex-wrap: nowrap;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-align-content: center;
    -ms-flex-line-pack: center;
    align-content: center;
    -webkit-align-items: flex-start;
    -ms-flex-align: start;
    align-items: flex-start;
}

.dashboard-grid {
    margin-top: 108px;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -webkit-flex-direction: row;
    -ms-flex-direction: row;
    flex-direction: row;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-align-content: stretch;
    -ms-flex-line-pack: stretch;
    align-content: stretch;
    -webkit-align-items: flex-start;
    -ms-flex-align: start;
    align-items: flex-start;
}

.dashboard-grid-item{
  cursor:pointer;
  background: #fff;
  color: white;
  border: #509E2F;
  margin:15px;
  width: 240px;
  height: 240px;
  padding-left: 26px;
  padding-right: 26px;
  padding-top: 26px;
  padding-bottom: 0;
  border-radius: 5px;
  overflow: hidden;
  -webkit-transition: all 0.4s ease 0s;
  -moz-transition:   all 0.4s ease 0s;
  -o-transition:      all 0.4s ease 0s;
  -ms-transition:     all 0.4s ease 0s;
  transition:        all 0.4s ease 0s;
}

.dashboard-grid-item.disabled{
  cursor:default;
}

.dashboard-grid-item.disabled:hover{
  box-shadow: none;
}

.dashboard-grid-item:hover{
  box-shadow: #509E2F33 0px 0px 15px;
  -webkit-transition: all 0.4s ease 0s;
  -moz-transition:   all 0.4s ease 0s;
  -o-transition:      all 0.4s ease 0s;
  -ms-transition:     all 0.4s ease 0s;
  transition:        all 0.4s ease 0s;
}

.dashboard-grid-item > div > .dashboard-icon-circle {
  height: 48px;
  width: 48px;
  border-radius: 100%;
  background: #f2f2f5;
  color: #509E2F;
  -webkit-transition: all 0.4s ease 0s;
  -moz-transition:   all 0.4s ease 0s;
  -o-transition:      all 0.4s ease 0s;
  -ms-transition:     all 0.4s ease 0s;
  transition:        all 0.4s ease 0s;
}

.dashboard-grid-item.disabled > div > .dashboard-icon-circle {
  height: 48px;
  width: 48px;
  border-radius: 100%;
  background: #F2F2F5;
  color: #9FA4AD;
  -webkit-transition: all 0.4s ease 0s;
  -moz-transition:   all 0.4s ease 0s;
  -o-transition:      all 0.4s ease 0s;
  -ms-transition:     all 0.4s ease 0s;
  transition:        all 0.4s ease 0s;
}

.dashboard-grid-item.disabled > h5{
  color: #9FA4AD;
}

.dashboard-grid-item.disabled > .grey-heading{
  color: #D0D3D4;
}

.dashboard-grid-item > div > .dashboard-icon-circle > svg {
  margin-top: 9px;
    margin-left: 1px;
}

.dashboard-grid-item:hover > div > .dashboard-icon-circle{
  color: #509e2f;
  -webkit-transition: all 0.4s ease 0s;
  -moz-transition:   all 0.4s ease 0s;
  -o-transition:      all 0.4s ease 0s;
  -ms-transition:     all 0.4s ease 0s;
  transition:        all 0.4s ease 0s;
}

.dashboard-grid-item.disabled:hover > div > .dashboard-icon-circle{
  color: #9FA4AD;
}

.dashboard-grid-item > .dashboard-grid-item-image-contain{
  height: 150px;
  text-align:center;
  background: white;
}

.dashboard-grid-item > .dashboard-grid-item-image-contain > img {
  height: 100%;
  padding: 5%;
  -webkit-transition: all 1s ease-out 0.3s;
  -moz-transition:   all 1s ease-out 0.3s;
  -o-transition:      all 1s ease-out 0.3s;
  -ms-transition:     all 1s ease-out 0.3s;
  transition:        all 1s ease-out 0.3s;
}

.dashboard-grid-item:hover > .dashboard-grid-item-image-contain > img {
  padding: 0;
}

.dashboard-grid-item-desc{
  height: 125px;
  overflow: hidden;
}

.dashboard-grid-item-title{
  -webkit-transition: all 1s ease-out 0.3s;
  -moz-transition:   all 1s ease-out 0.3s;
  -o-transition:      all 1s ease-out 0.3s;
  -ms-transition:     all 1s ease-out 0.3s;
  transition:        all 1s ease-out 0.3s;
}

.dashboard-grid-item:hover > .dashboard-grid-item-title, .dashboard-grid-item-bottom-text{
  color: #fd4415;
}

.dashboard-grid-item-footer{
  background:#fff; margin:0; border: 0; padding: 0;
}

.data-grid-item {
  background:white;
  padding: 8px 16px;
  margin: 8px;
  cursor: pointer;
  border-radius: 5px;
  position:relative;
  overflow-x: hidden;
  overflow-y: hidden;
  height: 112px;
  width: 112px;
  box-shadow: 0px 0px 5px #00000026;
  -webkit-transition: all 0.4s ease 0s;
  -moz-transition:   all 0.4s ease 0s;
  -o-transition:      all 0.4s ease 0s;
  -ms-transition:     all 0.4s ease 0s;
  transition:        all 0.4s ease 0s;
}

.data-grid-item > p {
  color: #363740;
  -webkit-transition: all 0.4s ease 0s;
  -moz-transition:   all 0.4s ease 0s;
  -o-transition:      all 0.4s ease 0s;
  -ms-transition:     all 0.4s ease 0s;
  transition:        all 0.4s ease 0s;
}

.data-grid-item:hover > p {
  color: #509e2f;
  -webkit-transition: all 0.4s ease 0s;
  -moz-transition:   all 0.4s ease 0s;
  -o-transition:      all 0.4s ease 0s;
  -ms-transition:     all 0.4s ease 0s;
  transition:        all 0.4s ease 0s;
}

.data-grid-item.not-valid {
  background:#FFE3E3;
  padding: 8px 16px;
  margin: 8px;
  cursor: pointer;
  border-radius: 5px;
  position:relative;
  overflow-x: hidden;
  overflow-y: hidden;
  height: 112px;
  width: 112px;
  box-shadow: 0px 0px 5px #00000026;
  -webkit-transition: all 0.4s ease 0s;
  -moz-transition:   all 0.4s ease 0s;
  -o-transition:      all 0.4s ease 0s;
  -ms-transition:     all 0.4s ease 0s;
  transition:        all 0.4s ease 0s;
}

.data-grid-item.not-valid > p {
  color: #363740;
  -webkit-transition: all 0.4s ease 0s;
  -moz-transition:   all 0.4s ease 0s;
  -o-transition:      all 0.4s ease 0s;
  -ms-transition:     all 0.4s ease 0s;
  transition:        all 0.4s ease 0s;
}

.data-grid-item:hover.not-valid > p {
  color: #363740;
  -webkit-transition: all 0.4s ease 0s;
  -moz-transition:   all 0.4s ease 0s;
  -o-transition:      all 0.4s ease 0s;
  -ms-transition:     all 0.4s ease 0s;
  transition:        all 0.4s ease 0s;
}

.data-grid-item.selected{
  background: #509e2f;
  padding: 8px 16px;
  border-radius: 5px;
  position:relative;
  overflow-x: hidden;
  overflow-y: hidden;
  height: 112px;
  width: 112px;
  -webkit-transition: all 0.4s ease 0s;
  -moz-transition:   all 0.4s ease 0s;
  -o-transition:      all 0.4s ease 0s;
  -ms-transition:     all 0.4s ease 0s;
  transition:        all 0.4s ease 0s;
}

.data-grid-item.selected > p{
  color: #fff;
  -webkit-transition: all 0.4s ease 0s;
  -moz-transition:   all 0.4s ease 0s;
  -o-transition:      all 0.4s ease 0s;
  -ms-transition:     all 0.4s ease 0s;
  transition:        all 0.4s ease 0s;
}

.data-grid-item.selected:hover > p{
  color: #fff;
  -webkit-transition: all 0.4s ease 0s;
  -moz-transition:   all 0.4s ease 0s;
  -o-transition:      all 0.4s ease 0s;
  -ms-transition:     all 0.4s ease 0s;
  transition:        all 0.4s ease 0s;
}

.data-grid-item > div > .grid-icon-circle {
  height: 32px;
  width: 32px;
  border-radius: 100%;
  background: #509E2F;
  color: #fff;
  -webkit-transition: all 0.4s ease 0s;
  -moz-transition:   all 0.4s ease 0s;
  -o-transition:      all 0.4s ease 0s;
  -ms-transition:     all 0.4s ease 0s;
  transition:        all 0.4s ease 0s;
}

.data-grid-item.selected > div > .grid-icon-circle {
  height: 32px;
  width: 32px;
  border-radius: 100%;
  color: #509e2f;
  background: #fff;
  -webkit-transition: all 0.4s ease 0s;
  -moz-transition:   all 0.4s ease 0s;
  -o-transition:      all 0.4s ease 0s;
  -ms-transition:     all 0.4s ease 0s;
  transition:        all 0.4s ease 0s;
}

.data-grid-item.not-valid > div > .grid-icon-circle {
  height: 32px;
  width: 32px;
  border-radius: 100%;
  color: #fff;
  background: #CC2222;
  -webkit-transition: all 0.4s ease 0s;
  -moz-transition:   all 0.4s ease 0s;
  -o-transition:      all 0.4s ease 0s;
  -ms-transition:     all 0.4s ease 0s;
  transition:        all 0.4s ease 0s;
}

.data-grid-item.not-valid:hover > div > .grid-icon-circle {
  height: 32px;
  width: 32px;
  border-radius: 100%;
  color: #363740;
  background: #E7E6E5;
  -webkit-transition: all 0.4s ease 0s;
  -moz-transition:   all 0.4s ease 0s;
  -o-transition:      all 0.4s ease 0s;
  -ms-transition:     all 0.4s ease 0s;
  transition:        all 0.4s ease 0s;
}

.data-grid-item.selected:hover > div > .grid-icon-circle {
  height: 32px;
  width: 32px;
  border-radius: 100%;
  color: #509e2f;
  background: #fff;
  -webkit-transition: all 0.4s ease 0s;
  -moz-transition:   all 0.4s ease 0s;
  -o-transition:      all 0.4s ease 0s;
  -ms-transition:     all 0.4s ease 0s;
  transition:        all 0.4s ease 0s;
}

.data-grid-item:hover > div > .grid-icon-circle {
  background: #509e2f;
  -webkit-transition: all 0.4s ease 0s;
  -moz-transition:   all 0.4s ease 0s;
  -o-transition:      all 0.4s ease 0s;
  -ms-transition:     all 0.4s ease 0s;
  transition:        all 0.4s ease 0s;
}

.data-grid-item > div > .grid-icon-circle > svg {
  margin-top: 6.5px;
  margin-left: 7.5px;
}

.data-grid-item:hover, .communication-grid-item:hover, .campaign-email-grid-item:hover{
  box-shadow: #509E2F33 0px 0px 15px !important;
  -webkit-transition: all 0.4s ease 0s;
  -moz-transition:   all 0.4s ease 0s;
  -o-transition:      all 0.4s ease 0s;
  -ms-transition:     all 0.4s ease 0s;
  transition:        all 0.4s ease 0s;
}

.dataPullWizardTextSize{
	font-size: 20px;
}


.dataPullWizardContentStep1{
	width: 250px;
  margin: auto;
}

.dataPullWizardContentStep1 input.text{
	text-align: center;
}

.dataPullWizardErrorContent{
	color: #CC2222;
}

.dataTables_paginate > ul > li > a {
    text-decoration: none;
}

.dmFileUploadPic{
  width: 40px;
  margin-left:auto;
  margin-right: auto;
}

.dmFileUploadPicSelected{
  width: 40px;
  margin-left:auto;
  margin-right: auto;
}

.documentBody-wrapper {
  min-height: calc(100vh - 48px);
}

.draggable {
  cursor: move;
}

.emailManagerSidebar-wrapper, .emailManagerSidebar-wrapper, .emailManagerSidebar-wrapper{
  background: #d0d3d4;
  margin-left: -15px;
  margin-top: -15px;
  padding-top: 15px;
  height: calc(30px + 100%);
}

.emailManagerSidebar-wrapper > .nav-pills > .nav-item > a, .emailManagerSidebar-wrapper > .nav-pills > .nav-item > a, .emailManagerSidebar-wrapper > .nav-pills > .nav-item > a {
  color: #214b6c;
  background: rgb(255,255,255,0.3);
  border-radius: 0px;
  margin-top: 4px;
  text-decoration:none;
}


.errormessage {
  font-size: 9px;
  color: #CC2222;
}

.flex-grid-centered{
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  -webkit-flex-direction: row;
  -ms-flex-direction: row;
  flex-direction: row;
  -webkit-flex-wrap: wrap;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-align-content: stretch;
  -ms-flex-line-pack: stretch;
  align-content: stretch;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
}

.flex-grid-start{
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  -webkit-flex-direction: row;
  -ms-flex-direction: row;
  flex-direction: row;
  -webkit-flex-wrap: wrap;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-align-content: stretch;
  -ms-flex-line-pack: stretch;
  align-content: stretch;
  -webkit-align-items: flex-start;
  -ms-flex-align: start;
  align-items: flex-start;
}

.float-left{
  float:left;
}

.float-right{
  float: right;
}

.font-size-12{
  font-size: 12px;
}

.form-check > input {
  margin-top: -16px;
}

.gdpr-policy-builder-top-div{
  display: inline-flex;
  width: 100%;
}

.gdpr-policy-builder-top-div > button {
  min-width: 170px;
}

.gjs-pn-views-container{
  width: 23% !important;
}

.gjs-pn-options{
  right: 23% !important;
}

.gjs-pn-views{
  width: 23% !important;
}

.gjs{
  overflow-x: auto;
}

.gjs-blocks-c, .gjs-blocks-c > .gjs-block , .gjs-block-category, .gjs-one-bg .gjs-clm-tags, .gjs-sm-sector{
  background-color: #606273 !important;
  color: #D0D3D4 !important;
  box-shadow: 0px 0px 6px #00000029 !important;
  border-color: transparent !important;
}

#gjs-clm-tags-field, .gjs-field{
  background: #363740 !important;
}

.gjs-clm-tag{
  background: #509e2f !important;
  color: #fff !important;
}

.gjs-pn-views-container, .gjs-one-bg {
  background: #F5F5F5 !important;
}

.gjs-two-color{
  color: #9FA4AD !important;
  -webkit-transition: color 0.4s ease 0s;
  -moz-transition:   color 0.4s ease 0s;
  -o-transition:      color 0.4s ease 0s;
  -ms-transition:     color 0.4s ease 0s;
  transition:        color 0.4s ease 0s;
}

.gjs-four-color-h:hover {
  color: #a1cbef !important;
  -webkit-transition: color 0.4s ease 0s;
  -moz-transition:   color 0.4s ease 0s;
  -o-transition:      color 0.4s ease 0s;
  -ms-transition:     color 0.4s ease 0s;
  transition:        color 0.4s ease 0s;
}

.gjs-four-color{
  color: #509e2f !important;
  -webkit-transition: color 0.4s ease 0s;
  -moz-transition:   color 0.4s ease 0s;
  -o-transition:      color 0.4s ease 0s;
  -ms-transition:     color 0.4s ease 0s;
  transition:        color 0.4s ease 0s;
}

.grid{
  display: grid;
}

.grid-1{
  display: grid;
  width: 100%;
  grid-template-columns: 1fr;
  text-align: center;
}

.grid-1-3{
  display: grid;
  width: 100%;
  grid-template-columns: 1fr 3fr;
  grid-gap: 8px;
}

.grid-1-318{
  display: grid;
  /*grid-template-columns: 1fr 318px;*/
  grid-template-columns: 1fr 350px;
  grid-gap:24px;
}

.grid-1-no-gap {
  display: grid;
  width: 100%;
  grid-template-columns: 1fr;
}

.grid-2-no-gap {
  display: grid;
  width: 100%;
  grid-template-columns: 1fr 1fr;
}

.grid-2 {
  display: grid;
  width: 100%;
  grid-template-columns: 1fr 1fr;
  grid-gap: 16px;
}

.grid-2-8gap{
  display: grid;
  width: 100%;
  grid-template-columns: 1fr 1fr;
  grid-gap: 0px 8px;
}

.grid-2-no-gap{
  display: grid;
  width: 100%;
  grid-template-columns: 1fr 1fr;
  grid-gap: 0px;
}

.grid-3 {
  display: grid;
  width: 100%;
  grid-template-columns: 1fr 1fr 1fr;
  grid-gap: 16px;
}

.grid-3-ptpdfmodal {
  display: grid;
  width: 100%;
  grid-template-columns: 1fr 0.4fr 0.9fr;
  grid-gap: 16px;
}


.grid-3-8gap{
  display: grid;
  width: 100%;
  grid-template-columns: 1fr 1fr 1fr;
  grid-gap: 0px 8px;
}

.grid-4 {
  display: grid;
  width: 100%;
  grid-template-columns: 1fr 1fr 1fr 1fr;
  grid-gap: 16px;
}

.grid-4-no-gap{
  display: grid;
  width: 100%;
  grid-template-columns: 1fr 1fr 1fr 1fr;
  grid-gap: 0px;
}

.grid-5 {
  display: grid;
  width: 100%;
  grid-template-columns: 1fr 1fr 1fr 1fr 1fr;
  grid-gap: 16px;
}

.grid-6 {
  display: grid;
  width: 100%;
  grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr;
  grid-gap: 16px;
  padding-bottom: inherit;
}

.grid-7 {
  display: grid;
  width: 100%;
  grid-template-columns: 0.5fr 1fr;
  grid-gap: 0px;
}

.grid-item-image {
  height: 112px;
}

.grid-pagination-bar {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr 1fr;
  width: 100%;
  text-align:center;
}

.green-validation{
   color: #4DAC50;
}

.grey-heading{
  color: #9FA4AD;
}

.header-wrapper {
  background: #ffffff;
  color: #444;
  height: 48px;
  left: 0;
  top: 0;
  position:fixed;
  width: 100vw;
  z-index: 5000;
}

.icon-in-field{
  margin-top: -29px !important;
}

.image_selector_parent > img {
  max-width: 100px;
  width: 100px;
  cursor:pointer;
  border: 2px silver solid;
  -webkit-transition: all 0.4s ease 0s;
  -moz-transition:   all 0.4s ease 0s;
  -o-transition:      all 0.4s ease 0s;
  -ms-transition:     all 0.4s ease 0s;
  transition:        all 0.4s ease 0s;
}

.image_selector_parent > img:hover {
  border: 2px #3490dc solid;
  -webkit-transition: all 0.4s ease 0s;
  -moz-transition:   all 0.4s ease 0s;
  -o-transition:      all 0.4s ease 0s;
  -ms-transition:     all 0.4s ease 0s;
  transition:        all 0.4s ease 0s;
}

.inline-flex {
  display:inline-flex;
}

.inline-flex-100{
  display: inline-flex;
  width: 100%;
}

.large-svg-message-container{
  width: 168px;
  height: 168px;
  padding: 38px;
  border-radius: 100%;
  background: #F2F2F5;
  margin-left: calc(50% - 84px);
}

.large-user-preview-image-container{
  width: 100%;
  text-align:center;
  padding: 15px;
}

.large-user-preview-image{
  width: 10%;
  height: 10%;
  min-height:152px;
  min-width: 152px;
  margin-left:auto;
  margin-right: auto;
  border-radius: 100%;
}

.lightbluetext{
  color: #509e2f;
}

.live_draft_label{
  text-align:center;
  color: #fff;
}

.live_draft_switch{
  margin-top: 3px;
}



.login-form-padded{
  width: 288px;
}

.login-left-pane{
  padding: 40% 0;
  /*background: url('/img/Image@2x.png');*/
  background: url('/img/login-background.jpg');
  background-size: cover;
  background-repeat: no-repeat;
  background-color: #509E2F;
  background-position: 50%;
  height: 100vh;
}

.login-right-pane{
  position: relative;
  height: 100vh;
  background: #fff
}

.login-wrapper {
  background-color: #ffffff;
  border-color: transparent #dee2e6 #f8fafc;
  border-bottom-left-radius: 0.25rem;
  border-bottom-right-radius: 0.25rem;
  position: absolute;
  width: 100%;
  top: 50%;
  -ms-transform: translateY(-50%);
  transform: translateY(-50%);
  margin-bottom: 0;
  padding-left: calc(50% - 144px);
  padding-right: calc(50% - 144px);
}

.main-area-internal-padding {
  display: grid;
  grid-template-columns: 1fr;
  height: 100%;
  padding-right: 8px;
  padding-left: 8px;
  padding-top: 16px;
}

.mainLogo {
  margin-left: auto;
  margin-right: auto;
  display: block;
  height: 100%;
}

.mainLogoWrapper {
  height: 32px;
  width: 144px;
  position:absolute;
  left: 24px;
  top: 8px;
}

.mainPane-wrapper {
  padding: 16px;
  margin-top: 48px;
  -webkit-transition: all 0.4s ease 0s;
  -moz-transition:   all 0.4s ease 0s;
  -o-transition:      all 0.4s ease 0s;
  -ms-transition:     all 0.4s ease 0s;
  transition:        all 0.4s ease 0s;
  /*border: 1px solid rgba( 0, 0, 0, 0.125);*/
}

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

.MuiBreadcrumbs-li{
  font-size: 12px;
  color: #606273;
}

.MuiBreadcrumbs-ol{
  margin-top: -23px !important;
  margin-left: -24px !important;
}

.my-campaigns-status{
  height: 24px;
  width: 112px;
  border-radius: 16px;
  line-height: 16px;
  padding-top: 3.5px;
}

.optional-text{
  color: #B6B9BA;
}

.nav-link, .dropdown-item{
  padding: 0.5rem 1.3rem;
  text-decoration: none;
}

.nav-pills .nav-link.active{
  background-color: transparent !important;
  border-radius: 0;
  text-decoration:none;
}

.nav-tabs .nav-link.active{
  background:#606273;
  color: white;
}

.no-scroll-canvas{
  touch-action: none;
  width: 100%;
  height: 100%;
}

.no-sidebar-document-contain{
  min-height: calc(100vh - 48px);
  padding: 24px 64px;
  margin-top: 48px;
}

.no-wrap{
  white-space: nowrap;
}

.notifications-wrapper {
  position: fixed;
  bottom: 0;
  right: 0;
  width: 350px;
  background: transparent;
}

.non-active-switch-label{
  color: #9FA4AD;
  -webkit-transition: all 0.4s ease 0s;
  -moz-transition:   all 0.4s ease 0s;
  -o-transition:      all 0.4s ease 0s;
  -ms-transition:     all 0.4s ease 0s;
  transition:        all 0.4s ease 0s;
}

.page-item.active .page-link{
  background-color:  #509E2F;
  border-color:  #509E2F;
}

.password-show-hide {
  color: #9FA4AD;
  float: right;
  margin-top: -34px;
  margin-right: 16px;
}

.password-show-hide.active {
  color: #606273;
}

.progress {
  border-radius: 12px;
  border: 1px solid #509e2f;
  background:transparent;
  height: 24px
}

.progress-bar{
  background-color: #D6F7FF !important;
  color: #509e2f;
  height: 24px;
}

.px-300-div{
  width: 100%;
  height: 300px;
  padding: 50% 0;
  text-align: center;
}

.response-loading {
  padding-top: 10px;
  text-align: center;
  width: 100%;
}

.right-side-fixed-card {
  position: fixed;
  top: 47px;
  right: 0;
  width: 342px;
  height: calc(100vh - 47px);
  overflow-y: auto;
}

.right-side-modal-overlay > .modal-dialog {
    margin: 0;
    float: right;
    margin-top: 48px;
    overflow-x: hidden;
    width: 342px;
    max-width: 342px;
    min-height: calc(100vh - 48px);
    -webkit-transition: all 0.4s ease 0s;
    -moz-transition:   all 0.4s ease 0s;
    -o-transition:      all 0.4s ease 0s;
    -ms-transition:     all 0.4s ease 0s;
    transition:        all 0.4s ease 0s;
}

.right-side-modal-overlay-full > .modal-dialog {
  margin: 0;
  float: right;
  margin-top: 48px;
  overflow-x: hidden;
  width: calc(100vw - 232px);
  max-width: calc(100vw - 232px);
  min-height: calc(100vh - 48px);
  -webkit-transition: all 0.4s ease 0s;
  -moz-transition:   all 0.4s ease 0s;
  -o-transition:      all 0.4s ease 0s;
  -ms-transition:     all 0.4s ease 0s;
  transition:        all 0.4s ease 0s;
}

.right-side-modal-overlay > .modal-dialog > *,  .right-side-modal-overlay-full > .modal-dialog > *{
  min-height: calc(100vh - 48px);
  -webkit-transition: all 0.4s ease 0s;
  -moz-transition:   all 0.4s ease 0s;
  -o-transition:      all 0.4s ease 0s;
  -ms-transition:     all 0.4s ease 0s;
  transition:        all 0.4s ease 0s;
}


.custom-alert-right-side-modal-overlay > .modal-dialog {
    margin: 0;
    float: right;
    margin-top: 48px;
    overflow-x: hidden;
    width: calc(100% - 300px);
    max-width: calc(100% - 300px);
    min-height: calc(100vh - 48px);
    -webkit-transition: all 0.4s ease 0s;
    -moz-transition:   all 0.4s ease 0s;
    -o-transition:      all 0.4s ease 0s;
    -ms-transition:     all 0.4s ease 0s;
    transition:        all 0.4s ease 0s;
}

.custom-alert-right-side-modal-overlay-full > .modal-dialog {
  margin: 0;
  float: right;
  margin-top: 48px;
  overflow-x: hidden;
  width: calc(100% - 300px);
  max-width: calc(100% - 300px);
  min-height: calc(100vh - 48px);
  -webkit-transition: all 0.4s ease 0s;
  -moz-transition:   all 0.4s ease 0s;
  -o-transition:      all 0.4s ease 0s;
  -ms-transition:     all 0.4s ease 0s;
  transition:        all 0.4s ease 0s;
}

.custom-alert-right-side-modal-overlay > .modal-dialog > *,  .custom-alert-right-side-modal-overlay-full > .modal-dialog > *{
  min-height: calc(100vh - 48px);
  -webkit-transition: all 0.4s ease 0s;
  -moz-transition:   all 0.4s ease 0s;
  -o-transition:      all 0.4s ease 0s;
  -ms-transition:     all 0.4s ease 0s;
  transition:        all 0.4s ease 0s;
}




.sidebar-icons {
  /*color: white;*/
  color: #6E6B7B;
  margin-top:-3px;
}

.sidebar-toggle-open{
  float:right;
  margin-top: 0px !important;
}

.sidebar-wrapper {
  /*
  background-color: #509E2F;
  color: #fff;
  */

  background-color: #FFFFFF;
  color: #6E6B7B;

  top: 48px;
  position:fixed;
  height: calc(100vh - 48px);
  width: 232px;
  -webkit-transition: all 0.4s ease 0s;
  -moz-transition:   all 0.4s ease 0s;
  -o-transition:      all 0.4s ease 0s;
  -ms-transition:     all 0.4s ease 0s;
  transition:        all 0.4s ease 0s;
}

.sidebar-wrapper.small-sidebar{
  width: 48px;
  -webkit-transition: all 0.4s ease 0s;
  -moz-transition:   all 0.4s ease 0s;
  -o-transition:      all 0.4s ease 0s;
  -ms-transition:     all 0.4s ease 0s;
  transition:        all 0.4s ease 0s;
}

.sidebar-wrapper.small-sidebar > .nav-pills > .nav-item > a > .sidebar-wording{
  opacity: 0;
  margin-left: -200px;
  -webkit-transition: all 0.4s ease 0s;
  -moz-transition:   all 0.4s ease 0s;
  -o-transition:      all 0.4s ease 0s;
  -ms-transition:     all 0.4s ease 0s;
  transition:        all 0.4s ease 0s;
}

.sidebar-wrapper.small-sidebar > .nav-pills > .nav-item > a > .sidebar-icons {
  margin-left: -9px;
}

.sidebar-wrapper > .nav-pills > .nav-item > a {
  white-space: nowrap;
}

.sidebar-wrapper > .nav-pills > .nav-item > a {
  color: #ccc;
  border-radius: 0px;
  height: 48px;
  padding-top: 16px;
  padding-bottom: 16px;
  padding-left: 24px;
  text-decoration:none;

}

.sidebar-wrapper > .nav-pills > .nav-item > a.disabled, .sidebar-wrapper > .nav-pills > .nav-item > a.disabled > .sidebar-icons{
  color: #9fa4ad;
  text-decoration:none;
}

.sidebar-wrapper > .nav-pills > .nav-item > a.active.nav-link {
  color: #509e2f !important;
  text-decoration:none;
}

.sidebar-wrapper > .nav-pills > .nav-item > a.active.nav-link > svg {
  color: #509e2f !important;
  text-decoration:none;
}

.sidebar-wording{
  margin-left: 16px;
  opacity: 1;
  -webkit-transition: all 0.4s ease 0s;
  -moz-transition:   all 0.4s ease 0s;
  -o-transition:      all 0.4s ease 0s;
  -ms-transition:     all 0.4s ease 0s;
  transition:        all 0.4s ease 0s;
  color: #6E6B7B;
}

.small-comm-preview-container {
  max-height:40px;
  width:72px;
  overflow-y: hidden;
}

.small-comm-preview {
  max-width: 100%;
}

.smallertext{
  font-size: 12px;
  line-height:16px;
}

.spinner-container {
  width: 100%;
  text-align:center;
  padding: 15px;
}

.spinner-container-download {
  width: 100%;
  text-align:center;
}

.status-badge{
  height: 24px;
  width: 158px;
  padding-left: 8px;
  border-radius: 12px;
  font-size: 12px;
  line-height: 16px;
  padding-top: 4px;
}

.status-badge.badge-success{
  color: #363740;
  background: #E3FFE4;
}

.status-badge.badge-warning{
  background: #FFF596;
  color: #363740;
}

.tagBadge {
  cursor: pointer;
  font-size: 1em;
}

.tagBadge.badge-primary{
  background: #509E2F;
}

.text-align-left{
  text-align: left;
}

.text-align-center {
  text-align: center;
}

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

.text-decoration-none{
  text-decoration:none;
}

.text_only_500{
  min-height: 550px;
}

.tick_or_cross_list{
  list-style-type: none;
  color: #9FA4AD;
}

.tick_or_cross_list > li {
  margin-left: -42px;
}

.tick_or_cross_list > li > svg {
  margin-top: -3px;
}

.toast_contain {
  -webkit-animation: fadein 2s; /* Safari, Chrome and Opera > 12.1 */
   -moz-animation: fadein 2s; /* Firefox < 16 */
    -ms-animation: fadein 2s; /* Internet Explorer */
     -o-animation: fadein 2s; /* Opera < 12.1 */
        animation: fadein 2s;
}

.translate-y-27{
  transform: translateY(27%);
}

.user-category-thumbnail {
  max-height: 200px;
  max-width: 100%;
}

.user-group-visibility-grid{
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  -webkit-flex-direction: row;
  -ms-flex-direction: row;
  flex-direction: row;
  -webkit-flex-wrap: wrap;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  -webkit-justify-content: space-between;
  -ms-flex-pack: justify;
  justify-content: space-between;
  -webkit-align-content: space-between;
  -ms-flex-line-pack: justify;
  align-content: space-between;
  -webkit-align-items: flex-start;
  -ms-flex-align: start;
  align-items: flex-start;
  padding-left: 19px;
  padding-right: 19px;
}

.user-group-visibility-checkbox{
  padding: 4px;
}

.userDropdown-wrapper{
  position: absolute;
  right: 24px;
  top: 0;
}

.userDropdownProfilePic{
  height: 24px;
  width: 24px;
  border-radius: 100%;
  margin-top: -4px;
  margin-right: 8px;
}

.widget-paused{
  background:#B3B3B3;
  color:#363740;
}

.widget-draft{
  background:#E7E6E5;
  color: #363740;
}

.widget-live{
  background: #E3FFE4;
  color: #363740;
}

.widget-selected{
  background: #D6F7FF;
  color:#363740;
}

.widget-uhoh{
  background: #FFE3E3;
  color:#363740;
}


.width-100{
  width:100%;
}

.width-100-text-align-center {
  width: 100%;
  text-align: center;
}

.zoom-wrapper{
  z-index: 1000;
  position: absolute;
  left: 0;
  padding: 32px 28px;
  display: grid;
  top: -1px;
}

.zoom-wrapper > button {
  height: 48px;
  width: 48px;
  font-size: 14px;
  padding: 0;
}

.zoom_50 {
  zoom: 0.5;
}

.zoom_60 {
  zoom: 0.6;
}

.zoom_70 {
  zoom: 0.7;
}

.zoom_80 {
  zoom: 0.8;
}

.zoom_90 {
  zoom: 0.9;
}

.zoom_100 {
  zoom: 1;
}

.zoom_110 {
  zoom: 1.1;
}

.zoom_120 {
  zoom: 1.2;
}

.zoom_130 {
  zoom: 1.3;
}

.zoom_140 {
  zoom: 1.4;
}

.zoom_150 {
  zoom: 1.5;
}

.zoom_160 {
  zoom: 1.6;
}

.zoom_170 {
  zoom: 1.7;
}

.zoom_180 {
  zoom: 1.8;
}

.zoom_190 {
  zoom: 1.9;
}

.zoom_200 {
  zoom: 2;
}

.h-40{
  height: 40px !important;
}

.h-48{
  height: 48px !important;
}

.h-64{
  height: 64px !important;
}

.h-88{
  height: 88px !important;
}

.h-136{
  height: 136px !important;
}

.h-496{
  height: 496px !important;
}

.h-608{
  height: 608px !important;
}

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

.pa-8{
  padding: 8px !important;
}

.pa-16{
  padding: 16px !important;
}

.pa-24{
  padding: 24px !important;
}

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

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

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

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

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

.w-32{
  width: 32px !important;
}

.w-64{
  width: 64px !important;
}

.w-136{
  width: 136px !important;
}

.w-184{
  width: 184px !important;
}

.w-240{
  width: 240px !important;
}

.w-288{
  width: 288px !important;
}

.b-0{
  border: 0;
}

#behind-sidebar{
  left: 0;
  margin-right:16px;
  width: 232px;
  min-height: calc(100vh - 48px);
  float: left;
  -webkit-transition: all 0.4s ease 0s;
  -moz-transition:   all 0.4s ease 0s;
  -o-transition:      all 0.4s ease 0s;
  -ms-transition:     all 0.4s ease 0s;
  transition:        all 0.4s ease 0s;
}

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

      .gjs-pn-views-container{
        width: 30% !important;
      }

      .gjs-pn-options{
        right: 30% !important;
      }

      .gjs-pn-views{
        width: 30% !important;
      }
}

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

      .campaign-builder-top-div-btn-container{
        display: grid;
        grid-template-columns: 1fr 1fr;
      }
      .flex-grid-centered{
        display: -ms-flexbox;
        display: -webkit-flex;
        display: flex;
        -webkit-flex-direction: row;
        -ms-flex-direction: row;
        flex-direction: row;
        -webkit-flex-wrap: wrap;
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
        -webkit-justify-content: center;
        -ms-flex-pack: center;
        justify-content: center;
        -webkit-align-content: flex-start;
        -ms-flex-line-pack: start;
        align-content: flex-start;
        -webkit-align-items: center;
        -ms-flex-align: center;
        align-items: center;
        box-sizing: border-box;
      }
      .gjs-pn-views-container{
        width: 37% !important;
      }

      .gjs-pn-options{
        right: 37% !important;
      }

      .gjs-pn-views{
        width: 37% !important;
      }
}

@media screen and (max-width: 540px) {
      .documentBody-wrapper{
        grid-template-columns: 1fr;
      }
      .main-area-internal-padding  {
        display: grid;
        grid-template-columns: 1fr;
        height: 100%;
        grid-gap: 25px;
        margin: 0 !important;
        width: 100%;
      }
      .emailManagerSidebar-wrapper > * {
        display: flex !important;
      }
      .emailManagerSidebar-wrapper{
        height: auto;
        margin: 0px;
      }
      .flex-grid-centered{
        display: grid;
        grid-template-columns: 1fr;
        grid-gap: 15px;
        width: 100%;
        box-sizing: border-box;
      }
      .email-grid-item-hover-container {
        background: rgb(0.2,0.2,0.2,0.2);
        width: 100%;
        position: absolute;
        top: 0;
        height: 100%;
        left: 0;
        text-align: center;
        padding: 15% 0;
      }
      .gjs-pn-views-container{
        width: 45% !important;
      }

      .gjs-pn-options{
        right: 45% !important;
      }

      .gjs-pn-views{
        width: 45% !important;
      }
      .mainPane-wrapper {
        padding: 8px;
      }
      .user-profile-wrapper{
        padding: 15px;
      }
}



.smsCreate-container {
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -webkit-flex-direction: row;
    -ms-flex-direction: row;
    flex-direction: row;
    -webkit-flex-wrap: nowrap;
    -ms-flex-wrap: nowrap;
    flex-wrap: nowrap;
    -webkit-justify-content: flex-start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    -webkit-align-content: stretch;
    -ms-flex-line-pack: stretch;
    align-content: stretch;
    -webkit-align-items: flex-start;
    -ms-flex-align: start;
    align-items: flex-start;
	width: calc(100vw - 342px);
    }

.smsCreate-item:nth-child(1) {
    -webkit-order: 0;
    -ms-flex-order: 0;
    order: 0;
    -webkit-flex: 5 1 auto;
    -ms-flex: 5 1 auto;
    flex: 5 1 auto;
    -webkit-align-self: auto;
    -ms-flex-item-align: auto;
    align-self: auto;
    }

.smsCreate-item:nth-child(2) {
    -webkit-order: 1;
    -ms-flex-order: 1;
    order: 1;
    -webkit-flex: 3 1 auto;
    -ms-flex: 3 1 auto;
    flex: 3 1 auto;
    -webkit-align-self: auto;
    -ms-flex-item-align: auto;
    align-self: auto;
    }

.smsCreate-item:nth-child(3) {
    -webkit-order: 2;
    -ms-flex-order: 2;
    order: 2;
    -webkit-flex: 2 1 auto;
    -ms-flex: 2 1 auto;
    flex: 2 1 auto;
    -webkit-align-self: auto;
    -ms-flex-item-align: auto;
    align-self: auto;
    }


.smsCreateSubHeadings {
    font-size: 20px;
    font-family: "Roboto", sans-serif;
    line-height: 32px;
    font-weight: normal;

}


.smsCreateSHPreview {
background: transparent url('/img/Iphone.png') 0% 0% no-repeat padding-box;
opacity: 1;
height: 524px;
background-position : -27px;
}

.bgColourtoWhite {
    background-color: #fff;
    margin-top: -33px;
    padding-top: 32px;
    margin-left: -43px;
    padding-left: 43px;
    border-top: 1px solid rgba( 0, 0, 0, 0.125);
}

.smsCreateSHYourMsg {
	background: #F5F5F5;
	height: 524px;
}


.grid-3-smscreate {
  display: grid;
  width: 100%;
  grid-template-columns: 5fr 3fr 2fr;
  grid-gap: 16px;
}


.card-footer-smsMessage {
    padding: 0.75rem 1.25rem;
    background-color: #fff;
    border: 1px solid rgba(0, 0, 0, 0.125);
}


.text_box_sms_message{
  min-height: 425.38px;
  min-height: 425.38px;
  height: 425.38px;
  border: 0px none;
}

.smsYourMsgBlock{
	padding-right: 37px;
}


.smsCreateSubHeadingOtherOptions{
    font-size: 14px;
    font-family: "Roboto", sans-serif;
    font-weight: normal;
	opacity: 1;
	letter-spacing: 0px;
	padding-top: 16px;
	padding-bottom: 10px;
}


.smsCreateSHOrlShortner{
	font-size: 12px;
    font-family: "Roboto", sans-serif;
    font-weight: normal;
	opacity: 1;
	letter-spacing: 0px;
	letter-spacing: 0px;
	color: #606273;
	opacity: 1;
	padding-top: 8px;
}


.smsCreateSHOrlShortnerSwitch{
	width: 144px;
	height: 40px;
	background: #F5F5F5 0% 0% no-repeat padding-box;
	border-radius: 5px;
	opacity: 1;
	text-align: center;
	/* border-bottom: 1px solid rgba( 0, 0, 0, 0.125); */
}

.smsCreateSubHeadingsBlockOne{
	border-bottom: 1px solid rgba( 0, 0, 0, 0.125);
	padding-bottom: 15px;
}


.smsCreateSMSCredits{
width: 120px;
height: 40px;
background: var(--unnamed-color-d6f7ff) 0% 0% no-repeat padding-box;
background: #D6F7FF 0% 0% no-repeat padding-box;
border-radius: 5px;
opacity: 1;
text-align: center;
padding-top: 10px;
}


.smsCreateSMSCreditsBold{
	font-weight: bold;
}


.smsCreateChatPreview{
	width: 189px;
	background: transparent url('/img/chat.svg') 0% 0% no-repeat padding-box;
	opacity: 1;
	position: relative;
    top: 60px;
    left: 25px;
    z-index: 1000;
	height: 100%;
}


.smsCreateChatPreviewTextMsg{
	font-size: 10px;
    font-family: "Roboto", sans-serif;
    font-weight: normal;
	position: relative;
    top: 10px;
    left: 12px;
    z-index: 1000;
    height: 100%;
	max-width: 170px;
}


.pos-nav-wrapper{
  margin-top:-25px;
}

.pos-nav-wrapper > .nav > .nav-item {
  padding: 12px 10px 11px 10px;
}

.pos-nav-wrapper > .nav > .nav-item > .nav-link:hover, .temp-var-container > .nav > .nav-link:hover{
  border-color: transparent transparent #9FA4AD;
}

.pos-nav-wrapper > .nav > .nav-item > .nav-link, .temp-var-container > .nav > .nav-link {
  border-width: 2px;
  color: #9FA4AD;
}

.pos-nav-wrapper > .nav > .nav-item > .active.nav-link, .temp-var-container > .nav > .active.nav-link {
  border-color: transparent transparent #363740;
  background: transparent;
  color: #363740;
}

.pos-upload-info-text{
  color: #9FA4AD;
}

.pos-upload-button-fill{
  width: -webkit-fill-available;
}

.pos-grid-2-no-gap {
  display: grid;
  width: 100%;
  grid-template-columns: 2fr 3fr;
}

.pos-grid-3-no-gap {
  display: grid;
  width: 100%;
  grid-template-columns: 0.5fr 1fr 1fr;
}

.pos-grid-3-no-gap-mt {
  display: grid;
  width: 100%;
  grid-template-columns: 1fr 1fr 1fr;
}

.pos-grid-4-no-gap-mt {
  display: grid;
  width: 100%;
  grid-template-columns: 1fr 1fr 1fr 1fr;
}

.pos-grid-2-no-gap-mt {
  display: grid;
  width: 100%;
  grid-template-columns: 1fr 1fr;
}


.pos-card-button-edit {
	border-radius: 0px 0px 0px 7px;
	background: #e7e7e7;
	border: 0px;
	color: black !important;
}


.pos-card-button-download {
	border-radius: 0px 0px 0px 0px;
	background: #e7e7e7;
	border: 0px;
	color: black !important;
}


.pos-card-button-approve {
	border-radius: 0px 0px 3px 0px;
    background: #509E2F;
    border: 0px;
    color: white !important;
}


.pt-nav-wrapper{
  margin-top:-25px;
}

.pt-nav-wrapper > .nav > .nav-item {
  padding: 12px 10px 11px 10px;
}

.pt-nav-wrapper > .nav > .nav-item > .nav-link:hover, .temp-var-container > .nav > .nav-link:hover{
  border-color: transparent transparent #9FA4AD;
}

.pt-nav-wrapper > .nav > .nav-item > .nav-link, .temp-var-container > .nav > .nav-link {
  border-width: 2px;
  color: #9FA4AD;
}

.pt-nav-wrapper > .nav > .nav-item > .active.nav-link, .temp-var-container > .nav > .active.nav-link {
  border-color: transparent transparent #363740;
  background: transparent;
  color: #363740;
}

.pt-upload-info-text{
  color: #9FA4AD;
}

.pt-upload-button-fill{
  width: -webkit-fill-available;
}

.pt-grid-1-no-gap {
  display: grid;
  width: 100%;
  grid-template-columns: 1fr;
}

.pt-grid-2-no-gap {
  display: grid;
  width: 100%;
  grid-template-columns: 2fr 3fr;
}

.pt-grid-3-no-gap {
  display: grid;
  width: 100%;
  grid-template-columns: 1fr 1fr 1fr;
}

.pt-grid-4-no-gap {
  display: grid;
  width: 100%;
  grid-template-columns: 1fr 1fr 1fr 1fr;
}


.pt-card-button-edit {
	border-radius: 0px 0px 0px 7px;
	background: #e7e7e7;
	border: 0px;
	color: black !important;
}


.pt-card-button-download {
	border-radius: 0px 0px 0px 0px;
	background: #e7e7e7;
	border: 0px;
	color: black !important;
}


.pt-card-button-approve {
	border-radius: 0px 0px 3px 0px;
    background: #509E2F;
    border: 0px;
    color: white !important;
}



.pos-lowresprofing-grid-item {
  background:white;
  border-radius: 5px;
  position:relative;
  overflow-x: hidden;
  overflow-y: hidden;
  cursor: pointer;
  height: 200px;
  width: 150px;
  margin: 8px;
  box-shadow: 0px 0px 5px #00000026;
  -webkit-transition: all 0.4s ease 0s;
  -moz-transition:   all 0.4s ease 0s;
  -o-transition:      all 0.4s ease 0s;
  -ms-transition:     all 0.4s ease 0s;
  transition:        all 0.4s ease 0s;
}


.pos-lowresprofing-grid-item.selected{
  background:#509e2f;
  color: #fff;
  border-radius: 5px;
  position:relative;
  overflow-x: hidden;
  overflow-y: hidden;
  height: 200px;
  width: 150px;
  box-shadow: 0px 0px 5px #00000026;
  -webkit-transition: all 0.4s ease 0s;
  -moz-transition:   all 0.4s ease 0s;
  -o-transition:      all 0.4s ease 0s;
  -ms-transition:     all 0.4s ease 0s;
  transition:        all 0.4s ease 0s;
}


.pos-lowresprofing-grid-1-no-gap {
  display: grid;
  width: 100%;
  grid-template-columns: 1fr;
}

.progress-lowresproofing {
  border: 1px solid #509e2f;
  background:transparent;
  height: 24px
}

.progress-bar-lowresproofing{
  background-color: #D6F7FF !important;
  color: #509e2f;
  height: 24px;
}













.html-editor-App {
  display: inline-block;
}

.html-editor-resize {
  cursor: nwse-resize;
}

.html-editor-draggable{
  cursor:move;
}

.html-editor-button{
  border-radius: 5px;
  border-width: 2px;
  color: '#ffffff';
  background-color: '#808080';
}

.html-editor-Save-template{
  position:"absolute";
  background-color: '#c14bfc';
  color:'#ffffff';
  border-radius:'7px';
}


.html-editor-panel {
	position: absolute;
    right: 30px;
    top: 250px;
    text-align: right;
    border: 1px solid black;
    box-sizing: border-box;
    width: fit-content;
}

.html-editor-panel-container {
  height: 100%;
  position: relative;
}

.html-editor-panel-header {
  padding: 4px;
  background-color: #061a40;
  color: #ffffff
}

.html-editor-panel-content {
  padding: 4px;
  background-color: #e6e6e6;
}


.pos-upload-info-text{
  color: #9FA4AD;
}

.pt-upload-info-text{
  color: #9FA4AD;
}


.display-inline{
	display: inline;
}


.padding-top-16{
	padding-top: 16px
}


.padding-bottom-16{
	padding-bottom: 16px
}


.padding-top-16{
	padding-top: 20px
}



.pos-html-editor-rightbarYscroll{
    overflow-y: scroll;
    max-height: calc(100vh - 300px);
}


.pt-html-editor-rightbarYscroll{
    overflow-y: scroll;
    max-height: calc(100vh - 300px);
}


.html-editor-tab {
  overflow: hidden;
  border: 1px solid #ccc;
  background-color: #ffffff;
}

.html-editor-tab button {
  background-color: inherit;
  float: left;
  border: none;
  outline: none;
  cursor: pointer;
  padding: 14px 16px;
  transition: 0.3s;
  font-size: 17px;

}

.html-editor-tab button:hover {
  background-color: #ddd;
}

.html-editor-tab button.active {
  color: #37ed52;
  border-bottom: solid;
}

.html-editor-tabcontent {
  display: none;
  padding: 6px 12px;
  border: 1px solid #ccc;
  border-top: none;
}


.html-editor-App input{
  border-radius: 6px !important;
  width: 50px !important;
  height: auto;
}


.html-editor-tab-v1 {
  overflow: hidden;
  border: 1px solid #ccc;
  background-color: #ffffff;
  width: 320px;
}

.html-editor-tab-v1 button {
  background-color: inherit !important;
  float: left !important;
  border: none !important;
  outline: none !important;
  cursor: pointer !important;
  padding: 14px 16px !important;
  transition: 0.3s !important;
  font-size: 17px !important;

}

.html-editor-tab-v1 button:hover {
  background-color: # !important;
}

.html-editor-tab-v1 button.active {
  color: #509E2F !important;
  border-bottom: solid !important;
}

.html-editor-tabcontent-v1 {
  display: none;
  padding: 6px 12px;
  border: 1px solid #ccc;
  border-top: none;
}

.html-editor-App-zoom-v1 input{
  width:300px !important;
}

.html-editor-button-v1{
  border-radius: 5px;
  border: none;
  width: 53px;
  color: '#ffffff';
  background-color: '#808080';
}


.html-editor-topLeft-dot-v1 {
position: absolute;
height: 15px;
width: 15px;
background-color: #ffffff;
box-shadow: 0 0 0 3px rgba(0, 0, 0, 0.2);
border-radius: 50%;
cursor: nwse-resize;
z-index: 1001;
}

.html-editor-topRight-dot-v1 {
position: absolute;
height: 15px;
width: 15px;
background-color: #ffffff;
box-shadow: 0 0 0 3px rgba(0, 0, 0, 0.2);
border-radius: 50%;
cursor: ne-resize;
z-index: 1001;
}

.html-editor-bottomLeft-dot-v1 {
position: absolute;
height: 15px;
width: 15px;
background-color: #ffffff;
box-shadow: 0 0 0 3px rgba(0, 0, 0, 0.2);
border-radius: 50%;
cursor: sw-resize;
z-index: 1001;
}

.html-editor-bottomRight-dot-v1 {
position: absolute;
height: 15px;
width: 15px;
background-color: #ffffff;
box-shadow: 0 0 0 3px rgba(0, 0, 0, 0.2);
border-radius: 50%;
cursor: nwse-resize;
z-index: 1001;
}

.html-editor-vertical-line-v1::after {
  content: "";
  position: absolute;
  z-index: 1000;
  left: var(--middle);
  top: 0;
  bottom: 0;
  border-left: 3px dotted #d642ff;
  height: var(--height);
  transform: translate(-50%);
}

.sso-grid{
  display: grid;
  grid-template-columns: 1fr;
  grid-gap: 15px;
}

.html-editor-disable-select-v1 {
user-select: none;
-webkit-user-select: none;
-khtml-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
}


.grid-3-pt-selections{
  display: grid;
  width: 100%;
  grid-template-columns: 1fr 1fr 1fr;
  grid-gap: 20px;
}

.grid-3-pt-callouts-selections{
  display: grid;
  width: 100%;
  grid-template-columns: 1.2fr 0.2fr 1.75fr;
  grid-gap: 20px;
}

.grid-2-pt-selections{
  display: grid;
  width: 100%;
  grid-template-columns: 20fr 3fr;
  grid-gap: 20px;
}


.grid-1-pt-selections{
 align-items: center;
 justify-content: center;
 display: flex;
 width: 100%;
 grid-template-columns: 1fr;
 grid-gap: 10px;
}




.html-editor-top-dot-v1 {
  position: absolute;
  height: 4px;
  width: 20px;
  background-color: #ffffff;
  box-shadow: 0 0 0 3px rgba(0, 0, 0, 0.2);
  border-radius: 10px;
  cursor: n-resize;
  z-index: 1001;
}

.html-editor-bottom-dot-v1 {
  position: absolute;
  height: 4px;
  width: 20px;
  background-color: #ffffff;
  box-shadow: 0 0 0 3px rgba(0, 0, 0, 0.2);
  border-radius: 10px;
  cursor: s-resize;
  z-index: 1001;
}

.html-editor-left-dot-v1 {
  position: absolute;
  height: 20px;
  width: 4px;
  background-color: #ffffff;
  box-shadow: 0 0 0 3px rgba(0, 0, 0, 0.2);
  border-radius: 10px;
  cursor: ew-resize;
  z-index: 1001;
}

.html-editor-right-dot-v1 {
  position: absolute;
  height: 20px;
  width: 4px;
  background-color: #ffffff;
  box-shadow: 0 0 0 3px rgba(0, 0, 0, 0.2);
  border-radius: 10px;
  cursor: ew-resize;
  z-index: 1001;
}


.date-picker-PTPDFCreate {
	font-size: 13px;
    border-radius: 4px;
    box-shadow: inset 0 2px 2px #e9e9e9;
    border: 1px solid #aeaeae;
    line-height: 16px;
    padding: 6px 10px 5px;
}



.modal-90w {
    width: 90%;
    max-width: none!important;
}