body {
    font-family: "Helvetica Neue", Helvetica, sans-serif;
    color: #444;
    background: #f0f0f0;
   -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
}

.dom-heading {
   font-size: 400px;
   color: #690c0c;
   text-shadow: 0px 0px 100px rgba(198, 85, 85, 0.701961);
   font-family:"lobster";
 }

::selection {
     color: #fff;
     text-shadow: none;
     background: #444;
}

::-moz-selection {
     color: #fff;
     text-shadow: none;
     background: #444;
}

input {
    font-family: "Helvetica Neue", Helvetica, sans-serif;
    font-size: 12px;
    outline: none;
    border: 1px solid #c7d0d2;
    border-radius: 2px;
    -webkit-transition: all .4s ease;
    -moz-transition: all .4s ease;
    transition: all .4s ease;
}

/* ----------
input[type=text]{
    height: 20px;
}-----*/

input:hover{
    border: 1px solid #b6bfc0;
}

input:focus{
    border: 1px solid #a8c9e4;
}

.highlightedText {
    background: #c5f8c1;
}

.ts_btn {
  border-radius: 16px;
  border: 1px solid rgba(0, 0, 0, 0.0980392);
  background: #d76316;
  font-family:"verdana";
  color: #ffffff;
  padding: 3px 12px;
  cursor: pointer;
}

.ts_btn:hover {
  background: #de9868;
  border: 1px solid #de9868;
}

.ts_btn:active {
  background: #be3205;
  border: 1px solid #be3205;
  color: #e0d1cd;
}

.actionButton {
    border-radius: 8px;
    border: 1px solid rgba(0, 0, 0, 0.0980392);
    font-size: 12px;
    font-family: "verdana";
    color: #FFFFFF;
    background-color: #6193ca;
    vertical-align: middle;
    padding-bottom: 2px;
    padding-top: 3px;
    padding-left: 10px;
    padding-right: 10px;
}

.actionButton:hover {
  background: #52a3fb;
  border: 1px solid #52a3fb;
}

.actionButton:active {
  background: #3b6b9f;
  border: 1px solid #3b6b9f;
  color: #e0d1cd;
}



.tableButton {
    font-size: 12px;
    vertical-align: top;
    margin-left: 17px;
}


.ts_btn:hover {
  background: #de9868;
  border: 1px solid #de9868;
}

.ts_btn:active {
  background: #be3205;
  border: 1px solid #be3205;
  color: #e0d1cd;
}


/* ------------- Login-----------------*/
.loginContainer {
    position: fixed;
    width: 340px;
    height: 370px;
    top: 35%;
    left: 50%;
    margin-top: -170px;
    margin-left: -170px;
    background: #fff;
    border-radius: 3px;
    border: 1px solid #ccc;
    box-shadow: 0 0 20px rgba(0, 0, 0, 0.4);
    -webkit-animation-name: bounceIn;
    -webkit-animation-fill-mode: both;
    -webkit-animation-duration: 1s;
    -webkit-animation-iteration-count: 1;
    -webkit-animation-timing-function: linear;
    -moz-animation-name: bounceIn;
    -moz-animation-fill-mode: both;
    -moz-animation-duration: 1s;
    -moz-animation-iteration-count: 1;
    -moz-animation-timing-function: linear;
    animation-name: bounceIn;
    animation-fill-mode: both;
    animation-duration: 1s;
    animation-iteration-count: 1;
    animation-timing-function: linear;
}

.loginContainer > div
{
    margin: 0 auto;
    margin-top: 12px;
}

.loginBrand {
    background: rgb(236, 242, 245);
    padding: 7px 0px;
}

label {
    color: #64636f;
    display: inline-block;
    font-size: 14px;
}
/*
p a {
    font-size: 11px;
    color: #aaa;
    float: right;
    margin-top: -13px;
    margin-right: 20px;
    -webkit-transition: all .4s ease;
    -moz-transition: all .4s ease;
    transition: all .4s ease;
}

p a:hover {
    color: #555;
}
*/
/*
input[type=name],
input[type=password] {
    color: #777;
    padding-left: 10px;
    margin: 10px;
    margin-top: 12px;
    margin-left: 18px;
    width: 290px;
    height: 35px;
}
*/
#lower {
    background: #ecf2f5;
    width: 100%;
    height: 69px;
    margin-top: 20px;
    box-shadow: inset 0 1px 1px #fff;
    border-top: 1px solid #ccc;
    border-bottom-right-radius: 3px;
    border-bottom-left-radius: 3px;
}

#lower > input[type=checkbox] {
    margin-left: 20px;
    margin-top: 30px;
}

.check {
    margin-left: 3px;
    font-size: 11px;
    color: #60758d;
    text-shadow: 0 1px 0 #fff;
    vertical-align: top;
    margin-top: 3px;
}

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

.loginBtn {
    float: left;
    margin-left: 20px;
    margin-top: 20px;
    width: 80px;
    height: 30px;
    font-size: 14px;
    font-weight: bold;
    color: #fff;
    background: rgb(110, 194, 232);
    border-radius: 30px;
    border: 1px solid #66add6;
    box-shadow: 0 1px 2px rgba(0, 0, 0, .3), inset 0 1px 0 rgba(255, 255, 255, .5);
    cursor: pointer;
}

.loginBtn:hover {
    background: rgb(182, 226, 255);
    border: 1px solid #b8def3;
}

.loginBtn:active {
    background-image: -webkit-gradient(linear, left top, left bottom, from(#6ec2e8), to(#b6e2ff));
    background-image: -moz-linear-gradient(top left 90deg, #6ec2e8 0%, #b6e2ff 100%);
    background-image: linear-gradient(top left 90deg, #6ec2e8 0%, #b6e2ff 100%);
}
/*-------------------------------------------------------------------*/

/* -----------------------Nav Bar-------------------------- */
.navBar, .setupNav
{
    /* background: rgba(26, 81, 134, 0.909804); */
    position: absolute;
    left: 0;
    font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
}

.navBar
{
    top: 0;
    width: 100%;
    height: 42px;
    background-image: linear-gradient(left , rgb(255,255,255) 4%, rgb(26,82,134) 23%);
background-image: -o-linear-gradient(left , rgb(255,255,255) 4%, rgb(26,82,134) 23%);
background-image: -moz-linear-gradient(left , rgb(255,255,255) 4%, rgb(26,82,134) 23%);
background-image: -webkit-linear-gradient(left , rgb(255,255,255) 4%, rgb(26,82,134) 23%);
background-image: -ms-linear-gradient(left , rgb(255,255,255) 4%, rgb(26,82,134) 23%);

background-image: -webkit-gradient( linear, left top, right top, color-stop(0.04, rgb(255, 255, 255)), color-stop(0.23, rgb(26, 82, 134)));
}

.setupNav
{
    width: 146px;
    padding-bottom: 30px;
    padding-top: 20px;
    background: rgba(26, 81, 134, 0.96);
}

.setupWorkload
{
    position: absolute;
    top: 80px;
    left: 156px;
    bottom: 0;
    right: 0;
}

.brand
{
    position: relative;
    left: 16px;
    top: 2px;
    border: none;
}

.navShift {
    width:100%;
    height:40px;
}

.viewShift {
    padding-left: 30px;
}

.postGroup {
    background-color: #eff9ff;
}

.wrp-3 {
    display: block;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
    font-size: 15px;
    /* max-height: 32.2px; */
    -webkit-line-clamp: 3;
    line-height: 1.15;
    -moz-binding: url(bindings.xml#ellipsis);
    word-break: break-all;
}

.postCntWrp {
    padding: 10px 0;
}

/* -----------------------Reports-------------------------- */
.reportFilters {
    width: 236px;
    padding-bottom: 12px;
    background: rgba(26, 81, 134, 0.96);
    position: absolute;
    display: inline-block;
    left: 0px;
}

.reportWorkload {
    height: 100%;
    margin-left:10px;
    padding-right: 10px;
    display: inline-block;
}

.filtersOn {
    left: 232px;
    position: relative;
    margin-top: 7px;
}

.filterSection {
    margin: 27px 4px 0 4px;
}

.filterSectionTitle {
    font-size: 14px;
    color: #d9e3f6;
    width: 100%;
    border-bottom: 1px solid #d9e3f6;
}

.filterCheckLabel {
    font-size: 13px;
    color: #fff;
    margin-bottom: 0px;
}

.filterRow {
    margin-top: 10px;
}

.filterText {
    color: #fff;
    font-size: 12px;
}

.filterSmallText {
    color: #fff;
    font-size: 10px;
}

.filterCheck {
    vertical-align: text-bottom;
}

.reportConfigSelect {
    width: 200px;
}

.reportReloadBtn {
    position: relative;
    float: right;
    top: 22px;
    margin-right: 10px;
    padding: 0 6px;
}

.reportActionIcon {
    font-size: 11px !important;
    padding: 1px;
}

.pendingApproval {
    color: rgb(205, 144, 51);
}

.scheduled {
    color: rgb(27, 123, 27);
}

.expandedAnalytics {
    display:inline-block;
    width:70%;
}

/* -----------------------End Reports-------------------------- */

.settingsTableCell {
    padding: 5px;
}

.settingsTable {
    margin-left: 15px;
}

.settingsSection {
    margin-bottom: 15px;
    margin-top: 12px;
}

.buttonsGroups
{
    text-decoration: initial;
}

.navButtonsGroup
{
    position: absolute;
    top: -2px;
    left: 180px;
}

.buttonsGroups > li
{
    display: inline;
}

.navBarButton
{
    padding: 40px 15px 10px;
    font-size: 16px;
    color: rgb(229, 243, 240);
    cursor: pointer;
}

.navBarButtonSelected, .navTreeNodeSelected
{
    color: rgb(252, 157, 104) !important;
}

.navTreeRootNode
{
    position: relative;
    margin-top: 10px;
    color: rgb(209, 228, 224);
    padding: 7px 0px 7px 10px;
    cursor: pointer;
}

.navTreeRootNodeButton
{
    font-size: 14px;
    cursor: pointer;
}

.navTreeChildNodes
{
    margin-left: 17px;
    padding-top: 0px !important;
}

.routesView
{
    height: 94%;
    position: absolute;
    top: 70px;
    left: 6px;
    padding-top: 12px;
    /* border-right: 1px solid rgba(0, 0, 0, .3); */
    box-shadow: 0 0 20px rgba(0, 0, 0, 0.4);
    font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
}

.routeCommonField{
    width: 270px;
}

.routesSearchButtonsContainer {
    display: inline-block;
    padding-left: 3px;
}

.routesPager, .routesSearch{
    width: 300px;
}

.routesSearch {
    margin-top: 5px;
    white-space: nowrap;
    margin-left: 3px;
}

.routesPageTracker {
    position: relative;
    top: 25px;
    left: 98px;
    width: 137px;
    display: inline-block;
}

.routesPager {
    margin: 0px 3px 3px !important;
}

.pageNumber {
    font-weight: bold;
    color: rgba(25, 75, 122, 0.91);
}

.routesContainer
{
    margin-left: 3px;
    margin-top: 15px;
}

.routeItem{
    width: 100%;
}

.routeView
{
    position: absolute;
    right: 17px;
    bottom: 0px;
    left: 324px;
    top: 85px;
    min-width: 440px;
}

.routeButtonsContainer{
    margin-bottom: 14px;
    margin-left: 8px;
}

.siblingButton{
    margin-left: 10px;
}

.secondaryRouteButton{
    float: right;
}

.routeCommonFieldsContainer{
    position:relative;
}

.routeFieldLabel
{
    padding: 8px 10px 0px 3px;
}


.routeFieldLabelReadonly, .routeFieldName
{
    color: rgba(25, 75, 122, 0.91);
}

.routeFieldLabelReadonly
{
    font-size: 12px;
    max-width: 500px;
    text-overflow: ellipsis;
    overflow: hidden;
}


.routeFieldName {
    font-size: 18px;
}

.routePivoteMenu{
    margin-top: 30px;
    margin-left: 0px;
    padding-left: 10px;
    white-space: nowrap;
}

.routePivotMenuItem
{
    margin: 25px 45px 10px 0px;
    font-size: 16px;
    font-weight: bold;
    color: rgb(133, 136, 150);
    cursor: pointer;
}

.routePivotMenuItemSelected
{
    color: #91b4db;
}

.routePivotMenuItemSelectedBig
{
    color: #52a3fb;
}

.routePropertyView{
    margin-left: 7px;
    min-width: 440px;
}

.largeHelpMsg, .smallHelpMsg{
    color: #b8b8c4;
    font-family:"verdana";
}

.largeHelpMsg{
    font-size: 20px;
}

.smallHelpMsg{
    font-size: 14px;
}

.statusIconDiv {
    display: inline-block;
    padding-right: 4px;
    height: 1px;
}

.scopeIconDiv {
    display: inline-block;
    float: right;
    padding-bottom: 5px;
    padding-right: 4px;
}

.sectionIcon {
    font-size: 16px;
    color: rgb(215, 99, 22);
    margin-top:4px !important;
}

.icon-question-sign {
    margin-left: 3px;
    color: rgb(162, 204, 243);
    font-size: 14px;
    cursor: pointer;
}

.icon-caret-down {
    margin-left: 3px;
    font-size: 16px;
    cursor: pointer;
}

.icon-plus-sign, .icon-minus-sign, .icon-eye-open, .routeSearchBtn{
    font-size: 12px;
    cursor: pointer;
    color: rgb(72, 118, 161) !important;
}

.icon-remove {
    color: #c11616;
    cursor:pointer;
}

.icon-remove:hover {
    color: #d55c5c;
}

.icon-plus-sign:hover, .routeSearchBtn:hover, .icon-eye-open:hover, .icon-minus-sign:hover{
    color: rgb(44, 127, 206) !important;
}

.routeSearchBtn {
    line-height: 1.5;
}

.routeSearchBtn:hover {
    font-size: 13px !important;
}

.icon-minus-sign:hover {
    color: rgb(171, 228, 162);
}

.icon-edit, .arrowIcon {
    color: #d76316;
    cursor:pointer;
}

.icon-edit:hover, .arrowIcon:hover {
    color: #d76316;
    font-size: 18px;
}

.selectedArrowIcon {
    font-size: 18px !important;
}

.arrowIconDisabled {
    color: #ebd1be;
    cursor: none;
}

.icon-facebook-sign, .icon-twitter-sign{
    font-size: 22px;
    line-height: 4px !important;
    display: initial !important;
}

.icon-facebook-sign {
    color: rgb(101, 125, 187);
}

.icon-twitter-sign {
    color: #4099FF;
}

.fa-vk {
    color: #769cc7;
    font-size: 22px;
    line-height: 0px !important;
    display: initial !important;
    vertical-align: text-top;
}

.icon-ok-circle, .icon-ban-circle {
    font-size: 16px;
    line-height: 0px !important;
    display: initial !important;
}

.icon-ok-circle {
    color: #116611;
}

.icon-ban-circle {
    font-size: 16px;
    color: #991212;
}

.icon-unlock {
    color: #6f6868;
}

.icon-lock {

    color: #6f6868;
}

.icon-unlock, .icon-lock {
    font-size: 14px;
}

.expander
{
    color:rgb(99, 123, 150);
    margin-top: 2px;
}

.icon-play
{
    font-size: 10px;
}

.icon-sort-up {
    font-size: 14px;
    vertical-align: middle;
}

.configExpander {
    color: rgb(209, 228, 224);
}

.categoryName {
    width: 214px;
    overflow: hidden;
    text-overflow: ellipsis;
}

.actionIcon {
    margin-right: 5px;
}

.calloutActions {
    display:inline-block;
    margin-top: 4px;
}

.calloutCategoryActions, .calloutCategoryEdited {
    margin-left: 7px;
    display:inline-block;
}

.calloutCategoryActions {
    margin-top:12px;
}

.calloutCategoryEdited {
    vertical-align: middle;
    margin-bottom: 10px;
}

.bulkCalloutsInput {
    height: 668px;
    margin: 10px;
}

.removeItem{
    display:inline-block;
    margin-top:7px;
    cursor:pointer;
}

.fieldsRow {
    padding: 5px 0px 3px 10px;
    white-space: nowrap;
}

.sectionRow {
    margin-bottom: 12px;
    white-space: nowrap;
}

.fieldsSection {
    margin-top: 10px;
    border-top: 1px solid rgb(165, 177, 192);
}

.fieldsSectionContent{
    padding-left: 5px;
}

.fieldsSectionTitle{
    font-size: 16px;
    color: #193583;
}

.nextField{
    margin-left: 10px;
}

.pwdUsers {
    padding: 0 !important;
    margin: 0 !important;
    height: auto !important;
}

.tabSection {
    margin-top: 10px;
}

/* ---------- Start Route Styles-------------------*/

.routeSettingsDiv {
   width: 100%;
   margin-top: 14px;
   white-space: nowrap;
}

.expParamRow, .routeSettingsRow{
    padding: 4px 3px;
    text-align: left;
    vertical-align: top;
    border-top: 1px solid rgb(210, 210, 219);
    background-color: rgb(228, 235, 240);
    text-overflow: ellipsis;
}
.routeSettingsRow, .calloutInput {

    width: 530px;
}

.selectableSettingsRow {
    cursor: pointer;
}

.selectableSettingsRow:hover {
    background-color: rgb(219, 235, 246);
}

.routeSettingsInfo1
{
    line-height: 14px;
}

.routeSettingsInfo2 {
    line-height: 11px;
}

.routeSettingsName, .routeSettingsRow, .routeSettingsField{
    display: inline-block;
    overflow: hidden;
}
.routeSettingsName, .routeSettingsDetails, .routeSettingsField
{
    text-overflow: ellipsis;
    overflow: hidden;
}
.routeSettingsName, .routeSettingsField
{
    font-size: 12px;
    color: rgb(41, 106, 150);
}

.routeSettingsName{
    max-width: 474px;
    width: 474px;
}

.routeSettingsDetails {
    font-size: 10px;
    color: #596e7c;
}

.fieldValue {
    color: #637b96;
    font-size: 16px;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 508px;
}

.multiSelectOption {
    max-width: 230px;
    overflow: hidden;
    text-overflow: ellipsis;
    display: inline-block;
}

.inlineProperty{
    margin-left: 7px;
}

.routeListRow{
    overflow: hidden;
    text-overflow: ellipsis;
}

.routeListInfo
{
    line-height: 11px !important;
}

.routeItemSelected{
    background-color: rgb(243, 221, 209) !important;
}

.routeListIcon {
    width: 16px;
    display: inline-block;
    vertical-align: middle;
}

.routeListRow1Text, .routeListRow2Text {
    display: inline-block;
    width: 264px;
    max-width: 264px;
    overflow: hidden;
    text-overflow: ellipsis;
    color: #3b6b9f;
    white-space: nowrap;
}

.routeListRow1Text {
    font-size: 10px;
}

.routeListRow2Text {
    font-size: 10px;
    vertical-align: middle;
}

/* ---------- End Sources Styles-------------------*/

/*-------------------Transformations-------------------*/
.expParamRow
{
    margin-right: 10px;
}

.expParamField
{
    position: relative;
    margin-left: 3px;
    margin-right: 3px;
}

.paramFieldTitle {
    font-size: 11px;
    color: #637b96;
    padding-left: 3px;
}

.paramInput{
    height: initial !important;
    width: 156px;
}

.categoryField {
    overflow: visible;
    vertical-align: top;
    margin-top: 7px;
}

/* ---------- End Transformations-------------------*/

/* ---------- Popup-------------------*/
.popupShadow {
    border: 1px solid #ddd;
    box-shadow: 0 0 8px rgba(0,0,0,.4);
    position: fixed;
    left: 50%;
    top: 50%;
    box-sizing: border-box;
    outline: 0px;
    background-color: #fff;
}

.modalBackground {
    opacity: 0.65;
    filter: Alpha(opacity=65);
    background-color: #fff;
    height: 100%;
    width: 100%;
    position: fixed;
    box-sizing: border-box;
    outline: 0px;
    z-index: 2001;
    left: 0px;
    top: 0px;
}

.inputLine {
    padding: 5px 7px 3px 4px;
}

.popupHeader {
    padding: 5px;
    background-color: #4e75a0;
}

.popupTitle {
    font-size: 18px;
    color: #FFFFFF;
    font-weight: bold;
}

.popupBody {
    overflow: auto;
    margin-top: 12px;
}

.popupFooter {
    position: absolute;
    bottom: 7px;
    width: 100%;
}

.fieldTitle{
    font-size: 14px;
    color: #637b96;
}

.fieldText{
    font-size: 15px;
    color: #7791ae;
}
/*
.popupMessageText{
    font-size: 20px;
    color: #7791ae;
}
*/

.expressionInput
{
    border: 2px solid #cccccc;
    height: 170px;
}

.longInput, .expressionInput{
    width: 470px;
}

.fieldTextInput {
    width: 408px !important;
}

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

/* Confirmation Dialog */

.dialogTitleContainer{
    text-align: center;
    margin:10px;
}

.dialogTitle{
    font-size: 16px;
    color: #637b96;
}

.dialogDescrContainer {
    margin: 12px 10px;
}

.dialogDescr {
    font-size: 12px;
}

.dialogButtonsContainer {
    text-align: center;
    position: absolute;
    width: 100%;
    bottom: 10px;
}

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

/* SN Account */
.fieldMsg {
    font-size: 11px;
    color: #637b96;
}

.accountName {
    height: 25px;
    max-width: 335px;
    width: 335px;
}

.simulateExecutionBtnContainer {
    display: inline-block;
    vertical-align: top;
    padding-top: 6px;
}

.account-cl-1 {
    color: #38569a;
}

.account-cl-2 {
    color: #00abf0;
}

.account-cl-3 {
    color: #41658b;
}

.account-cl-4 {
    color: #ff8c00;
}

.account-cl-5 {
    color: #0088cc;
}

.account-cl-6 {
    color: #cd201f;
}

.account-cl-7 {
    color: #59267c;
}

.account-cl-8 {
    color: #003f67;
}

.account-cl-9 {
    color: #ff5722;
}

.account-cl-10 {
    color: #ed008c;
}

.account-cl-11 {
    color: #ff003a;
}

.account-cl-13 {
    color: #25d366;
}

/* -------------------------------*/
.tableTitle {
    text-align: left;
    color: #265281;
    font-size: 16px;
    font-weight: bold;
}

.inputField, .fieldTitle{
    margin-right: 3px;
}

.testConfig {
    margin-bottom: 30px;
}

.testConfig > span
{
    float: right;
    margin-right: 10px;
}

.link, .actionButton{
    cursor: pointer;
    text-decoration: none;
}

.refreshIcon, .reportRefreshIcon
{
    color: rgb(222, 152, 104);
    font-size: 18px;
    cursor: pointer;
}

.reportRefreshIcon
{
    position: relative;
    left: 190px;
    top: -26px;
}

.sortIcon, .sortActiveIcon {
    font-size: 14px;
    margin-left: 3px;
    cursor: pointer;
}
.sortIcon {
    color: #7f9dbd;
}

.sortActiveIcon {
    color: #85ce33;
}

.sortSelect
{
    font-size: 10px;
    margin-left: 7px;
    width: 85px;
}

.logo {
    background-image: url('../Images/logo.png');
}

.rowBorder, .routeDiv {
    border: 2px solid #7f9dbd;
}

.blockDiv {
    padding: 7px;
    margin-bottom: 3px;
    background-color: #fffafa;
    white-space: nowrap;
}

.cellDiv {
    display: inline-block;
    white-space: nowrap;
}

.tableCellDiv {
    display: table-cell;
    white-space: nowrap;
    padding: 3px;
}

.tableDiv {
    display: table;
    white-space: nowrap;
}

.filterDiv{
    height: 90px;
}

.periodName {
    font-size: 12px;
}

.titleText {
    font-size: 18px;
    color: #7f9dbd;
    vertical-align: middle;
}

.pageTitle {
    font-size: 24px;
    color: #4e75a0;
    text-decoration: double;
}

.routeParamsDiv, .fbAccountDiv
{
    border: 3px ridge #7f9dbd;
    border-top: none;
    margin-top: 5px;
    display: inline-block;
}

.fbAccountDiv {
    width: 350px;
    height: 100px;
}

.routeParamsHeader {
    background: border-box;
    background-color: #4e75a0;
    border-top: 3px ridge #7f9dbd;
    font-size: 14px;
    width: 100%;
    height: 21px;
}

.sourcesCell{
    width: 100%;
    max-width: 200px;
    overflow: hidden;
}

.sourcesList{
    overflow-y: auto;
    overflow-x: hidden;
    max-height: 145px;
}

.inlineBlock {
    display: inline-block;
}

.daysListItem{
    display: inline;
    list-style-type: none;
    margin-right: 5px;
}

.daysList{
    padding: 0px;
    margin-top: 3px;
}

.actionCell {
    vertical-align: bottom;
    text-align: right;
    width: 1%;
}

.numericInput {
    width: 40px;
}

.errorBorder {
    border: 1px solid #e42626 !important;
}

.errorColor {
    color: #e42626;
}

.warningColor {
    color: rgb(240, 173, 78);
}

.errMsg {
    color: #e42626;
    text-align: left;
    padding: 0px 0px 10px 10px;
    font-size: 10px;
    font-weight: normal;
}

.reportErrDiv {
    margin-left: 20px;
}

.reportPeriod {
    margin-right: 15px;
}

.colsPickerCell {
    vertical-align: top;
    white-space: nowrap;
}

.colsPickerDiv{
    overflow-y: auto;
    overflow-x: hidden;
    height: 383px;
}

.colsPickerRow {
    text-align: left;
    color: #0d0202;
}

.reportTable th {
    white-space: nowrap;
}

.reportTable th,
.reportTable td {
  text-align: left;
  vertical-align: top;
  border-top: 1px solid #dddddd;
  overflow: hidden;
  text-overflow: ellipsis;
}

.reportTable td {
  font-weight: normal;
  font-size: 14px;
}

.reportCellTitle {
    color: rgb(185, 142, 122);
}

.innerReportTable td {
    border-top: none;
    padding: 0;
}

.innerConfigReportTable {
    max-width: 200px;
}

.innerReportTable td:first-child {
    padding-right: 7px;
    width: 60px;
    max-width: 60px;
    min-width: 60px;
}

.configValueCell {
    max-width: 120px !important;
    min-width: 120px;
}

.clicksStatsDateCell{
    min-width: 180px !important;
    max-width: 180px !important;
    width: 180px !important;
    white-space: nowrap !important;
}

.clicksStatsCell{
    min-width: 30px !important;
    max-width: 30px !important;
    width: 30px !important;
    white-space: nowrap !important;
}

.highlight {
    background-color: #c5f8c1;
}

.maxLenExceeded
{
    background-color:#f68960;
}

.innerReportTableCollapsed {
    display: inline-block;
    height: 29px;
    overflow: hidden;
    text-overflow: ellipsis;
}

.innerReportTableCollapsed td {
    max-width: 500px;
    white-space: nowrap;
}

.reportTable {
    table-layout:fixed;
    background-color: transparent;
}

.reportTable th {
  font-weight: bold;
  font-size: 16px;
  color: rgb(78, 117, 160);
}

.reportTable thead th {
  vertical-align: bottom;
  background-color: transparent;
}

.reportTable caption + thead tr:first-child th,
.reportTable caption + thead tr:first-child td,
.reportTable colgroup + thead tr:first-child th,
.reportTable colgroup + thead tr:first-child td,
.reportTable thead:first-child tr:first-child th,
.reportTable thead:first-child tr:first-child td {
  border-top: 0;
}

.reportTable tbody + tbody {
  border-top: 2px solid #6f6868;
}

.innerReportTable tbody + tbody {
  border-top: 0;
}

.reportTable-vstriped tbody td:nth-of-type(odd),
.reportTable-vstriped thead th:nth-of-type(odd) {
  background-color: #e5e9e9;
}

.reportTable-striped tbody > tr:nth-child(odd) > td,
.reportTable-striped tbody > tr:nth-child(odd) > th {
  background-color: #e5e9e9;
}

.innerReportTable-striped tbody > tr:nth-child(odd) > td,
.innerReportTable-striped tbody > tr:nth-child(odd) > th {
  background-color: transparent;
}

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

/* DB POsts */
.dbPostInput {
    width: 200px;
}

.dbPostInputMsg {
    height: 80px;
    font-size: 12px;
    border:1px solid #cccccc;
    white-space: pre;
    word-wrap: normal;
}

.dbPostCell {
    width: 212px;
    max-width: 212px;
    min-width: 212px;
}

.dbPostPictureCell {
    width: 460px;
    max-width: 460px;
    min-width: 460px;
}

.dbPostIndexCell {
    width: 21px;
    max-width: 21px;
    min-width: 21px;
}

.dbPostCellCollapsed {
    max-width: 40px;
    text-overflow: initial !important;
    overflow: hidden;
}

.dbPostInputMsgCollapsed {
    max-height: 13px;
}

.dbPostCellExpander
{
    margin-left: 3px;
    line-height: 10px !important;
}

.dbPostsTable thead th {
  vertical-align: middle !important;
}

.dbPostDeleted {
    background-color: #F1B5B5;
}

.csvImportButtonWrapper {
    display: inline-block;
    cursor: pointer;
    margin-left: 60px;
}

.csvImportBtn {
    position: absolute;
    cursor: pointer;
}

.csvImportFileInput {
    width: 146px !important;
    opacity: 0;
    font-size: 16px;
    cursor: pointer;
}

/* Instant POsts */
.instantPostContent {
    position: relative;
    left: -100px;
}
.dateTimeInput, .form-control {
    font-size: 16px;
    height: 24px;
}

.textAreaInput {
    width:404px;
    height: 80px;
}

.form-control {
    width: 50px;
}

.postInput {
    height: 20px;
    font-size: 14px;
}

.radioButton {
    font-size: 12px !important;
    line-height: 12px !important;
    padding: 4px 6px !important;
}

.fileInputWrapper {
    display: inline-block;
    height: 27px;
    overflow: hidden;
    position: relative;
    cursor: pointer;
}

.fileInput {
    font-size: 17px;
    width: 77px !important;
    opacity: 0;
    filter: alpha(opacity: 0);
    cursor: pointer;
    position: relative;
}

.fileInputBtn {
    height: 27px;
    position: absolute;
    cursor: pointer;
}

.labelDisabled, .alertDisabled {
    color: #a4a7aa;
}

.alertDisabled {
    background-color: #e1e7ee;
}

.alertInline {
    display: inline-block;
    padding: 0px 5px;
    margin: 0px;
}

.transparentBg {
    background: rgba(0, 0, 0, 0) !important;
}

.fileInfoLabel {
    padding-left: 7px;
    max-width: 250px;
    text-overflow: ellipsis;
    overflow: hidden;
    vertical-align: middle;
}

.sectionRowStart {
    border-top: rgba(111, 114, 118, 0.40) 1px solid;
}

.sectionCellEnd {
    padding-bottom: 10px;
}

.sectionCellStart {
    padding-top: 10px;
}

.removePic {
    margin-left: 5px;
}

.picCellTitle {
    margin-top: 5px;
}

.urlPicRow {
    background-color: rgb(245, 239, 235);
}

.upldPicRow {
    background-color: rgb(250, 250, 250);
}

.picTable {
    width: 100%;
}

.picTable td {
    border-top: none !important;
}

.postContentDiv {
    display: inline-block;
    vertical-align: top;
    padding-right: 10px;
}

/* Post Preview */

/* first num - image index, second num - total images in layout */
/* VK */
.vkImgContainer {
    display: inline-block;
    vertical-align: top;
    overflow: hidden;
}

.vkImgVerticalContainer {
    padding-bottom: 4px;
}

.vkImgContainer2, .vkImg2 {
    max-width: 237px;
    max-height: 300px;
}

.vkImgContainer03 {
    overflow: hidden;
    max-width: 330px;
    max-height: 300px;
}

.vkImg03{
    vertical-align: top;
    overflow: hidden;
    max-width: 330px;
    max-height: 300px;
}

.vkImgContainerWrapper13 {
    overflow: hidden;
    max-width: 144px;
    max-height: 300px;
}

.vkImgContainer13, .vkImg13 {
    overflow: hidden;
    max-width: 144px;
    max-height: 150px;
}

.vkImgContainer14, .vkImg14 {
    overflow: hidden;
    max-width: 144px;
    max-height: 100px;
}

.vkImageContainerWrapper05 {
    max-width: 474px;
    max-height: 210px;
}

.vkImageWrapper05, .vkImg05{
    overflow: hidden;
    max-width: 237px;
    max-height: 210px;
}

.vkImageContainerWrapper25 {
    max-width: 474px;
    max-height: 90px;
    vertical-align: top;
    padding-top: 4px;
}

.vkImageWrapper25, .vkImg25{
    overflow: hidden;
    max-width: 158px;
    max-height: 90px;
}

.vkImageWrapper26, .vkImg26{
    overflow: hidden;
    max-width: 118px;
    max-height: 90px;
}

.vkImageWrapper27, .vkImg27{
    overflow: hidden;
    max-width: 94px;
    max-height: 90px;
}

.vkImageWrapper28, .vkImg28{
    overflow: hidden;
    max-width: 79px;
    max-height: 90px;
}

.twTitle {
    max-height: 1.3em;
    white-space: nowrap;
    font-size: 1em;
    margin: 0 0 .15em;
    font-weight: bold;
    font-family: "Helvetica Neue",Helvetica,Arial,sans-serif;
}

.twDescription {
    font-size: 14px;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
    max-height: 40px;
    -webkit-line-clamp: 2;
}

.twDomain {
    font-size: 14px !important;
    font-family: "Helvetica Neue",Helvetica,Arial,sans-serif;
    margin-top: 0px !important;
    padding-top: 4px
}

.twTitle, .twDescription {
    font-family: "Helvetica Neue",Helvetica,Arial,sans-serif;
    color: black;
}

.masterTab {
    padding: 18px;
    background-color: rgb(255, 255, 255);
}

/* FB 2 photos */

.fbPicsWrapper2 {
    height: 320px;
    overflow: hidden;
    display: block;
}

.fbImage3Column2 {
    display: block;
    width: 480px !important;
    position: absolute;
    left: -120px;
    max-width: unset !important;
}

.fbImage2Column1 {
    display: block;
    width: 100%;
}

.fbImgContainer2_1 {
    height: 50%;
    width: 100%;
    display: block;
    overflow: hidden;
    border: 1px solid rgba(0, 0, 0, .1);
}

/* FB 3 photos */
.fbPicsWrapper3 {
    height: 320px;
    overflow: hidden;
    display: block;
}

.fbPicsWrapper3:after {
    content: "";
    clear: both;
    display: table;
}

.fbImage3Column2 {
    display: block;
    width: 480px !important;
    position: absolute;
    left: -120px;
    max-width: unset !important;
}

.fbImage3Column1 {
    display: block;
    width: 100%;
}

.fbImgContainer3_1 {
    height: 50%;
    width: 100%;
    display: block;
    overflow: hidden;
    border: 1px solid rgba(0, 0, 0, .1);
}

.fbImgContainer3_2 {
    height: 50%;
    width: 100%;
    display: block;
    overflow: hidden;
}

.fbImgContainerColumn2 {
    float: left;
    width: 50%;
    height: 100%;
    overflow: hidden;
    position: relative;
    border: 1px solid rgba(0, 0, 0, .1);
}


/* FB More then 3 photos */
.fbPicsWrapperMore3 {
    height: 320px;
    overflow: hidden;
    display: block;
}

.fbPicsWrapper:after {
    content: "";
    clear: both;
    display: table;
}

.fbImageMore3Column3 {
    display: block;
    width: 320px !important;
    position: absolute;
    left: -80px;
    max-width: unset !important;
}

.fbImageMore3Column1 {
    display: block;
    width: 100%;
}

.fbImgContainerMore3_1 {
    height: 66%;
    width: 100%;
    display: block;
    overflow: hidden;
    border: 1px solid rgba(0, 0, 0, .1);
}

.fbImgContainerMore3_3{
    height: 34%;
    width: 100%;
    display: block;
    overflow: hidden;
}

.fbImgContainerColumn3 {
    float: left;
    width: 33.3%;
    height: 100%;
    overflow: hidden;
    position: relative;
    border: 1px solid rgba(0, 0, 0, .1);
}

.fbMore3Number {
    display: table-cell;
    position: absolute;
    left: 40%;
    top: 40%;
    font-size: 24px;
    color: white;
}

/* Start Page */

.actionBlock {
    margin: 20px;
    width: 600px;
    display: inline-flex;
}

.index
{
    font-size: 28px;
    padding: 7px;
}

.activeIndex {
    font-weight: bold !important;
}

.actionLink {
    font-size: 24px;
}

.actionDescr {
    margin: 5px 0px;
    
}

.footer {
    font-size: 12px;
    padding-top: 3px;
    font-weight: bold;
}

.actionContent
{
    padding: 10px;
}

.firstPending {
    background-color: rgb(234, 174, 161);
}

.pending {
    background-color: rgb(222, 209, 184);
}

.complete {
    background-color: rgb(204, 212, 204);
}

.otherActionBlock {

}

.nextLink {
    padding: 7px;
    font-size: 18px;
}


/* Post Preview */
.checkBlock {
    position: relative;
    display: inline-block;
}

.checkBtn {
    padding-top: 10px;
    padding-bottom: 10px;
}


/* ----------
Calendar
}-----*/

.dailyNum {
    margin-left: 2px;
}

.secondDailyIcon {
    margin-left: 7px;
}

.monthEventParent {
    margin: 5px 3px 5px 3px; 
}

.disabledColor {
    color:  rgb(153, 153, 153);
}

.eventTitle {
   /*  max-width: 400px; */
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    vertical-align: middle;
}

.eventAccount {
    max-width: 256px; 
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    vertical-align: middle;
    margin: 0px 3px 0px 5px;
}

.limitCont {
    max-width: 260px;
}

.eventTime {
    vertical-align: middle;
    margin: 2px;
}

.eventPic {
    margin: 1px 2px;
}

.eventImg {
    width: 23px;
    height: 21px;
    margin: 3px;
}

.eventWrapper {
    display: inline-block;
}

.topAlign {
    vertical-align: top;
}

.eventText {
    max-width: 276px;
    overflow: hidden;
    text-overflow: ellipsis;
}

.eventText {
    max-width: 276px;
    overflow: hidden;
    text-overflow: ellipsis;
}

.glyphicon {
  position: relative;
  top: 1px;
  display: inline-block;
  font-family: 'Glyphicons Halflings';
  font-style: normal;
  font-weight: normal;
  line-height: 1;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.rtl {
    direction: rtl;
}

/* Odnoklassniki */

.media-block.media-link__v2 {
    border: rgba(0, 0, 0, 0.0980392);
    border-style: solid;
    border-width: 1px;
} 
.media-link_cnt {
    padding-left: 16px;
    padding-right: 16px;
    padding-top: 10px;
    padding-bottom: 10px;
}

.media-link_h a {
    color: rgb(51, 51, 51); 
    font-family: Arial, Helvetica, sans-serif;
    font-size: 16px;
}

.media-link_h a:before {
    content: "";
    display: table;
}

.media-link_h a:hover {
    color: rgb(51, 51, 51); 
    font-family: Arial, Helvetica, sans-serif;
    font-size: 16px;
}

.media-link_tx {
    color: rgb(102, 102, 102);
    font-size: 12px;
    margin-top: 8px;
}

.media-link_lk {
    font-size: 12px;
    color: rgb(153, 153, 153);
    margin-top: 8px;
}
.media-link_lk:hover {
    text-decoration: underline
}

.media-block.media-photos {
    margin-top: 8px;
}

.collage_i.image-hover {
    margin-left: 0px;
}

.media-block.media-text {
    color: rgb(51, 51, 51); 
    font-family: Arial, Helvetica, sans-serif;
    font-size: 14px;
    padding-bottom: 8px;
}

.media-block.media-photos {
    padding-left: 16px;
    padding-right: 16px;
}

.collage_cnt.image-hover-2 {
    position: relative;
    float: left;
    width: 50%;
    padding-left: 5px;
}

.collage_cnt.image-hover-3 {
    position: relative;
    float: left;
    width: 33%;
    padding-left: 5px;
}

.collage_cnt.image-hover-4 {
    position: relative;
    width: 50%;
    height: 50%;
    float: left;
    padding-left: 5px;
    padding-bottom: 5px;
}

.collage_cnt.image-hover-5 {
    position: relative;
    width: 50%;
    float: left;
    padding-left: 5px;
    padding-bottom: 5px;
}
.collage_cnt.image-hover-5-3 {
    position: relative;
    width: 33.33%;
    float: left;
    padding-left: 5px;
    padding-bottom: 5px;
}

.updateTblCell {
    font-size:14px;
    padding:5px;
}

.video-gallery-search {
    margin-right:12px; 
    /*position: absolute;*/ 
    /*left: 288px;*/ 
    width: 300px;
}

.video-gallery .vl {
    text-overflow: ellipsis;
    overflow: hidden;
    max-width: 470px;
    white-space: nowrap;
}

.video-thumb img {
    border-style: solid;
    border-width: 1px;
    border-color: white;
    margin-bottom: 2px;
    /*max-width: 300px; 
    max-height: 120px;*/
    max-width: 210px;
    /*height: 120px;*/ 
    float: left;
}

.video-thumb.small img {
    width: 110px;
    height: 64px; 
    float: left;
}

.video-thumb.small.db-posts img {
    width: 110px;
    height: 64px; 
    float: left;
    margin-top: 5px;
    margin-bottom: 5px;
}

.video-thumb img:hover {
    border-color: darkgray;
}

.video-thumb i {
    font-size: xx-large; 
    color: darkgray; 
    position: absolute; 
    left: 82px; 
    top: 68px;
}

.video-thumb.small i {
    font-size: x-large; 
    color: darkgray; 
    position: absolute; 
    left: 53px; 
    top: 18px;
}

.video-thumb-play.small i {
    font-size: x-large;
    color: darkgray;
    position: absolute;
    left: 53px;
    top: 18px;
}

.video-thumb.small.db-posts i {
    top: 23px;
}

.crop-video-thumb {
    width: 210px;
    height: 120px;
    overflow: hidden;
}

.tbl-in-f-1.video > div > div {
    padding-bottom: 0px;
    border-bottom: unset;
}

.ntwIconFix {
    top: 0px;
    padding-bottom: 4px;
    padding-left: 4px;
}

.addAccountBtn {
    float:left;
    position: relative;
    margin: 2px 10px;
}


.mention-item-image {
    width: 20px;
    margin-right: 5px;
}

.narrowIcon {
    padding-left: 7px !important;
}

.primary-clr {
    color: #006ea6;
}

label[disabled] {
    color: #999;
}

.round-video {
    border-radius: 200px;
}

.errorBg {
    background-color: #f2dede !important;
}

.linkDataLabel {
    font-size: 12px;
    color: #222 !important;
}

.linkDataCell, .linkDataLabel {
    padding-left: 12px;
}

.linkDataRow {
    background-color: #eeeeee !important;
}

.remove-pict-db-posts .tscon-cancel-1:before{
    margin-top: 5px;
}


.validation-rule-color0 {
    background-color: #f2dede !important;
}
.validation-rule-color1 {
    background-color: #f2d4c3 !important;
}
.validation-rule-color2 {
    background-color: #e6cef8 !important;
}
.validation-rule-color3 {
    background-color: #fcf4be !important;
}
.validation-rule-color4 {
    background-color: #d8dfff !important;
}
.validation-rule-color5 {
    background-color: #e1faf8 !important;
}

.selected-color {
    border-style: solid;
    border-color: darkgray;
}
.color-palette-item {
    display: block;
    width: 25px;
    height: 25px;
    position: absolute;
    left: 4px;
    top: 3px;
    /*z-index: 10;*/
}

.palette1 {
   max-width: 30px; width: 30px; height: 30px; display: inline-block; margin-top: 2px; padding: 2px;
}

.postImg {
    min-width: 104px;
    height: 104px;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: 50% 50%;
}

.noImgLg {
    background-image: url("../Images/no-image-lg.png");
}

.imgNotFound {
    background-image: url("../Images/image-not-found.png");
}

.contentCell {
    max-width: 640px;
    /* width: 400px; */
    overflow: hidden;
    text-overflow: ellipsis;
    white-space:nowrap;
}


.animate-repeat.ng-move,
.animate-repeat.ng-enter,
.animate-repeat.ng-leave {
    transition: all linear 0.5s;
}

.animate-repeat.ng-leave.ng-leave-active,
.animate-repeat.ng-move,
.animate-repeat.ng-enter {
    opacity: 0;
    max-height: 0;
}

.animate-repeat.ng-leave,
.animate-repeat.ng-move.ng-move-active,
.animate-repeat.ng-enter.ng-enter-active {
    opacity: 1;
    max-height: 30px;
}

@keyframes moved {
    from {
        opacity: 0;
        top: -300px;
    }

    to {
        opacity: 1;
        top: 0px;
    }
}

@keyframes deleted {
    from {
        top: 0;
        opacity: 1;
    }

    to {
        top: 200px;
        opacity: 0;
    }
}

.dynMenuExpanded {
    max-width: 200px !important;
    transition-duration: 0.5s;
    transition-property: width, max-width;
}

.menuExpanded {
    width: 270px;
    transition-duration: 0.5s;
    transition-property: width;
}

.dynMenuCollapsed {
    max-width: 67px !important;
    transition-duration: 0.5s;
    transition-property: width, max-width;
}

.menuCollapsed {
    width: 67px;
    transition-duration: 0.5s;
    transition-property: width;
}

.menuItemExpanded {
    max-width: 200px;
    transition-duration: 0.5s;
    transition-property: max-width;
    text-overflow: ellipsis;
}

.menuItemCollapsed {
    max-width: 50px;
    transition-duration: 0.5s;
    transition-property: max-width;
}

.menuItemExpanded, .menuItemCollapsed {
    white-space: nowrap;
    overflow: hidden;
}

.pageExpanded {
    left: 270px;
}

.pageCollapsed {
    left: 67px;
}

.dynPageExpanded {
    left: 227px;
}

.dynPageCollapsed {
    left: 97px;
}

.pageExpanded, .pageCollapsed, .dynPageExpanded, .dynPageCollapsed {
    position: absolute;
    margin-right: 20px;
    transition-duration: 0.5s;
    transition-property: left;
}

.favIcon {
    font-size: 17px;
    padding: 5px 3px;
    background-color: transparent;
    text-decoration: none;
    color: #777;
}

    .favIcon:hover {
        color: #007cba !important;
        text-decoration: none;
    }

    .favIconActive {
        color: #79d3ff !important;
        text-decoration: none;
    }

.quickStartBtnDefault:hover {
    color: #005a87 !important;
}

.pageTitle {
    padding: 10px 25px !important;
}

/* Quick Start */

.channelsBlock {
    color: #d9534f !important;
}

.channelsBlockBorder {
    border-top-color: #d9534f !important;
}

.channelsBlockBg {
    background-color: #d9534f !important;
}

.channelsBlockLightBg {
    background-color: #fff8f8;
}

.postBlock {
    color: #ed7b10 !important;
}

.postBlockBorder {
    border-top-color: #ed7b10 !important;
}

.postBlockBg {
    background-color: #ed7b10 !important;
}

.postBlockLightBg {
    background-color: #fef6ef !important;
}

.monitorBlock {
    color: #078bcc !important;
}

.monitorBlockBorder {
    border-top-color: #078bcc !important;
}

.monitorBlockBg {
    background-color: #078bcc !important;
}

.monitorBlockLightBg {
    background-color: #f6fcff !important;
}

.automateBlock {
    color: #107807 !important;
}

.automateBlockBorder {
    border-top-color: #107807 !important;
}

.automateBlockBg {
    background-color: #107807 !important;
}

.automateBlockLightBg {
    background-color: #f9fff8 !important;
}

.blockBorder {
    border-top-style: solid !important;
    border-top-width: 3px !important;
}

.itemLink {
    font-weight: 500;
}

.itemContainer {
     /* background-color: #fcf9f1; */
    border: 1px solid #d5d3d3;
    padding: 5px;
    margin-bottom: 5px;
}

.blockCaption {
    font-size: 15px;
    margin-bottom: 10px;
}

/* End of Quick Start*/

.pageDescr {
    font-family: 'roboto', Arial, sans-serif;
    font-size: 14px;
    line-height: 1.42857143;
    margin-left: 20px;
}

.ng-pageslide {
    background: #eee;
}

.sort-bar.routesBarSticky {
    z-index: 2;
    background: #f3f3f4;
    padding-bottom: 10px !important;
    padding-top: 5px !important;
}

.reportsStickyBar {
    right: 0 !important;
    width: auto !important;
    background: #f3f3f4;
    padding-bottom: 10px !important;
    padding-top: 5px !important;
    z-index: 2;
}

.setupViewStickyBar {
    background: #f3f3f4;
    padding-bottom: 14px !important;
    padding-top: 10px !important;
    z-index: 2;
} 

.menuItemSelected {
    background-color: #00a6f8;
    color: #fff !important;
}

.pageHeaderTitle {
    font-size: 14px !important;
    text-decoration: double;
    color: #555555;
    margin-top: 0px;
    padding: 8px 25px !important;
}

.pageHeaderTitle .pageHeaderSpan {
    white-space: nowrap;
    text-overflow: ellipsis;
    max-width: 250px;
    display: inline-block;
    overflow: hidden;
}

.pageTitleLink {
    color: #007cba;
    text-decoration: none;
    vertical-align: middle;
}

    .pageTitleLink:hover {
        text-decoration: none;
        color: #58c6fd;
    }

/* ///// Left Nav ///////////////////////////////*/
.leftNav {
    height: 100%;
    background-color: #41545f;
    position: fixed !important;
    z-index: 1;
    overflow: auto;
}

.leftNavExpanded {
    width: 224px;
    transition-duration: 0.5s;
    transition-property: width;
}

.leftNavCollapsed {
    width: 64px;
    transition-duration: 0.5s;
    transition-property: width;
}

.mainViewShowNav {
    position: absolute;
    top: 104px;
    padding: 12px 0px 0px 10px;
    bottom: 0px;
    right: 0px;
}

.navbar-collapse.expanded {
    padding-left: 10px;
}

.mainViewLeftNavCollapsed {
    left: 65px !important;
}

.mainViewLeftNavExpanded {
    left: 224px !important;
}

.helpLbLeftNavCollapsed, .helpLbLeftNavExpanded {
    top: 7px;
}

.helpLbLeftNavCollapsed {
    right: 97px !important;
}

.helpLbLeftNavExpanded {
    right: 245px !important;
}


.mainViewAnimation {
    transition-duration: 0.5s;
    transition-property: left;
}

.breadcrumbContainer {
    position: fixed;
    top: 65px;
    height: 40px;
    margin-right: 30px;
    background-color: #dce1e4;
    width: 100%;
}

/*.mainView {
    opacity: 1;
}

    .mainView.ng-enter,
    .mainView.ng-leave {
        -webkit-transition: all 1s ease;
        transition: all 1s ease;
    }

    .mainView.ng-enter {
        opacity: 0;
    }

    .mainView.ng-enter-active {
        opacity: 1;
    }

    .mainView.ng-leave {
        opacity: 1;
    }

    .mainView.ng-leave-active {
        opacity: 0;
    }*/

.leftNavGroupTitle {
    font-size: 14px;
    line-height: 1.32;
    text-transform: uppercase;
    font-weight: 800;
    color: #fff;
    cursor: pointer;
    /*width: 186px;*/
    width: 198px;   
}

    .leftNavGroupTitle:hover {
        color: #9aa5aa;
    }
    
.leftNavPagesContainer {
    list-style: none;
    padding-left: 0px;
}

.leftNavPageLink {
    font-size: 14px;
    line-height: 2.02 !important;
    text-decoration: none;
    color: #d9dede !important;
    font-weight: 700;
    /*width: 163px;*/
}

    .leftNavPageLink:hover {
        color: #e45f16 !important;
        text-decoration: none;
    }

.leftNavPageLinkActive {
    color: #58c6fd !important;
    text-decoration: none;
}

.menuItemPageTitle {
    opacity: 1;
}

.animate-show-hide.ng-hide {
    opacity: 0;
}

.animate-show-hide.ng-hide-add,
.animate-show-hide.ng-hide-remove {
    transition: all linear 0.5s;
}

.leftNavMenuCollapsed {
    height: 0px;
    overflow: hidden;
    transition-duration: 0.5s;
    transition-property: height;
}

.leftNavMenuExpanded {
    height: auto;
    transition-duration: 0.5s;
    transition-property: height;
}

.leftNavExpandedMenuItemIcon {
    font-size: 14px !important;
}

.leftNavCollapsedMenuItemIcon {
    font-size: 16px !important;
}

.menuItemsSeparator {
    margin-top: 18px;
}

.leftNavExpander {
    color: #c4ebff;
    text-decoration: none;
    font-size: 28px;
}

    .leftNavExpander:hover {
        color: #edf9ff;
        text-decoration: none;
        font-size: 28px;
    }

.profileSettingsMenuItem {
    font-size: 14px;
    line-height: 1.01 !important;
    text-decoration: none;
    font-weight: 700;
    background-color: #41545f !important;
}

.profileSettingsMenuItemDefault {
    color: #d9dede !important;
} 
    
    .profileSettingsMenuItem:hover {
        color: #e45f16 !important;
        text-decoration: none;
        background-color: #41545f !important;
    }

.homeIcon {
    cursor: pointer;
}

.homeIconLoading {
    color: #d1b764;
}

.homeIcon, .homeIconLoading {
    vertical-align: top;
    padding-top: 2px
}

    .homeIcon:hover {
        color: #e45f16 !important;
    }

.selectedHomeIcon {
    color: #d1b764;
}

.pageRow {
    color: #41545f;
    white-space: nowrap;
}

    .pageRow:hover {
        color: #acacac;
        white-space: nowrap;
    }

    
/* ///// End Left Nav ///////////////////////////////*/

.signleLineAccountTitle {
    padding-top: 6px;
}

.accountPropLabel {
    padding-right: 12px;
}

.emptyContentInfoMsg {
    font-size: 18px;
}

.emptyContentInfoMsgSm {
    font-size: 16px;
    line-height: 2.1;
}

.emptyContentInfoMsg, emptyContentInfoMsgSm {
    color: #615f5f;
}
/* ///// Dynamic Lib setup ///////////////////////////////*/
.modalBodyList {
    max-height: 500px;
    overflow: hidden;
    overflow-y: scroll;
}

.selectionLinkLg {
    font-size: 16px;
}

.selectionLink, .selectionLinkLg {
    text-decoration: none !important;
}

    .selectionLink:hover, .selectionLinkLg:hover {
        text-decoration: none;
    }

.primaryLinkIcon {
    color: #007cba !important;
}

    .primaryLinkIcon:hover {
        color: #084d70 !important;
    }

.loadingTitle {
    margin-top:5px;
}

.sectionTitle {
    color: #287ea7;
}

.iboxSectionTitle {
    background-color: #f8fdff !important;
}

.formatWrapper {
    border: 1px solid #ededed;
    padding: 7px;
    width:89%;
}

    .formatWrapper:hover {
        background-color: #eff9ff;
    }

.setupItemRow {
    padding: 10px 3px 10px;
}

    .setupItemRow:hover {
        background-color: #eff9ff;
    }
    
.setupSectionTitle {
    padding-top: 3px;
    padding-bottom: 7px;
    font-size: 16px;
}

.activeListItem {
    border-left: 5px solid #00a6f8 !important;
    margin-left: -5px;
}

.infoLbl {
    color: #00a6f8 !important;
}

.hiddenpicker {
    border: none !important;
    width: 1px !important;
    height: 0px !important;
    padding: 0px 0px 0px 5px !important;
}

.dataChangeTxtHiglight {
    -webkit-animation: color-change 1s infinite;
    -moz-animation: color-change 1s infinite;
    -o-animation: color-change 1s infinite;
    -ms-animation: color-change 1s infinite;
    animation: color-change 1s infinite;
}

@-webkit-keyframes color-change {
    0% {
        color: #333333;
    }
    25% {
        color: #ad6e39;
    }
    50% {
        color: #e45f16;
    }
    75% {
        color: #ad6e39;
    }
    100% {
        color: #333333;
    }
}

@-moz-keyframes color-change {
    0% {
        color: #333333;
    }

    25% {
        color: #ad6e39;
    }

    50% {
        color: #e45f16;
    }

    75% {
        color: #ad6e39;
    }

    100% {
        color: #333333;
    }
}

@-ms-keyframes color-change {
    0% {
        color: #333333;
    }

    25% {
        color: #ad6e39;
    }

    50% {
        color: #e45f16;
    }

    75% {
        color: #ad6e39;
    }

    100% {
        color: #333333;
    }
}

@-o-keyframes color-change {
    0% {
        color: #333333;
    }

    25% {
        color: #ad6e39;
    }

    50% {
        color: #e45f16;
    }

    75% {
        color: #ad6e39;
    }

    100% {
        color: #333333;
    }
}

@keyframes color-change {
    0% {
        color: #333333;
    }
    25% {
        color: #ad6e39;
    }
    50% {
        color: #e45f16;
    }
    75% {
        color: #ad6e39;
    }
    100% {
        color: #333333;
    }
}

.linkdDataLoading {
    -webkit-animation: bgchange 3s infinite;
    -moz-animation: bgchange 3s infinite;
    -o-animation: bgchange 3s infinite;
    -ms-animation: bgchange 3s infinite;
    animation: bgchange 3s infinite;
}

@-webkit-keyframes bgchange {
    0% {
        background-color: #f3f3f4;
    }

    25% {
        background-color: #eeeeee;
    }

    50% {
        background-color: #dfdfdf;
    }
    75% {
        background-color: #eeeeee;
    }

    100% {
        background-color: #f3f3f4;
    }
}

@-moz-keyframes bgchange {
    0% {
        background-color: #f3f3f4;
    }

    25% {
        background-color: #eeeeee;
    }

    50% {
        background-color: #dfdfdf;
    }

    75% {
        background-color: #eeeeee;
    }

    100% {
        background-color: #f3f3f4;
    }
}

@-ms-keyframes bgchange {
    0% {
        background-color: #f3f3f4;
    }

    25% {
        background-color: #eeeeee;
    }

    50% {
        background-color: #dfdfdf;
    }

    75% {
        background-color: #eeeeee;
    }

    100% {
        background-color: #f3f3f4;
    }
}

@-o-keyframes bgchange {
    0% {
        background-color: #f3f3f4;
    }

    25% {
        background-color: #eeeeee;
    }

    50% {
        background-color: #dfdfdf;
    }

    75% {
        background-color: #eeeeee;
    }

    100% {
        background-color: #f3f3f4;
    }
}

@keyframes bgchange {
    0% {
        background-color: #f3f3f4;
    }

    25% {
        background-color: #eeeeee;
    }

    50% {
        background-color: #dfdfdf;
    }

    75% {
        background-color: #eeeeee;
    }

    100% {
        background-color: #f3f3f4;
    }
}

/*  ///// sources    //// */
.advancedSrcBlock {
    width: 50%;
    margin-right: 35px;
}

.fullWidth {
    width: 100%;
}

.mappingLabel {
    width: 132px;
    overflow:hidden;
    text-overflow:ellipsis;
}

.sourceSettingLabel {
    width: 280px;
}

/* /// Rounded sliders /// */
.switch {
    position: relative;
    display: inline-block;
    width: 36px;
    height: 20px;
}

.switch[disabled] span {
    cursor: not-allowed;
}

.switch.disabled span {
    cursor: not-allowed;
}

.switch input {display:none;}

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

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

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

    input:checked + .slider.danger {
        background-color: #d55c5c;
    }

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

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

.selectedFilter {
    color: #0098e4;
    font-weight: bold;
    margin-left: 3px;
}

.fltOptionRow {
    max-width: 180px;
    overflow: hidden;
    text-overflow: ellipsis;
}

.singleFilterSelection {
    max-width: 90px;
    overflow: hidden;
    text-overflow: ellipsis;
}

.mltFilterSelection {
    max-width: 77px;
    overflow:hidden;
    text-overflow:ellipsis;
}

.clearFilterBtn {
    border: none !important;
    width: 100% !important;
    text-align: left !important;
    padding-left: 7px !important;
}


.list-group-custom > li {
    display: block;
}

.filtersOffset {
    margin-right:7px;
}
/* Rounded sliders */
.slider.round {
    border-radius: 34px;
}

.slider.round:before {
    border-radius: 50%;
}

.sliderPanel {
    width: 100%;
    height: 100%;
    box-shadow: -30px 0 30px -30px rgba(0,0,0,.2);
}

.transformed {
    background-color: #fffcef;
}

.defaultBg {
    background-color: initial;
}

/* Tabs redesign */
.activeTab {
    background-color: #dcdcdc !important;
    color: #00a6f8 !important;
    font-weight: 500;
}

.filledTab {
    border-bottom: 4px solid #107807;
}

.tabIndex {
    border-radius: 50%;
    padding: 1px 7px;
    margin-right: 5px;
    color: #ffffff !important;
    vertical-align: middle;
}

.inactiveIndex {
    background-color: #b1b0b0;
}

.activeIndex {
    background-color: #00a6f8;
}

.tabOverride {
    padding: 7px 13px 4px !important;
    color:#717171;
}

/* Subscriptions and Payments */
.subCell {
    padding:20px !important;
    font-size: 16px;
}

.subRow {
    border-bottom: 3px solid #ffffff !important;
}

.subTableHeaderCell {
    padding-left:20px !important;
}

.topNavAlert {
    position: relative;
    display: inline-block;
    padding: 4px 7px !important;
    margin: 5px 3px 0px 14px !important
}

/* Copied from billing.html */
/* Subscription Wizard */
.block-grid {
    display: flex;
    flex-wrap: wrap;
    flex-direction: row;
    justify-content: center;
    list-style: none;
    padding: 0px;
    margin: 0px -0.9375rem;
}

.plan-container {
    /*max-width: 840px;*/
    margin-left: auto;
    margin-right: auto;
    padding-left: 0.9375rem;
    padding-right: 0.9375rem;
    min-width: 300px;
}

.block-grid-col {
    position: relative;
    min-height: 1px;
    padding-left: 0.9375rem;
    padding-right: 0.9375rem;
    width: 100%;
    z-index: 1;
    margin: 0px 0px 1.5rem;
    max-width: 240px;
}

.plan-card__card-wrapper {
    background-color: rgb(255, 255, 255);
    box-shadow: rgba(0, 0, 0, 0.15) 0px 4px 20px -1px;
    border-radius: 3px;
}

.plan-card-header {
    /*background-color: rgb(51, 51, 51);*/
    background-color: #00a6f8;
    color: rgb(255, 255, 255);
    text-align: center;
    border-top-left-radius: 3px;
    border-top-right-radius: 3px;
    padding: 8px 15px;
    /*min-height: 120px;*/
}

    .plan-card-header.green {
        background-color: #107807;
    }

    .plan-card-header.red {
        background-color: #a94442;
    }

.plan-card-header.orange {
    background-color: #d76316;
}

.plan-card__body {
    font-size: 14px;
    text-align: center;
    border-bottom-left-radius: 3px;
    border-bottom-right-radius: 3px;
    padding-top: 10px;
    padding-left: 15px;
    padding-right: 15px;
    padding-bottom: 15px;
    height: 260px;
}

.plan-card__body .current-plan {
    color: #d76316;
    font-size: 18px;
    font-weight: 700;
    padding-top: 10px;
}

.plan-card__body .current-plan.disabled {
    opacity: 0.5;
}

.plan-card {
    min-height: 100%;
    position: relative;
    /*padding-bottom: 3.425rem;*/
    margin-top: 15px;
}

.plan-card__cost__price {
    font-weight: 600;
    font-size: 16px;
    min-height: 63px;
    color: #555555;
}

.plan-card__plan-info {
    margin-top: 15px;
    margin-bottom: 15px;
    height: 120px;
}

.plan-card__plan-info td{
    text-align: left;
}

.plan-card__plan-info table {
    margin-left: 15px;
}

.plan-card__plan-info td.name {
    width: 136px;
}

.plan-card__plan-info.by-request {
    height: 74px;
}

.plan-card__cost__price .price {
    position: relative;
}

.plan-card__cost__price .price__currency {
    font-size: 20px;
    font-weight: 400;
    top: -20px;
    left: -12px;
    position: absolute;
    color: #555555;
}

.plan-card__cost__price .price__dollar {
    font-size: 42px;
    color: #555555;
}

.plans-header {
    text-align: center;
    /*font-size: 30px;*/
    color: #555555;
    margin-top: 0;
    margin-bottom: 20px;
}

.price-header {
    color: #00a6f9;
    font-size: 16px;
    margin-bottom: 20px;
}

.plan-card__body .select-button {
    width: 150px;
    font-size: 20px;
}

.header-preferred {
    background-color: #e45f16;
}

.center-blue {
    text-align: center;
    color: #00a6f9;
}

.center-red {
    text-align: center;
    color: #d9534f;
}

/*.billing-cycle-container {
    margin-bottom: 15px;
    border-style: solid;
    border-width: 1px;
    border-color: #949a9b;
    padding: 5px;
    padding-left: 10px;
    cursor: pointer;
}*/

/*.billing-cycle-container:hover, .billing-cycle-container.active {
    margin-bottom: 15px;
    border-style: solid;
    border-width: 1px;
    border-color: #00a6f8;
    padding: 5px;
    padding-left: 10px;
    cursor: pointer;
}*/

.-radioButton {
    position: relative;
    box-sizing: border-box;
    padding-bottom: 8px;
    padding-top: 8px;
    line-height: 1.4;
}

.-radioButton.x-inlineMode {
    padding-top: 8px;
    margin-right: 32px;
    display: inline-block;
}

.-radioButton .-radioLabel:before {
    position: absolute;
    top: 50%;
    margin-top: -12px;
    left: 4px;
    width: 20px;
    height: 20px;
    border: 1px solid #949a9b;
    border-radius: 10px;
    vertical-align: middle;
    background-color: #fff;
    content: "";
}

.active .-radioButton .-radioLabel:after {
    position: absolute;
    top: 50%;
    margin-top: -8px;
    margin-left: 12px;
    left: -4px;
    width: 12px;
    height: 12px;
    border-radius: 6px;
    content: "";
    /*background-color: #00aeef;*/
    background-color: #2196F3;
}

.active .-radioButton .-radioLabel:before, .-radioButton .-radioInput:focus + .-radioLabel:before {
    /*border-color: #00aeef;*/
    border-color: #2196F3;
}

.-radioButton .-radioInput {
    position: absolute;
    left: -9999px;
}

.-radioLabel {
    margin-left: 35px;
    font-size: 18px;
}

.cycle-subtitle-label {
    /*font-size: 12px;*/
    margin-left: 5px;
    vertical-align: top;
}

.cycles-container {
    margin-bottom: 20px;
    padding-left: 20px;
    padding-right: 20px;
}

.price-label {
    vertical-align: top;
    margin-left: 5px;
}

.discount-labe {
    vertical-align: top;
    margin-left: 5px;
    padding-left: 5px;
    padding-right: 5px;
    /*background-color: #00a6f9;*/
    background-color: #2196F3;
    color: white;
}

.buy-now-link {
    margin-top: 10px;
    display: block;
}

.subscription-actions-block {
    float: right;
    margin-right: 5px;
    margin-top: 5px;
}

.payment-method-img {
    max-height: 26px;
    position: absolute;
    top: 4px;
}

.billing-table-container {
    display: table;
    width: 100%;
}

.billing-table-cell {
    display: table-cell;
}

label.billing-table-cell {
    width: 25%;
    /*text-align: right;*/
    padding-right: 10px;
    padding-left: 20px;
}

input.billing-table-cell {
    width: 90%;
}

select.billing-table-cell {
    width: 90%;
}

.asterisk {
    color: #d9534f;
}

.current-plan-header {
    height: 20px;
    color: #2196f3;
    text-align: center;
    font-weight: 700;
    margin-bottom: 5px;
}

/*.plan-card__card-wrapper:hover:not(.active) {
    outline-style: solid;
    outline-color: #2196f3;
    outline-width: 2px;
    cursor: pointer;
}*/
/*.plan-card__card-wrapper:hover {
    outline-style: solid;
    outline-color: #2196f3;
    outline-width: 2px;
    cursor: pointer;
}*/
.plan-card__card-wrapper:hover:not(.isNotSelectable) {
    outline-style: solid;
    outline-color: #2196f3;
    outline-width: 2px;
    cursor: pointer;
}

.center-pills {
    display: inline-block;
}

/*.plan-card__card-wrapper.selected:not(.active) {
    outline-style: solid;
    outline-color: #2196f3;
    outline-width: 2px;
    cursor: pointer;
}*/
.plan-card__card-wrapper.selected {
    outline-style: solid;
    outline-color: #2196f3;
    outline-width: 2px;
    cursor: pointer;
}

.plan-bottom-container .header {
    text-align: center;
    margin-bottom: 15px;
    margin-top: 30px;
    font-size: 18px;
}

.plan-bottom-container .body {
    width: 100%;
}

.plan-bottom-container .body table{
    margin: auto;
}

.plan-bottom-container .body .name {
    padding-left: 10px;
}

.font-green {
    color: #107807;
}

.font-red {
    color: #c11616;
}

/* Subscription Wizard, Cycle Tab */
.cycle-container {
    padding-left: 30px;
    padding-right: 30px;
}
.cycle-bottom-container {
    margin-top: 30px;
    margin-bottom: 30px;
    margin-left: auto;
    margin-right: auto;
    width: 655px;
}

.cycle-bottom-container .header {
    font-size: 16px;
}

.cycle-bottom-container .body {
    width: 100%;
}

.cycle-container .block-grid-col {
    position: relative;
    min-height: 1px;
    padding-left: 0.9375rem;
    padding-right: 0.9375rem;
    width: 100%;
    z-index: 1;
    margin: 0px 0px 1.5rem;
    max-width: 280px;
}

.cycle-container .plan-card__plan-info {
    margin-top: 15px;
    margin-bottom: 15px;
    height: 120px;
    font-size: 16px;
}

.cycle-container .plan-card__body .select-button {
    width: 200px;
    font-size: 20px;
}

.cycle-container .plan-card__plan-info .price {
    margin-bottom: 30px;
}

/* Subscription Wizard, Payment Method Tab */
.payment-method-container {
    /*height: 350px;*/
}

.bt-drop-in-wrapper {
    width: 450px;
    padding-right: 10px;
    margin: auto;
}

.billing-address {
    width: 80%;
    margin: auto;
}

.notes-block {
    font-size: 16px;
}

.ui-select-bootstrap .ui-select-choices-row > span {
    color: #64636f !important;
}

.ui-select-bootstrap .ui-select-choices-row.active > span {
    color: #fff !important;
    text-decoration: none;
    outline: 0;
    background-color: #2196f3 !important;
}

.ui-select-bootstrap .ui-select-match-text span {
    color: #64636f !important;
}

.input-out-screen {
    width: 0;
    height: 0;
    position: absolute;
    left: 9000px;
}

.review-body {
    padding-left: 30px;
    padding-right: 30px;
}

.review-body td.name {
    font-size: 16px;
    font-weight: 500;
    width: 250px;
    padding-bottom: 15px;
}

.review-body td.value {
    font-size: 16px;
    padding-bottom: 15px;
}

.review-body td.terms, td.complete-button {
    padding-top: 20px;
}

.payments-body {
    padding-left: 15px;
    padding-right: 15px;
}

.payments-body td.name {
    font-size: 16px;
    font-weight: 500;
    width: 250px;
    padding-bottom: 15px;
    padding-top: 15px;
}

.payments-body td.value {
    font-size: 16px;
    padding-bottom: 15px;
    padding-top: 15px;
    padding-left: 30px;
    width: 400px;
    padding-right: 10px;
}

.payments-body td.edit {
    font-size: 16px;
    padding-bottom: 15px;
    padding-top: 15px;
    vertical-align: top;
    width: 100px;
}

.payments-body table {
    border-bottom-color: lightgray;
    border-collapse: collapse;
    border-width: 1px;
}

.payments-table .border-bottom:not(:last-child) {
    border-bottom-width: 1px;
    border-bottom-style: solid;
}

.payments-table .border-right {
    border-right-width: 1px;
    border-right-style: solid;
    border-right-color: lightgray;
}

.subscriptions-body {
    padding-left: 15px;
    padding-right: 15px;
}

.next-payment-info {
    padding-left: 15px;
    padding-right: 15px;
    margin-bottom: 30px;
}

.next-payment-info td.name {
    font-size: 16px;
    font-weight: 500;
    width: 250px;
    padding-bottom: 10px;
    padding-top: 10px;
    padding-left: 15px;
}

.next-payment-info td.value {
    font-size: 16px;
    padding-left: 30px;
    width: 400px;
    padding-bottom: 10px;
    padding-top: 10px;
}

.next-payment-info td.edit {
    font-size: 16px;
    vertical-align: top;
    width: 100px;
    padding-bottom: 10px;
    padding-top: 10px;
}

.next-payment-info table {
    border-width: 1px;
    border-style: solid;
    border-color: lightgray;
}

.cancel-subscription {
    display: block;
    margin-left: auto;
    width: 127px;
}
.capabilities-table {
    font-size: 16px;
    margin-left: 20px;
}

.capabilities-table .name {
    padding-bottom: 5px;
    width: 170px;
}

.capabilities-table .value {
    padding-bottom: 5px;
}

.no-next-payment {
    padding-bottom: 5px;
    margin-left: 15px;
    margin-right: 15px;
    margin-bottom: 15px;
    border-width: 1px;
    border-style: solid;
    border-color: lightgray;
}

.in-grace-period {
    font-size: 16px;
    padding-left: 15px;
    padding-top: 15px;
    padding-left: 15px;
    background-color: lightsalmon;
    padding-bottom: 15px;
    margin-bottom: 15px;
}

.email-confirmation {
    margin-top: 15px;
}

/*Profile Settings*/
.custom-subscription-edit .limitations {
    margin-top: 15px;
    margin-left: 60px;
    margin-right: auto;
    width: 50%;
}
.custom-subscription-edit .limitation-name {
    width: 145px;
    vertical-align: middle;
    border-bottom: 0;
    white-space: nowrap;
    color: #777777;
    padding-right: 15px;
}

.custom-subscription-edit .limitation-value {
    width: 140px;
    vertical-align: middle;
    border-bottom: 0;
}

/*in place editor  #107807 */
.edit-in-place a.save-changes {
    color: #107807;
    padding-top: 4px;
    padding-bottom: 8px;
    /* margin-bottom: 9px; */
    vertical-align: text-bottom;
    padding-left: 10px;
    font-size: 16px;
}

.edit-in-place input {
    width: 90%;
}

.edit-in-place a.video-name {
    display: inline-block;
}

.edit-in-place.editmode a.video-name {
    display: none;
}

.edit-in-place input, .edit-in-place a.save-changes {
    display: none;
}
.edit-in-place.editmode input, .edit-in-place.editmode a.save-changes {
    display: inline;
}

/*.edit-in-place a.save-changes {
    display: none;
}*/

.prev-icn:hover {
    color: #cee0e3 !important;
}

.drpDnListLabel {
    color: #262626 !important;
}

.drpDnListLabel:hover {
    color: #262626 !important;
    background-color: #f5f5f5;
}

.playFeedItemIcn {
    position: relative;
    bottom: 64px;
    font-size: 24px;
    color: #a9a9a9;
}

.playPostItemIcn {
    position: relative;
    right: 72px;
    font-size: 24px;
    color: #a9a9a9;
}

/* Dashboard*/
.col-bar-dash-main .success {
    color: #107807 !important;
}

.col-bar-dash-main .danger {
    color: #d9534f !important;
}

.col-bar-dash-main .warning {
    color: #f0ad4e !important;
}

.col-bar-dash-main .update-available {
    color: rgb(255, 0, 0);
    font-weight: bold;
}

.col-bar-dash-main .tab-header-active {
    color: #00a6f8 !important;
}

/*Subscriptions tab in Manage*/
.admin-subscriptions tbody {
    display: block;
    height: 530px;
    overflow-y: auto;
}

.admin-subscriptions thead, .admin-subscriptions tbody tr {
    display: table;
    width: 100%;
    table-layout: fixed;
}

.admin-subscriptions thead {
    width: calc( 100% - 1em )
}

.admin-subscriptions .cl-profile {
    width: 200px;
}

.admin-subscriptions .cl-admins {
    width: 200px;
}

.admin-subscriptions .cl-plan {
    width: 150px;
}

.admin-subscriptions .cl-status {
    width: 100px;
}

.admin-subscriptions .cl-start {
    width: 100px;
}

.admin-subscriptions .cl-end {
    width: 200px;
}

.admin-subscriptions .cl-content {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.admin-subscriptions .cl-date {
    width: 100px;
}

.admin-subscriptions .cl-price {
    width: 80px;
}

.admin-subscriptions .cl-period {
    width: 200px;
}

.admin-subscriptions .cl-invoice {
    width: 180px;
}

.postActDiv {
    padding:10px;
    text-align:center;
}

.nrwBtmMrgn {
    margin-bottom: 15px !important;
}

/* User Guide */
.numericList {
    list-style: decimal;
}

.listWrapper {
    line-height: 1.9 !important;
    font-weight:bold;
}

.listItem {
    font-weight: normal !important;
    padding-left: 7px;
}

.listSection {
    background-color: #f8f8ff;
    padding:10px;
}

.listSectionTitle {
    font-size: 18px;
    font-weight: bold;
    color: #329599;
}

.gPageName {
    font-weight: bold !important;
}

.gSecLink {
    font-size: 16px;
}

.gSecLinkSm, .gSecLink {
    font-weight: 500;
}

.gSecName, .gPageName {
    color: #0a6ea0;
}

.gPartTitleClr {
    color: #226586 !important;
}

.gPartTitle {
    font-size: 16px !important;
    font-weight: 500;
    padding-top: 10px;
    padding-right: 5px;
}

.gInlineItmTitle {
   width: 90px;
   padding: 0px !important;
   margin: 0px !important;
}

.gPartTitleSm {
    font-weight: 500;
}

.gField {
    color:#8b048b;
}

.gPart {
    margin-top: 15px;
}

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

.noListStyleSec {
    list-style: none;
    padding-bottom: 5px;
}

.noListStyle {
    list-style: none;
}

.fieldHelpBtn {
    margin-left: 7px;
}

.gNoteIcn {
    line-height: 1.5;
}

.gNote, .gNoteIcn {
    background-color: #faf4e6;
    border: 1px solid #e0c9a6;
    padding: 5px 7px;
}

.gIcnWarn {
    color: #df6d0b;
    font-size: 18px;
    margin-right: 5px;
}

.innerListSec {
    padding: 12px !important;
    margin: 7px 0px !important;
    background-color:#fff;
}

.icnBtnDemo {
    display: inline-block;
    border: 1px solid #adadad;
    padding: 1px 5px;
    margin: 0px 5px;
    background-color: #f5f5f5;
}

.pending-clr {
    color: #f0ad4e;
}

.itemTable {
    padding-left: 0px;
    padding-top: 5px;
    background-color: #e3e0e0;
}

.itemTableRow {
    list-style: none;
    border-bottom: 1px solid #ccc;
}

.itemTableRowName {
    width: 70px;
    margin-left: 7px;
    font-weight: 500;
    color: #090909;
    font-size: 15px;
}

.itemTableHeader {
    font-size: 16px;
    font-weight: 500;
    color: #5c5b5b;
}

.filterRule {
    font-style:italic;
}

.pageImg {
    border: 1px solid #e2dddd;
}

/* End User Guide*/

/*On-screen Guides*/
.closingPopover .popover, .channelsDropdown .popover{
    z-index: 100;
}

.channelsStep .popover {
    top: auto;
}


.guideStep .popover {
    /*height: auto !important;
    width: auto !important;*/
}

.popoverTemplate .popover, 
.channelsStep .popover, 
.instantStep .popover, 
.rssStep .popover, 
.libStep .popover, 
.guideStep .popover, 
.popover {
    background: #d55c5c !important;
    color: #ffffff;
}

.channelsStep .popover, 
.instantStep .popover, 
.libStep .popover, 
.rssStep .popover {
    position: fixed;
    left: 200px !important;
}

.popoverBtn {
    background-color: #ffffff !important;
    display: inline-block !important;
    margin: 0px 7px;
    color: #610202 !important;
    font-weight: 500 !important;
    font-size: 14px !important;
}

.tsPopover {
    width: 280px !important;
    line-height: 1.7;
    padding-top: 5px;
    font-size: 14px !important;
}

.closePopoverBtn {
    padding: 5px;
    border-radius: 50%;
    background-color: #ab5757;
    color: #ecd9d9;
    font-size: 10px;
    position: absolute;
    top: -7px;
    right: -7px;
    border: solid 1px #ae9d9d;
}

.helpBtnLabel {
    background: none !important;
    color: #d9dede !important;
    border: 1px solid #d9dede !important;
    width: 20px !important;
    height: 20px !important;
    line-height: 18px !important;
    margin-bottom: 0px !important;
    vertical-align: middle !important;
    margin-right: 2px !important;
    font-size: 12px !important;
}

.helpBtnLabel.active {
    color: #d55c5c !important;
    border-color: #d55c5c !important;
}

.alertBtnLabel {
    cursor: pointer;
    text-align: center;
    display: inline-block;
    position: relative;
    background: none !important;
    color: #d9dede !important;
    margin-bottom: 0px !important;
    vertical-align: middle !important;
    margin-right: 2px !important;
    font-size: 20px !important;
}

.alertBtnBage {
    font-size: 12px;
    border-radius: 50%;
    background-color: #d55c5c;
    width: 16px;
    height: 16px;
    text-align: center;
    position: absolute !important;
    left: 33px;
    top: 15px;
    border: 1px solid #d9dede !important;
    display: none !important;
    color: white;
}

.alertBtnBage.active {
    display: inline-block !important;
    
}

.alertSeverityLowBackColor {
    background-color: #3c763d;
    display: inline-block !important;
}

.alertSeverityMediumBackColor {
    background-color: #d1b764;
    display: inline-block !important;
}

.alertSeverityHighBackColor {
    background-color: #d55c5c;
    display: inline-block !important;
}

.alertSeverityLowColor {
    color: #3c763d !important;
}

.alertSeverityMediumColor {
    color: #d1b764 !important;
}

.alertSeverityHighColor {
    color: #d55c5c !important;
}

.alertMenuLink {
    /*padding-left: 12px;*/
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.alertModalHeaderHigh {
    background-color: #ffd9d9;
}

.alertModalHeaderMedium {
    background-color: #fff3cc;
}

.alertModalHeaderLow {
    background-color: #cae6cb;
}

.archivedAlertMessageTitle {
    margin-top: 5px;
}

.archivedAlertMessageBody {
    padding-left: 10px;
    padding-right: 10px;
    padding-bottom: 10px;
    padding-top: 10px;
    /*background-color: #b8def3;*/
    margin-top: 10px;
    border-radius: 4px;
}
/*.channelsStep .popover {
    top: 680px !important;
}

.instantStep .popover {
    top: 70px !important;
}

.libStep .popover {
    top: 390px !important;
}*/
/*.channelsStep .popover.right .arrow:after, 
.instantStep .popover.right .arrow:after,
.rssStep .popover.right .arrow:after, 
.libStep .popover.right .arrow:after, 
.guideStep .popover.right .arrow:after,
.popover.right .arrow:after {
    border-right-color: #d55c5c !important;
}

.guideStep .popover.left .arrow:after, 
.popover.left .arrow:after {
    border-left-color: #d55c5c !important;
}*/
.popover.right .arrow:after {
    border-right-color: #d55c5c !important;
}

.popover.left .arrow:after {
    border-left-color: #d55c5c !important;
}

.popover.bottom .arrow:after {
    border-bottom-color: #d55c5c !important;
}

.popover.top .arrow:after {
    border-top-color: #d55c5c !important;
}

/*.guideStep .popover.bottom .arrow:after, .popover.bottom .arrow:after {
    border-bottom-color: #d55c5c !important;
}*/

.popover-delimeter {
    margin-top: 5px;
    margin-bottom: 0px;
    border: 0;
    border-top: 1px solid #e5e5e5;
}

.popover-delimeter-outer {
    text-align: center;
    height: 10px;
}

.popover-delimeter-inner {
    margin: auto;
    display: inline-block;
    padding-left: 10px;
    padding-right: 10px;
    background-color: #d55c5c;
    position: relative;
    top: -11px;
}


/*Help menu*/
.help-menu a.active {
    color: #58c6fd !important;
    text-decoration: none;
}

.help-menu-slider .slider-caption {
    color: #d9dede;
}

.help-menu-slider .slider-caption:hover {
    color: #e45f16 !important;
    text-decoration: none;
    background-color: #41545f !important;
}

.roleDescriptionCell {
    color: #64636f;
    vertical-align: top;
    padding-left: 20px;
    padding-bottom: 12px;
    padding-top: 12px;
}

.roleNameCell {
    white-space: nowrap;
    font-weight: 600;
    /*padding-bottom: 10px;*/
    padding-top: 12px;
}

.roleRow {
    border-bottom: 1px solid #e7eaec;
}

.rolesBody :last-child {
    border-bottom: 0px !important;
}

.rolesBody :first-child .roleDescriptionCell {
    padding-top: 0px;
}

.rolesBody :first-child .roleNameCell {
    padding-top: 0px;
}

/**
 * The dnd-list should always have a min-height,
 * otherwise you can't drop to it once it's empty
 */
.tranList ul[dnd-list] {
    min-height: 42px;
    padding-left: 0px;
}

    /**
 * The dndDraggingSource class will be applied to
 * the source element of a drag operation. It makes
 * sense to hide it to give the user the feeling
 * that he's actually moving it.
 */
    .tranList ul[dnd-list] .dndDraggingSource {
        display: none;
    }

    /**
 * An element with .dndPlaceholder class will be
 * added to the dnd-list while the user is dragging
 * over it.
 */
    .tranList ul[dnd-list] .dndPlaceholder {
        background-color: #ddd;
        display: block;
        min-height: 42px;
        text-decoration:none;
    }

    .tranList ul[dnd-list] li {
        background-color: #fff;
        border: 1px solid #ddd;
        border-top-right-radius: 4px;
        border-top-left-radius: 4px;
        display: block;
        padding: 10px 15px;
        margin-bottom: -1px;
        text-decoration: none;
    }

        /**
 * Show selected elements in green
 */
        .tranList ul[dnd-list] li.selected {
            background-color: #dff0d8;
            color: #3c763d;
        }



/***************************** Dropzone Styling *****************************/

/**
 * The dnd-list should always have a min-height,
 * otherwise you can't drop to it once it's empty
 */
.tranExpSection .dropzone ul[dnd-list] {
    min-height: 42px;
    margin: 0px;
    padding-left: 0px;
}

.tranExpSection .dropzone .dropElem {
    display: block;
    border: 1px solid #efecec;
}

/**
 * Reduce opacity of elements during the drag operation. This allows the user
 * to see where he is dropping his element, even if the element is huge. The
 * .dndDragging class is automatically set during the drag operation.
 */
.tranExpSection .dropzone .dndDragging {
    opacity: 0.7;
}

/**
 * The dndDraggingSource class will be applied to the source element of a drag
 * operation.
 */
.tranExpSection .dropzone .dndDraggingSource {
    opacity: 0.5;
}

/**
 * An element with .dndPlaceholder class will be added as child of the dnd-list
 * while the user is dragging over it.
 */
.tranExpSection .dropzone .dndPlaceholder {
    background-color: #c5c5c5 !important;
    display: block;
    min-height: 100px;
}

/***************************** Element type specific styles *****************************/

.tranExpSection .dropzone .itemlist > li {
    border: none;
    float: left;
    margin: 5px;
    list-style-type: none;
}

.tranExpSection {
    border: 1px solid #c0c2c4;
    background-color: #e0e0e0;
}

    .tranExpSection .dropzone .container-element {
        margin: 3px;
    }

.expBlockBtn {
    webkit-box-shadow: 0 2px 7px rgba(0, 0, 0, 0.2);
    box-shadow: 0 2px 7px rgba(0, 0, 0, 0.2);
}

    .expBlockBtn, .tranExpSection .dropzone .itemlist > li, .addBlockBtn {
        width: 170px;
    }

.addBlockBtn {
    font-size: 50px !important;
    color: #acc8d5 !important;
    padding: 0px !important;
    background-color: #fafbfb !important;
    text-align: center !important;
    vertical-align: middle !important;
}

    .addBlockBtn:hover {
        color: #68a8c8 !important;
        background-color: #f7fbfd !important;
    }

.closeTranBlockBtn {
    padding: 5px;
    border-radius: 50%;
    background-color: white;
    font-size: 10px;
    position: absolute;
    top: -5px;
    right: -5px;
    border: solid 1px #e3e3e3;
}

    .closeTranBlockBtn:hover {
        color: #a9b4aa;
    }

    .expEditBlockLabel {
        width: 120px;
        vertical-align: middle;
        float: left;
    }

.addBlockBtn, .textParamBtn, .fieldParamBtn, .srcParamBtn, .tranExpSection .dropzone .itemlist > li {
    height: 100px;
}

.textParamBtn {
    background-color: white !important;
    border-color: #d2d1d1 !important;
    color: #0a425e !important;
    text-align: left !important;
}

.textParamBtn:hover {
    background-color: #f9f9f9 !important;
}

.fieldParamBtn {
    background-color: #faf6fa !important;
    border-color: #dcd6e0 !important;
    color: #0a425e !important;
}

.fieldParamBtn:hover {
    background-color: #fbf3fb !important;
}

.srcParamBtn {
    background-color: #f6fbfe !important;
    border-color: #c7d2d8 !important;
    color: #0a425e !important;
}

.srcParamBtn:hover {
    background-color: #f2fbff !important;
}

.innerParamDiv {
    color: #737373 !important;
    overflow: hidden;
    max-width: 168px;
    max-height: 99px;
    text-overflow: ellipsis;
    margin-top: -18px;
    padding-right: 5px;
    padding-left: 5px;
    padding-bottom: 6px;
    padding-top: 4px;
}

.transformationBlockHeader {
    display: block;
    width: 100%;
    background-color: #cee9f7;
    text-align: center;
    position: relative;
}

.transformationBlockHeader i{
    position: absolute; 
    left: 148px; 
    font-size: 13px;
}

/* New Transformations*/

.transformationInvalidRow {
    border: #d9534f solid 1px !important;
}

.transformationEmptyStringRow {
    height: 64px;
}

.transformationEmptyStringRow .transformationRow {
    display: none;
}

.transformationEmptyStringRow .container-element {
    display: none;
}

.transformationEmptyStringHeader {
    padding-top: 16px;
    padding-left: 20px;
    color: #ae01a9;
    font-size: 16px;
    display: none;
}

.transformationEmptyStringRow .transformationEmptyStringHeader {
    display: block;
}

.transformationButtonAdd {
    width: 80px;
    margin-top: 1px;
}

.transformationButtonAdd .tranAddBtn {
    padding: 0;
    margin-top: 31px;
}

.transformationButtonAdd .tranAddBtnIcon {
    border-radius: 3px;
    margin: 0;
    font-size: 22px;
    border: solid 1px;
}

.transformationRow {
    vertical-align: top;
    padding: 3px 0px 0px 3px;
    color: #747474;
    float: left;
}

.transformationHideButton {
    display: none !important;
}

.transformationButtonAddRowBeforeCntr {
    position: absolute;
    top: -14px;
    right: -14px;
}


.transformationButtonAddRowBefore {
    background-color: rgb(181, 215, 232) !important;
    border-radius: 50% !important;
    padding: 0 !important;
    font-size: 16px !important;
}

.transformationButtonAddRowBefore:hover {
    transform: scale(1.3);
}

.transformationButtonRemoveRowCntr {
    position: absolute;
    top: calc(50% - 13px);
    right: -14px;
}

.transformationButtonRemoveRow {
    background-color: rgb(181, 215, 232) !important;
    border-radius: 50% !important;
    padding: 0 !important;
    font-size: 16px !important;
}

.transformationButtonRemoveRow:hover {
    transform: scale(1.3);
}

.transformationButtonAddRowAfterCntr {
    position: absolute;
    bottom: -13px;
    right: -14px;
    z-index: 1;
}

.transformationButtonAddRowAfter {
    background-color: rgb(181, 215, 232) !important;
    border-radius: 50% !important;
    padding: 0 !important;
    font-size: 16px !important;
}

.transformationButtonAddRowAfter:hover {
    transform: scale(1.3);
}

.srcBlockTitle, .fieldTypeBlockTitle {
    display: inline-block;
    width: 100%;
    text-align: center;
}

.fieldTypeBlockTitle {
    color: #a901a9;
    font-size: 16px;
    font-weight: 500;
    margin-bottom: 5px;
}

.blockSettings {
    font-size: 11px;
    color: #737373;
}

.removeBlockIcn {
    margin-top: -7px;
    margin-right: -12px;
    padding: 4px;
    font-size: 13px;
    position: relative;
}

.emptyIconPlaceholder {
    margin-left: 20px;
}

.errorFieldSelector {
    border:#a94442 solid 1px;
}

.specialNonPrintableSymbol {
    color: #68a8c8
}

/* Analytics page */
/* Overview tab*/
.socialChannelsHeader {
    padding-bottom: 5px;
}

.socialChannelsCell {
    padding-right: 10px;
    padding-top: 5px;
    padding-bottom: 5px;
    min-width: 120px;
    border-bottom: #e7eaec solid 1px;
}

.socialChannelsCellProfile {
    min-width: 200px;
}

.socialChannelsTableContainer {
    max-height: 300px;
    overflow-y: auto;
}

.socialChannelsTable {
    width: 100%;
}

.performanceHeader {
    font-weight: bold;
    margin-bottom: 5px;
}

.overviewPerformanceSeparator {
    border-bottom: #e7eaec solid 1px;
}

.performanceBody {
}

.chartContainer {
    min-height: 300px;
}

.analyticsMovementDirection {
    font-size: 10px;
    vertical-align: middle;
    margin-right: -2px;
}

.routesAnalyticsBodyName {
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
}

.routesAnalyticsContainer {
    overflow-y: auto;
    max-height: 250px;
    width: 100%;
}

/* Posts Analytics tab*/
.nopadding {
    padding: 0 !important;
    margin: 0 !important;
}

.postBreakdownContainer {
    /*margin-right: 15px;*/
    margin-bottom: 5px;
    margin-top: 5px;
    display: block;
    height: 150px;
    border: #e7eaec solid 1px;
    padding-right: 15px;
}

.postBreakdownPostPicture {
    min-width: 150px;
    height: 148px;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: 50% 50%;
}

.postBreakdownPostPicture .playIcon {
    position: relative;
    bottom: 100px;
    font-size: 45px;
    color: #a9a9a9;
    left: 43px;
}

/*.postBreakdownPostPicture img {
    max-width: 150px;
    height: 100%;
}*/

.postBreakdownAnalyticHeader {
    font-weight: bold;
    margin-bottom: 5px;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.postBreakdownPublishTime {
    font-weight: bold;
    padding-top: 10px;
    padding-bottom: 10px;
}

.postBreakdownMessage {
    margin-bottom: 5px;
    word-break: break-word;
    -webkit-line-clamp: 2;
    min-height: 34px;
}

.postBreakdownLink {
    /*-webkit-line-clamp: 2;*/
    -webkit-line-clamp: 1 !important;
    margin-bottom: 10px;
}

.postBreakdownAnalyticsContainer {
    /*position: relative;*/
}

.iboxContentNotAvailable {
    text-align: center;
}

/*.nvd3 text {
    font: normal 10px sans-serif !important;
}
.nvd3 .title {
    font: normal 10px sans-serif !important;
}
.nvtooltip {
    font-family: sans-serif !important;
}*/

/* Sign Up*/
.signupCheckBox {
    display: inline-block;
    vertical-align: middle;
    margin-bottom: 2px;
    cursor: pointer;
}

/* UserAccount */
.controlDivider {
    width: 100%;
    height: 1px;
    border-bottom: 1px solid #e7eaec;
    margin-bottom: 15px;
    margin-top: 30px;
}

.useraccount-insights tbody {
    display: block;
    height: 530px;
    overflow-y: auto;
}

.useraccount-insights thead, .useraccount-insights tbody tr {
    display: table;
    width: 100%;
    table-layout: fixed;
}

.useraccount-insights thead {
    width: calc( 100% - 1em )
}

.useraccount-insights .cl-profile {
    width: 200px;
}

.useraccount-insights .cl-network {
    width: 70px;
}

.useraccount-insights .cl-channel {
    width: 250px;
}

.useraccount-insights .cl-posts {
    width: 50px;
}

/*.useraccount-insights .cl-start {
    width: 100px;
}

.useraccount-insights .cl-end {
    width: 200px;
}*/

/*.useraccount-insights .cl-content {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.useraccount-insights .cl-date {
    width: 100px;
}

.useraccount-insights .cl-price {
    width: 80px;
}

.useraccount-insights .cl-period {
    width: 200px;
}

.useraccount-insights .cl-invoice {
    width: 180px;
}*/

/* Media Gallery */
/* grid view */

.media-gallery-grid-row {
    display: flex;
    flex-wrap: wrap;
    padding: 0 4px;
}

/* Create four equal columns that sits next to each other */
.media-gallery-grid-column {
    flex: 25%;
    max-width: 25%;
    padding: 0 4px;
}

.media-gallery-grid-column img {
    margin-top: 8px;
    vertical-align: middle;
    width: 100%;
}

/* Responsive layout - makes a two column-layout instead of four columns */
@media screen and (max-width: 800px) {
    .media-gallery-grid-column {
        flex: 50%;
        max-width: 50%;
    }
}

/* Responsive layout - makes the two columns stack on top of each other instead of next to each other */
@media screen and (max-width: 600px) {
    .media-gallery-grid-column {
        flex: 100%;
        max-width: 100%;
    }
}
/* Media gallery grid view*/
.media-gallery-container {
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    flex-wrap: wrap;
    /*background-color: #fff;*/
    position: relative;
    border-collapse: collapse;
    width: 100%;
    line-height: 1.15;
    /*height: 800px;*/
}

.media-gallery-container .media-item {
    flex: 150px;
    /*width: 150px;*/
    max-width: 150px;
    height: 150px;
    overflow: hidden;
    text-align: center;
    margin: 3px;
}

.media-gallery-container .media-item .image {
    /*min-width: 104px;
    height: 104px;*/
    width: 150px;
    height: 150px;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: 50% 50%;
    position: relative;
}

.media-gallery-container .media-item .image:hover {
    border: 2px solid #00a6f8;
    cursor: pointer;
}

.media-gallery-container .media-item .image .image-cover {
    display: none;

}

.media-gallery-container .media-item .image:hover .image-cover,
.media-gallery-container .media-item.active .image-cover {
    position: absolute;
    width: 144px;
    height: 144px;
    /*background-color: #FFFAC0;*/
    /*background-color: yellow;*/
    top: 0px;
    left: 0px;
    opacity: 0.3;
    display: block;
}

.media-gallery-container .media-item .image-uploading {
    width: 150px;
    height: 150px;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: 50% 50%;
    position: relative;
    background-color: gray;
    padding: 20px;
}

.media-gallery-container .image-uploading .image-uploading-label {
    position: absolute;
    width: 50px;
    height: 50px;
    top: 66px;
    left: 54px;
    display: block;
    font-size: 14px;
    color: white;
    text-align: center;
    vertical-align: middle;
}

.media-gallery-container .media-item .image-selected {
    display: none;
}

.media-gallery-container .media-item .image-download {
    display: none;
}

.media-gallery-container .media-item.active .image-selected {
    position: absolute;
    left: 114px;
    top: 114px;
    font-size: 25px;
    color: white;
    background-color: #00a6f8;
    border-radius: 50%;
    width: 27px;
    margin: 0px;
    padding: 0px;
    vertical-align: center;
    height: 27px;
    display: block;
}

.media-gallery-container .media-item .image:hover .image-download {
    position: absolute;
    left: 4px;
    top: 4px;
    font-size: 16px;
    color: white;
    background-color: #00a6f8;
    width: 30px;
    margin: 0px;
    padding: 0px;
    vertical-align: center;
    height: 30px;
    display: block;
}

.media-gallery-container .media-item.active .image-selected i {
    position: absolute;
    top: -1px;
    left: 1px;
}

.media-gallery-container .media-item.active .image-selected i:before {
    margin: 0px !important;
}

.media-gallery-container .media-item .image:hover .image-download i:before {
    margin-top: 7px !important;
}

    .gallery-list-image {
        width: 200px;
        height: 200px;
        background-size: cover;
        background-repeat: no-repeat;
        background-position: 50% 50%;
        position: relative;
    }

.media-selector-list-image {
    width: 110px;
    height: 88px;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: 50% 50%;
    position: relative;
}

/* Media Selector Dialog grid view */
.media-selector-container {
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    flex-wrap: wrap;
    /*background-color: #fff;*/
    position: relative;
    border-collapse: collapse;
    width: 100%;
    line-height: 1.15;
    /*height: 800px;*/
}

.media-selector-container .media-item {
    flex: 130px;
    max-width: 131px;
    height: 123px;
    overflow: hidden;
    text-align: center;
    margin: 3px;
}

.media-selector-container .media-item .image {
    width: 130px;
    height: 123px;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: 50% 50%;
    position: relative;
}

.media-selector-container .media-item .image:hover,
.media-selector-container .media-item.active .image {
    border: 3px solid #52a3fb;
    cursor: pointer;
}

.media-selector-container .media-item .image .image-cover {
    display: none;

}

.media-selector-container .media-item .image:hover .image-cover,
.media-selector-container .media-item.active .image-cover {
    position: absolute;
    width: 144px;
    height: 144px;
    /*background-color: #FFFAC0;*/
    background-color: yellow;
    top: 0px;
    left: 0px;
    opacity: 0.3;
    display: block;
}

.media-selector-container .media-item .image-uploading {
    width: 130px;
    height: 123px;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: 50% 50%;
    position: relative;
    background-color: gray;
    padding: 20px;
}

/* New FB post preview*/
.fb-preview-container {

}

/* Link Message */
.fb-preview-message-container {
    padding-left: 16px;
    padding-bottom: 16px;
    padding-right: 16px;
    padding-top: 4px;
}

.fb-preview-message-container .box-1 {
    flex-direction: column;
    margin-bottom: -5px;
    margin-top: -5px;
    display: flex;
}

.fb-preview-message-container .box-2 {
    margin-bottom: 5px;
    margin-top: 5px;
}

.fb-preview-message-container .box-3 {
    word-break: break-word;
    color: #050505;
    font-weight: normal;
    /*font-size: .9375rem;*/
    text-align: left;
    min-width: 0;
    max-width: 100%;
    word-wrap: break-word;
    display: block;
    line-height: 1.3333;
}

.fb-preview-message-container .box-3:before {
    display: block;
    content: "";
    margin-top: -5px;
    height: 0;
}

.fb-preview-message-container .box-4 {
    margin-bottom: 0;
    margin-top: 0;
    white-space: pre-wrap;
    margin-left: 0;
    margin-right: 0;
    word-wrap: break-word;
    font-size: 15px !important;
}

.fb-shared-header {
    border-color: rgb(206, 208, 212);
    border-width: 1px;
    border-left-style: solid;
    border-right-style: solid;
    border-top-style: solid;
    border-top-left-radius: 8px;
    border-top-right-radius: 8px;
    /*margin-left: 16px;
    margin-right: 16px;*/
    padding-top: 10px;
    padding-left: 12px;
    padding-right: 12px;
}

.fb-shared-footer {
    border-color: rgb(206, 208, 212);
    border-width: 1px;
    border-left-style: solid;
    border-right-style: solid;
    border-bottom-style: solid;
    border-bottom-left-radius: 8px;
    border-bottom-right-radius: 8px;
    margin-left: 16px;
    margin-right: 16px;
    padding-top: 10px;
    padding-left: 12px;
    padding-right: 12px;
}

/*FB Link image */
.fb-preview-link-image {
    position: relative;
}

.fb-preview-link-image .box-1 {
    position: relative;
    background-color: #f0f2f5
}

.fb-preview-link-image .box-2 {
    overflow-y: hidden;
    line-height: 0;
    overflow-x: hidden;
    position: relative;
    display: flex;
}

.fb-preview-link-image .box-3 {
    padding-right: 0;
    box-sizing: border-box;
    padding-bottom: 0;
    margin-bottom: 0;
    -webkit-tap-highlight-color: transparent;
    cursor: pointer;
    display: inline;
    margin-top: 0;
    width: 100%;
    padding-top: 0;
    text-align: inherit;
    margin-left: 0;
    color: inherit;
    background-color: transparent;
    touch-action: manipulation;
    height: 100%;
    margin-right: 0;
    padding-left: 0;
    border-left: 0;
    border-top: 0;
    border-right: 0;
    border-bottom: 0;
    list-style: none;
    outline: none;
    text-decoration: none;

    }

.fb-preview-link-image .box-4 {
    overflow-y: hidden;
    overflow-x: hidden;
    position: relative;
    width: 100%;
    display: flex;
    /*background-color: var(--card-background);*/
    flex-direction: column;
    align-items: center;
}

.fb-preview-link-image .box-5 {
    -webkit-tap-highlight-color: transparent;
    cursor: pointer;
    text-align: inherit;
    color: inherit;
    list-style: none;
    text-decoration: none;
}

.fb-preview-link-image .box-6 {
        position: absolute;
        top: 0;
    }

.fb-preview-link-image .box-7 {
    position: absolute;
    right: 0;
    top: 0;
    width: 100%;
    left: 0;
    bottom: 0;
    height: 100%;
    object-fit: cover;
    border: 0;
}

.fb-preview-link-image .box-8 {
    box-sizing: border-box;
    position: absolute;
    right: 0;
    top: 0;
    left: 0;
    bottom: 0;
    pointer-events: none;
    border-top: 1px solid rgba(0,0,0,0.1);
    border-bottom: 1px solid rgba(0,0,0,0.1);
}

/* FB Link description */

.fb-preview-link-description {
    overflow-y: hidden;
    overflow-x: hidden;
    font-family: inherit;
}

.fb-preview-link-description .box-1 {
    position: relative;
}

.fb-preview-link-description .box-2 {
    padding-right: 0;
    box-sizing: border-box;
    padding-bottom: 0;
    margin-bottom: 0;
    -webkit-tap-highlight-color: transparent;
    cursor: pointer;
    margin-top: 0;
    padding-top: 0;
    text-align: inherit;
    margin-left: 0;
    color: inherit;
    background-color: transparent;
    touch-action: manipulation;
    margin-right: 0;
    padding-left: 0;
    display: block;
    border-left: 0;
    border-top: 0;
    border-right: 0;
    border-bottom: 0;
    list-style: none;
    outline: none;
    text-decoration: none;
}

.fb-preview-link-description .box-3 {
    position: relative;
    background-color: #f0f2f5;
    border-bottom: 1px solid #CED0D4;
}

.fb-preview-link-description .box-5 {
    box-sizing: border-box;
    padding-top: 12px;
    flex-shrink: 0;
    flex-wrap: nowrap;
    margin-left: -6px;
    position: relative;
    display: flex;
    justify-content: space-between;
    padding-right: 16px;
    padding-bottom: 12px;
    z-index: 0;
    padding-left: 16px;
    flex-direction: row;
    align-items: center;
    margin-right: -6px;
}

.fb-preview-link-description .box-6 {
    box-sizing: border-box;
    flex-basis: 0px;
    padding-left: 6px;
    padding-right: 6px;
    position: relative;
    min-width: 0;
    flex-shrink: 1;
    z-index: 0;
    max-width: 100%;
    flex-grow: 1;
}

.fb-preview-link-description .box-7 {
       text-transform: uppercase;
        margin-bottom: 8px;
}

    .fb-preview-link-description .box-8 {
        word-break: break-word;
        color: #65676B;
        font-family: "Segoe UI Historic", "Segoe UI", Helvetica, Arial, sans-serif; 
        font-weight: normal;
        line-height: 1.2308;
        min-width: 0;
        font-size: .8125em;
        max-width: 100%;
        word-wrap: break-word;
        display: block;
    }

.fb-preview-link-description .box-8:before {
    display: block;
    content: "";
    margin-top: -4px;
    height: 0;
}

.fb-preview-link-description .box-9 {
    overflow-y: hidden;
    padding-bottom: 1px;
    overflow-x: hidden;
    text-overflow: ellipsis;
    position: relative;
    white-space: nowrap;
    display: block;
}

/*.fb-preview-link-description .box-9:after {
    display: block;
    margin-bottom: -4px;
    content: "";
    height: 0;
}*/

.fb-preview-link-description .box-10 {
    overflow-y: hidden;
    box-sizing: border-box;
    /*max-height: calc(1em * (20/17) * 2);*/
    overflow-x: hidden;
    margin-top: -4px;
    margin-bottom: -4px;
    padding-top: 4px;
    padding-bottom: 4px;
    font-size: 1.0625em;
}

.fb-preview-link-description .box-11 {
    display: flex;
    margin-top: -5px;
    margin-bottom: -5px;
    flex-direction: column;
}

.fb-preview-link-description .box-12 {
    margin-bottom: 5px;
    margin-top: 5px;
}

    .fb-preview-link-description .box-13 {
        word-break: break-word;
        color: #050505;
        font-weight: 600;
        font-family: "Segoe UI Historic", "Segoe UI", Helvetica, Arial, sans-serif;
        text-align: left;
        min-width: 0;
        line-height: 1.1765;
        max-width: 100%;
        word-wrap: break-word;
        display: block;
        font-size: 1.0625em;
    }

.fb-preview-link-description .box-13:before {
    display: block;
    content: "";
    margin-top: -5px;
    height: 0;
}

.fb-preview-link-description .box-14 {
    overflow-y: hidden;
    padding-bottom: 1px;
    overflow-x: hidden;
    position: relative;
    display: block;
}

/*.fb-preview-link-description .box-14:after {
    display: block;
    margin-bottom: -4px;
    content: "";
    height: 0;
}*/

    .fb-preview-link-description .box-15 {
        word-break: break-word;
        color: #65676B;
        font-family: "Segoe UI Historic", "Segoe UI", Helvetica, Arial, sans-serif;
        font-weight: normal;
        font-size: .9375em;
        text-align: left;
        min-width: 0;
        max-width: 100%;
        word-wrap: break-word;
        display: block;
        line-height: 1.3333;
    }

.fb-preview-link-description .box-15:before {
    display: block;
    content: "";
    margin-top: -5px;
    height: 0;
}

.fb-preview-link-description .box-16 {
    overflow-y: hidden;
    overflow-x: hidden;
    text-overflow: ellipsis;
    position: relative;
    white-space: nowrap;
    display: block;
}

.fb-preview-link-description .box-17 {
    box-sizing: border-box;
    flex-shrink: 0;
    padding-left: 6px;
    padding-right: 6px;
    position: relative;
    display: flex;
    min-width: 0;
    z-index: 0;
    max-width: 100%;
    flex-direction: column;
}

/* FB 2 images*/
.fb-preview-link-image-2 {
    position: relative;
}

.fb-preview-link-image-2 .box-1{
    position: relative;
}

.fb-preview-link-image-2 .box-2 {
    overflow-y: hidden;
    position: absolute;
    overflow-x: hidden;
}

.fb-preview-link-image-2 .box-3 {
    min-height: 0;
    padding-right: 0;
    box-sizing: border-box;
    padding-bottom: 0;
    display: inline-block;
    position: absolute;
    flex-shrink: 0;
    margin-bottom: 0;
    -webkit-tap-highlight-color: transparent;
    cursor: pointer;
    right: 0;
    flex-basis: auto;
    margin-top: 0;
    top: 0;
    padding-top: 0;
    left: 0;
    text-align: inherit;
    bottom: 0;
    min-width: 0;
    margin-left: 0;
    align-items: stretch;
    background-color: transparent;
    touch-action: manipulation;
    z-index: 0;
    margin-right: 0;
    flex-direction: row;
    -webkit-user-select: none;
    padding-left: 0;
    border-right-color: rgba(0,0,0,0.4);
    border-left-width: 0;
    border-bottom-style: solid;
    border-top-width: 0;
    border-bottom-color: rgba(0,0,0,0.4);
    border-left-color: rgba(0,0,0,0.4);
    border-right-width: 0;
    border-top-color: rgba(0,0,0,0.4);
    border-left-style: solid;
    border-top-style: solid;
    border-right-style: solid;
    border-bottom-width: 0;
    list-style: none;
    outline: none;
    text-decoration: none;
}

.fb-preview-link-image-2 .box-4 {
    overflow-y: hidden;
    overflow-x: hidden;
}

.fb-preview-link-image-2 .box-5 {
    overflow-y: hidden;
    overflow-x: hidden;
    position: relative;
    height: 0;
}

.fb-preview-link-image-2 .box-6 {
    position: absolute;
    top: 0;
}

    .fb-preview-link-image-2 .box-7 {
        position: absolute;
        right: 0;
        top: 0;
        width: 100%;
        left: 0;
        bottom: 0;
        height: 100%;
        border: 0;
        object-position: center;
        object-fit: cover;
    }

.fb-preview-link-image-2 .box-8 {
    box-sizing: border-box;
    position: absolute;
    right: 0;
    top: 0;
    left: 0;
    bottom: 0;
    pointer-events: none;
    border-top: 1px solid rgba(0,0,0,0.1);
    border-bottom: 1px solid rgba(0,0,0,0.1);
}

.fb-preview-link-image-2 .box-9 {
    background-color: rgba(68,73,80,0.35);
    border-bottom-right-radius: inherit;
    position: absolute;
    transition-timing-function: cubic-bezier(0,0,1,1);
    right: 0;
    border-top-left-radius: inherit;
    top: 0;
    border-bottom-left-radius: inherit;
    left: 0;
    bottom: 0;
    pointer-events: none;
    transition-duration: 100ms;
    opacity: 0;
    transition-property: opacity;
    border-top-right-radius: inherit;
}

.fb-preview-link-image-3 {
    position: relative;
}

.fb-preview-link-image-2 .box-10 {
    justify-content: center;
    position: absolute;
    right: 0;
    top: 0;
    left: 0;
    display: flex;
    bottom: 0;
    pointer-events: none;
    background-color: rgba(0,0,0,0.4);
    flex-direction: column;
    align-items: center;
}

.fb-preview-link-image-2 .box-11 {
    color: rgb(255, 255, 255);
    font-size: 1.5em;
    font-family: "Segoe UI Historic", "Segoe UI", Helvetica, Arial, sans-serif;
    cursor: pointer;
    text-align: inherit;
    -webkit-user-select: none;
    list-style: none;
    text-decoration: none;
}

.fb-preview-video {

}

    .fb-preview-video .box-1 {
        position: relative;
    }

    .fb-preview-video .box-2 {
        overflow-y: hidden;
        overflow-x: hidden;
        position: relative;
        display: flex;
        flex-direction: column;
    }

    .fb-preview-video .box-3 {
        overflow-y: hidden;
        overflow-x: hidden;
        position: relative;
    }

    .fb-preview-video .box-4 {
        overflow-y: hidden;
        overflow-x: hidden;
        position: relative;
        width: 100%;
        display: flex;
        background-color: #FFFFFF;
        flex-direction: column;
        align-items: center;
    }

    .fb-preview-video .box-5 {
        position: relative;
        width: 100%;
        height: 0;
    }

    .fb-preview-video .box-6 {
        min-height: 0;
        padding-right: 0;
        box-sizing: border-box;
        padding-bottom: 0;
        position: absolute;
        margin-bottom: 0;
        right: 0;
        margin-top: 0;
        top: 0;
        padding-top: 0;
        left: 0;
        display: flex;
        justify-content: space-between;
        bottom: 0;
        min-width: 0;
        margin-left: 0;
        align-items: stretch;
        flex-shrink: 1;
        z-index: 0;
        margin-right: 0;
        flex-direction: column;
        flex-grow: 1;
        padding-left: 0;
        border-style: solid;
        border-width: 0;
    }

.fb-preview-video .box-7 {
    align-self: center;
    position: relative;
    }

    .fb-preview-video .box-8 {
        overflow-y: hidden;
        overflow-x: hidden;
        position: relative;
        height: 0;
    }

.fb-preview-video .box-9 {
    position: absolute;
    top: 0;
    }

    .fb-preview-video .box-10 {
        position: absolute;
        right: 0;
        top: 0;
        width: 100%;
        left: 0;
        bottom: 0;
        height: 100%;
    }

.fb-preview-video .box-11 {
    position: relative;
    width: 100%;
    z-index: 0;
    height: 100%;
    display: block;
    }

    .fb-preview-video .box-12 {
        position: relative;
        width: 100%;
        height: 100%;
    }

.fb-preview-video .box-13 {
    width: 100%;
    position: static;
    height: 100%;
    }

    .fb-preview-video .box-14 {
        width: 100%;
        height: 100%;
        display: block;
    }

.fb-preview-video .box-15 {
    position: absolute;
    top: 0;
    width: 100%;
    height: 100%;
    }

.fb-preview-video .box-16 {
    height: 36px;
    width: 36px;
    top: 50%;
    position: absolute;
    transition-property: opacity,visibility;
    visibility: hidden;
    transition-duration: .2s;
    left: 50%;
    transition-delay: .5s;
    transition-timing-function: cubic-bezier(.23,1,.32,1);
    opacity: 0;
    transform: translate(-50%,-50%);
}

    .fb-preview-video .box-17 {
    position: absolute;
    top: -3px;
    left: -3px;
    }

    .fb-preview-video .box-18 {
    animation-play-state: paused;
    transform-origin: 50% 50%;
    animation-duration: 4s;
    /*animation-name: b55qxmen-B;*/
    animation-iteration-count: infinite;
    animation-timing-function: linear;
    }

.fb-preview-video .box-19 {
    /*animation-name: dh536sl6-B;*/
    animation-play-state: paused;
    stroke-width: 2;
    transform-origin: 50% 50%;
    animation-direction: reverse;
    animation-duration: 4s;
    animation-iteration-count: infinite;
    animation-timing-function: linear;
    }

    .fb-preview-video .box-20 {
        height: 10%;
        width: 100%;
    }

.fb-preview-video .box-21 {
    justify-content: center;
    box-sizing: border-box;
    position: absolute;
    right: 0;
    top: 0;
    left: 0;
    display: flex;
    bottom: 0;
    align-items: center;
    }

    .fb-preview-video .box-22 {
        width: auto;
        height: 100%;
    }

.fb-preview-video .box-23 {
    box-sizing: border-box;
    position: absolute;
    cursor: pointer;
    right: 0;
    top: 0;
    left: 0;
    bottom: 0;
    }

    .fb-preview-video .box-24 {
        border-bottom-left-radius: 50%;
        border-top-left-radius: 50%;
        top: 50%;
        height: 72px;
        position: absolute;
        opacity: 1;
        margin-bottom: 0;
        width: 72px;
        cursor: pointer;
        margin-left: -36px;
        left: 50%;
        margin-top: -36px;
        border-top-right-radius: 50%;
        margin-right: 0;
        border-bottom-right-radius: 50%;
    }

.fb-preview-video .box-25 {
    padding-right: 0;
    box-sizing: border-box;
    padding-bottom: 0;
    margin-bottom: 0;
    -webkit-tap-highlight-color: transparent;
    cursor: pointer;
    display: inline;
    position: relative;
    margin-top: 0;
    padding-top: 0;
    text-align: inherit;
    margin-left: 0;
    background-color: transparent;
    touch-action: manipulation;
    margin-right: 0;
    -webkit-user-select: none;
    padding-left: 0;
    border-left: 0;
    border-top: 0;
    border-right: 0;
    border-bottom: 0;
    list-style: none;
    outline: none;
    text-decoration: none;
    }

    .fb-preview-video .box-26 {
        z-index: 100;
        transition-property: opacity,transform;
        position: absolute;
        width: 100%;
        direction: ltr;
        display: flex;
        bottom: 0;
        transition-timing-function: cubic-bezier(.23,1,.32,1);
        transition-duration: .3s;
        flex-direction: row;
        align-items: center;
    }

    .fb-preview-video .box-27 {
        box-sizing: border-box;
        position: absolute;
        right: 0;
        top: 0;
        left: 0;
        pointer-events: none;
        height: 100%;
        border-top: 1px solid rgba(0,0,0,0.1);
        border-bottom: 1px solid rgba(0,0,0,0.1);
    }

.fb-shared-header.fb-no-images {
    border-bottom-style: solid;
    border-bottom-right-radius: 8px;
    border-bottom-left-radius: 8px;
}

/* Twitter post preview */

.tw-preview {

}

.tw-preview .box-1 {
    -ms-flex-align: stretch;
    -ms-flex-direction: column;
    -ms-flex-negative: 0;
    -ms-flex-preferred-size: auto;
    -webkit-align-items: stretch;
    -webkit-box-align: stretch;
    -webkit-box-direction: normal;
    -webkit-box-orient: vertical;
    -webkit-flex-basis: auto;
    -webkit-flex-direction: column;
    -webkit-flex-shrink: 0;
    align-items: stretch;
    border: 0 solid black;
    box-sizing: border-box;
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    flex-basis: auto;
    flex-direction: column;
    flex-shrink: 0;
    margin-bottom: 0px;
    margin-left: 0px;
    margin-right: 0px;
    margin-top: 0px;
    min-height: 0px;
    min-width: 0px;
    padding-bottom: 0px;
    padding-left: 0px;
    padding-right: 0px;
    padding-top: 0px;
    position: relative;
    z-index: 0;
}

    .tw-preview .box-2 {
        padding-bottom: 12px;
        -webkit-box-pack: center;
        justify-content: center;
        flex-basis: 0px;
        -webkit-box-flex: 1;
        flex-grow: 1;
    }

.tw-preview .box-3 {
    font-weight: 400;
    font-size: 15px;
    color: rgb(15, 20, 25);
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
    line-height: 20px;
    overflow-wrap: break-word;
    min-width: 0px;
    position: relative;
    border: 0 solid black;
    box-sizing: border-box;
    color: rgba(0,0,0,1.00);
    display: inline;
    font: 14px -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
    margin-bottom: 0px;
    margin-left: 0px;
    margin-right: 0px;
    margin-top: 0px;
    padding-bottom: 0px;
    padding-left: 0px;
    padding-right: 0px;
    padding-top: 0px;
    /*white-space: pre-wrap;*/
    word-wrap: break-word;
    }

.tw-preview .box-4 {
    font-family: inherit;
    overflow-wrap: break-word;
    min-width: 0px;
    color: inherit;
    font: inherit;
    white-space: inherit;
    border: 0 solid black;
    box-sizing: border-box;
    color: rgba(0,0,0,1.00);
    display: inline;
    font: 14px -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
    margin-bottom: 0px;
    margin-left: 0px;
    margin-right: 0px;
    margin-top: 0px;
    padding-bottom: 0px;
    padding-left: 0px;
    padding-right: 0px;
    padding-top: 0px;
    white-space: pre-wrap;
    word-wrap: break-word;
    }

    .tw-preview .box-5 {
        margin-top: 12px;
        outline-style: none;
        transition-property: background-color, box-shadow;
        transition-duration: 0.2s;
        border-color: rgb(207, 217, 222);
        border-radius: 16px;
        border-width: 1px;
        border-style: solid;
        overflow: hidden;
    }

    .tw-preview .box-6 {
        outline-style: none;
        cursor: pointer;
        cursor: pointer;
        background-color: rgba(0, 0, 0, 0);
        color: inherit;
        font: inherit;
        list-style: none;
        margin: 0px;
        text-align: inherit;
        text-decoration: none;
    }

.tw-preview .box-7 {
    overflow: hidden;
    display: block;
    }

    .tw-preview .box-8 {
        width: 100%;
        display: block;
    }

    .tw-preview .box-9 {
        height: 100%;
        width: 100%;
        position: absolute;
        top: 0px;
        left: 0px;
        bottom: 0px;
    }

    .tw-preview .box-10 {
        flex-basis: auto;
        margin-right: 0px;
        margin-left: 0px;
        z-index: 0;
        position: absolute;
        top: 0px;
        right: 0px;
        left: 0px;
        bottom: 0px;
        overflow: hidden;
    }

    .tw-preview .box-11 {
        background-size: cover;
        background-repeat: no-repeat;
        background-position: center center;
        z-index: -1;
        background-color: rgba(0, 0, 0, 0);
        height: 100%;
        width: 100%;
        position: absolute;
        top: 0px;
        right: 0px;
        left: 0px;
        bottom: 0px;
    }

    .tw-preview .box-12 {
        inset: 0px;
        height: 100%;
        opacity: 0;
        position: absolute;
        width: 100%;
        z-index: -1;
    }

    .tw-preview .box-13 {
    overflow: hidden;
    display: block;
    -ms-flex-align: stretch;
    -ms-flex-direction: column;
    -ms-flex-negative: 0;
    -ms-flex-preferred-size: auto;
    -webkit-align-items: stretch;
    -webkit-box-align: stretch;
    -webkit-box-direction: normal;
    -webkit-box-orient: vertical;
    -webkit-flex-basis: auto;
    -webkit-flex-direction: column;
    -webkit-flex-shrink: 0;
    align-items: stretch;
    border: 0 solid black;
    box-sizing: border-box;
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    flex-basis: auto;
    flex-direction: column;
    flex-shrink: 0;
    margin-bottom: 0px;
    margin-left: 0px;
    margin-right: 0px;
    margin-top: 0px;
    min-height: 0px;
    min-width: 0px;
    padding-bottom: 0px;
    padding-left: 0px;
    padding-right: 0px;
    padding-top: 0px;
    position: relative;
    z-index: 0;

}

.tw-preview .box-14 {
    width: 100%;
    display: block;
    }

    .tw-preview  .box-15 {
        height: 100%;
        width: 100%;
        position: absolute;
        top: 0px;
        left: 0px;
        bottom: 0px;
    }

.tw-preview .box-16 {
    height: 100%;
    -webkit-box-direction: normal;
    -webkit-box-orient: horizontal;
    flex-direction: row;
    width: 100%;
    -ms-flex-align: stretch;
    -ms-flex-direction: column;
    -ms-flex-negative: 0;
    -ms-flex-preferred-size: auto;
    -webkit-align-items: stretch;
    -webkit-box-align: stretch;
    -webkit-box-direction: normal;
    -webkit-box-orient: vertical;
    -webkit-flex-basis: auto;
    -webkit-flex-direction: column;
    -webkit-flex-shrink: 0;
    align-items: stretch;
    border: 0 solid black;
    box-sizing: border-box;
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    flex-basis: auto;
    flex-direction: row;
    flex-shrink: 0;
    margin-bottom: 0px;
    margin-left: 0px;
    margin-right: 0px;
    margin-top: 0px;
    min-height: 0px;
    min-width: 0px;
    padding-bottom: 0px;
    padding-left: 0px;
    padding-right: 0px;
    padding-top: 0px;
    position: relative;
    z-index: 0;

    }

    .tw-preview .box-17 {
        margin-right: 2px;
        outline-style: none;
        cursor: pointer;
        flex-basis: 0px;
        -webkit-box-flex: 1;
        flex-grow: 1;
        position: relative;
        -ms-flex-align: stretch;
        -ms-flex-direction: column;
        -ms-flex-negative: 0;
        -ms-flex-preferred-size: auto;
        -webkit-align-items: stretch;
        -webkit-box-align: stretch;
        -webkit-box-direction: normal;
        -webkit-box-orient: vertical;
        -webkit-flex-basis: auto;
        -webkit-flex-direction: column;
        -webkit-flex-shrink: 0;
        align-items: stretch;
        border: 0 solid black;
        box-sizing: border-box;
        display: -webkit-box;
        display: -moz-box;
        display: -ms-flexbox;
        display: -webkit-flex;
        display: flex;
        flex-basis: auto;
        flex-direction: column;
        flex-shrink: 0;
        margin-bottom: 0px;
        margin-left: 0px;
        margin-right: 0px;
        margin-top: 0px;
        min-height: 0px;
        min-width: 0px;
        padding-bottom: 0px;
        padding-left: 0px;
        padding-right: 0px;
        padding-top: 0px;
        position: relative;
        z-index: 0;
        cursor: pointer;
        background-color: rgba(0, 0, 0, 0);
        color: inherit;
        font: inherit;
        list-style: none;
        margin: 0px;
        text-align: inherit;
        text-decoration: none;
    }

.tw-preview .box-18 {
    position: absolute;
    top: 0px;
    right: 0px;
    left: 0px;
    bottom: 0px;
    overflow: hidden;
    -ms-flex-align: stretch;
    -ms-flex-direction: column;
    -ms-flex-negative: 0;
    -ms-flex-preferred-size: auto;
    -webkit-align-items: stretch;
    -webkit-box-align: stretch;
    -webkit-box-direction: normal;
    -webkit-box-orient: vertical;
    -webkit-flex-basis: auto;
    -webkit-flex-direction: column;
    -webkit-flex-shrink: 0;
    align-items: stretch;
    border: 0 solid black;
    box-sizing: border-box;
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    flex-basis: auto;
    flex-direction: column;
    flex-shrink: 0;
    margin-bottom: 0px;
    margin-left: 0px;
    margin-right: 0px;
    margin-top: 0px;
    min-height: 0px;
    min-width: 0px;
    padding-bottom: 0px;
    padding-left: 0px;
    padding-right: 0px;
    padding-top: 0px;
    position: relative;
    z-index: 0;

    }

    .tw-preview .box-19 {
    flex-basis: auto;
    margin-right: 0px;
    z-index: 0;
    position: absolute;
    top: 0px;
    right: 0px;
    left: 0px;
    bottom: 0px;
    overflow: hidden;
    -ms-flex-align: stretch;
    -ms-flex-direction: column;
    -ms-flex-negative: 0;
    -ms-flex-preferred-size: auto;
    -webkit-align-items: stretch;
    -webkit-box-align: stretch;
    -webkit-box-direction: normal;
    -webkit-box-orient: vertical;
    -webkit-flex-basis: auto;
    -webkit-flex-direction: column;
    -webkit-flex-shrink: 0;
    align-items: stretch;
    border: 0 solid black;
    box-sizing: border-box;
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    flex-basis: auto;
    flex-direction: column;
    flex-shrink: 0;
    margin-bottom: 0px;
    margin-left: 0px;
    margin-right: 0px;
    margin-top: 0px;
    min-height: 0px;
    min-width: 0px;
    padding-bottom: 0px;
    padding-left: 0px;
    padding-right: 0px;
    padding-top: 0px;
    position: relative;
    z-index: 0;

    cursor: pointer;
    cursor: pointer;
    background-color: rgba(0, 0, 0, 0);
    color: inherit;
    font: inherit;
    list-style: none;
    margin: 0px;
    text-align: inherit;
    text-decoration: none;
}

.tw-preview .box-20 {
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center center;
    z-index: -1;
    background-color: rgba(0, 0, 0, 0);
    height: 100%;
    width: 100%;
    position: absolute;
    top: 0px;
    right: 0px;
    left: 0px;
    bottom: 0px;
    -ms-flex-align: stretch;
    -ms-flex-direction: column;
    -ms-flex-negative: 0;
    -ms-flex-preferred-size: auto;
    -webkit-align-items: stretch;
    -webkit-box-align: stretch;
    -webkit-box-direction: normal;
    -webkit-box-orient: vertical;
    -webkit-flex-basis: auto;
    -webkit-flex-direction: column;
    -webkit-flex-shrink: 0;
    align-items: stretch;
    border: 0 solid black;
    box-sizing: border-box;
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    flex-basis: auto;
    flex-direction: column;
    flex-shrink: 0;
    margin-bottom: 0px;
    margin-left: 0px;
    margin-right: 0px;
    margin-top: 0px;
    min-height: 0px;
    min-width: 0px;
    padding-bottom: 0px;
    padding-left: 0px;
    padding-right: 0px;
    padding-top: 0px;
    position: relative;
    z-index: 0;

    }

    .tw-preview .box-21 {
        outline-style: none;
        cursor: pointer;
        flex-basis: 0px;
        -webkit-box-flex: 1;
        flex-grow: 1;
        position: relative;
        -ms-flex-align: stretch;
        -ms-flex-direction: column;
        -ms-flex-negative: 0;
        -ms-flex-preferred-size: auto;
        -webkit-align-items: stretch;
        -webkit-box-align: stretch;
        -webkit-box-direction: normal;
        -webkit-box-orient: vertical;
        -webkit-flex-basis: auto;
        -webkit-flex-direction: column;
        -webkit-flex-shrink: 0;
        align-items: stretch;
        border: 0 solid black;
        box-sizing: border-box;
        display: -webkit-box;
        display: -moz-box;
        display: -ms-flexbox;
        display: -webkit-flex;
        display: flex;
        flex-basis: auto;
        flex-direction: column;
        flex-shrink: 0;
        margin-bottom: 0px;
        margin-left: 0px;
        margin-right: 0px;
        margin-top: 0px;
        min-height: 0px;
        min-width: 0px;
        padding-bottom: 0px;
        padding-left: 0px;
        padding-right: 0px;
        padding-top: 0px;
        position: relative;
        z-index: 0;
        cursor: pointer;
        background-color: rgba(0, 0, 0, 0);
        color: inherit;
        font: inherit;
        list-style: none;
        margin: 0px;
        text-align: inherit;
        text-decoration: none;
    }

.tw-preview .box-22 {
    flex-basis: auto;
    margin-left: 0px;
    z-index: 0;
    position: absolute;
    top: 0px;
    right: 0px;
    left: 0px;
    bottom: 0px;
    overflow: hidden;
    -ms-flex-align: stretch;
    -ms-flex-direction: column;
    -ms-flex-negative: 0;
    -ms-flex-preferred-size: auto;
    -webkit-align-items: stretch;
    -webkit-box-align: stretch;
    -webkit-box-direction: normal;
    -webkit-box-orient: vertical;
    -webkit-flex-basis: auto;
    -webkit-flex-direction: column;
    -webkit-flex-shrink: 0;
    align-items: stretch;
    border: 0 solid black;
    box-sizing: border-box;
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    flex-basis: auto;
    flex-direction: column;
    flex-shrink: 0;
    margin-bottom: 0px;
    margin-left: 0px;
    margin-right: 0px;
    margin-top: 0px;
    min-height: 0px;
    min-width: 0px;
    padding-bottom: 0px;
    padding-left: 0px;
    padding-right: 0px;
    padding-top: 0px;
    position: relative;
    z-index: 0;

    }

/* tw preview link*/

    .tw-preview .box-23 {
    -webkit-box-direction: normal;
    -webkit-box-orient: vertical;
    flex-direction: column;
    flex-basis: 0px;
    -webkit-box-flex: 1;
    flex-grow: 1;
        display: flex;
    }

    .tw-preview .box-23 {

    outline-style: none;
    transition-property: background-color, box-shadow;
    transition-duration: 0.2s;
    -webkit-box-direction: normal;
    -webkit-box-orient: horizontal;
    flex-direction: row;
        overflow: hidden;
    -ms-flex-align: stretch;
    -ms-flex-direction: column;
    -ms-flex-negative: 0;
    -ms-flex-preferred-size: auto;
    -webkit-align-items: stretch;
    -webkit-box-align: stretch;
    -webkit-box-direction: normal;
    -webkit-box-orient: vertical;
    -webkit-flex-basis: auto;
    -webkit-flex-direction: column;
    -webkit-flex-shrink: 0;
    align-items: stretch;
    border: 0 solid black;
    box-sizing: border-box;
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    flex-basis: auto;
    flex-direction: column;
    flex-shrink: 0;
    margin-bottom: 0px;
    margin-left: 0px;
    margin-right: 0px;
    margin-top: 0px;
    min-height: 0px;
    min-width: 0px;
    padding-bottom: 0px;
    padding-left: 0px;
    padding-right: 0px;
    padding-top: 0px;
    position: relative;
    z-index: 0;

    }

.tw-preview .box-30 {
        -ms-flex-align: stretch;
        -ms-flex-direction: column;
        -ms-flex-negative: 0;
        -ms-flex-preferred-size: auto;
        -webkit-align-items: stretch;
        -webkit-box-align: stretch;
        -webkit-box-direction: normal;
        -webkit-box-orient: vertical;
        -webkit-flex-basis: auto;
        -webkit-flex-direction: column;
        -webkit-flex-shrink: 0;
        align-items: stretch;
        border: 0 solid black;
        box-sizing: border-box;
        display: -webkit-box;
        display: -moz-box;
        display: -ms-flexbox;
        display: -webkit-flex;
        display: flex;
        flex-basis: auto;
        flex-direction: column;
        flex-shrink: 0;
        margin-bottom: 0px;
        margin-left: 0px;
        margin-right: 0px;
        margin-top: 0px;
        min-height: 0px;
        min-width: 0px;
        padding-bottom: 0px;
        padding-left: 0px;
        padding-right: 0px;
        padding-top: 0px;
        position: relative;
        z-index: 0;
    }

    .tw-preview .box-31 {
        outline-style: none;
        transition-property: background-color, box-shadow;
        transition-duration: 0.2s;
        -webkit-box-direction: normal;
        -webkit-box-orient: horizontal;
        flex-direction: row;
        border-color: rgb(207, 217, 222);
        border-radius: 16px;
        border-width: 1px;
        border-style: solid;
        overflow: hidden;
    }

    .tw-preview .box-32 {
        border-top-right-radius: 0px;
        border-bottom-right-radius: 0px;
        border-right-width: 1px;
        border-color: rgb(207, 217, 222);
        border-style: solid;
        overflow: hidden;
        display: block;
    }

    .tw-preview .box-33 {
        outline-style: none;
        transition-property: background-color, box-shadow;
        cursor: pointer;
        width: 100%;
        overflow: hidden;
        cursor: pointer;
        background-color: rgba(0, 0, 0, 0);
        color: inherit;
        font: inherit;
        list-style: none;
        margin: 0px;
        text-align: inherit;
        text-decoration: none;
    }

.tw-preview .box-34 {
    overflow: hidden;
    display: block;
    }

.tw-preview .box-35 {
    width: 100%;
    display: block;
    }

    .tw-preview .box-36 {
        height: 100%;
        width: 100%;
        position: absolute;
        top: 0px;
        left: 0px;
        bottom: 0px;
    }

.tw-preview .box-37 {
    flex-basis: auto;
    margin-right: 0px;
    margin-left: 0px;
    z-index: 0;
    position: absolute;
    top: 0px;
    right: 0px;
    left: 0px;
    bottom: 0px;
    overflow: hidden;
    }

.tw-preview .box-38 {
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center center;
    z-index: -1;
    background-color: rgba(0, 0, 0, 0);
    height: 100%;
    width: 100%;
    position: absolute;
    top: 0px;
    right: 0px;
    left: 0px;
    bottom: 0px;
    }

    .tw-preview .box-39 {
        -webkit-box-pack: center;
        justify-content: center;
        flex-shrink: 1;
        -webkit-box-flex: 1;
        flex-grow: 1;
    }

.tw-preview .box-40 {
    outline-style: none;
    transition-property: background-color, box-shadow;
    transition-duration: 0.2s;
    -webkit-box-pack: justify;
    justify-content: space-between;
    cursor: pointer;
    -webkit-box-flex: 1;
    flex-grow: 1;
    -webkit-box-direction: normal;
    -webkit-box-orient: horizontal;
    flex-direction: row;

    cursor: pointer;
    background-color: rgba(0, 0, 0, 0);
    color: inherit;
    font: inherit;
    list-style: none;
    margin: 0px;
    text-align: inherit;
    text-decoration: none;

    }

    .tw-preview .box-41 {
        padding-bottom: 12px;
        gap: 2px;
        padding-top: 12px;
        -webkit-box-pack: center;
        justify-content: center;
        flex-shrink: 1;
        -webkit-box-flex: 1;
        flex-grow: 1;
        padding-left: 12px;
        padding-right: 12px;
    }

.tw-preview .box-42 {
    font-weight: 400;
    font-size: 15px;
    color: rgb(15, 20, 25);
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
    line-height: 20px;
    overflow-wrap: break-word;
    min-width: 0px;
    max-width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    border: 0 solid black;
    box-sizing: border-box;
    color: rgba(0,0,0,1.00);
    display: inline;
    font: 14px -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
    margin-bottom: 0px;
    margin-left: 0px;
    margin-right: 0px;
    margin-top: 0px;
    padding-bottom: 0px;
    padding-left: 0px;
    padding-right: 0px;
    padding-top: 0px;
    white-space: pre-wrap;
    word-wrap: break-word;
    }

    .tw-preview .box-43 {
        font-family: inherit;
        overflow-wrap: break-word;
        min-width: 0px;
        color: inherit;
        font: inherit;
        white-space: inherit;
        border: 0 solid black;
        box-sizing: border-box;
        color: rgba(0,0,0,1.00);
        display: inline;
        font: 14px -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
        margin-bottom: 0px;
        margin-left: 0px;
        margin-right: 0px;
        margin-top: 0px;
        padding-bottom: 0px;
        padding-left: 0px;
        padding-right: 0px;
        padding-top: 0px;
        white-space: pre-wrap;
        word-wrap: break-word;
    }

.tw-preview .box-44 {
    color: rgb(83, 100, 113);
    font-weight: 400;
    font-size: 15px;
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
    line-height: 20px;
    overflow-wrap: break-word;
    min-width: 0px;
    -webkit-box-orient: vertical;
    display: -webkit-box;
    max-width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    border: 0 solid black;
    box-sizing: border-box;
    color: rgba(0,0,0,1.00);
    display: inline;
    font: 14px -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
    margin-bottom: 0px;
    margin-left: 0px;
    margin-right: 0px;
    margin-top: 0px;
    padding-bottom: 0px;
    padding-left: 0px;
    padding-right: 0px;
    padding-top: 0px;
    white-space: pre-wrap;
    word-wrap: break-word;
    }

.tw-preview .box-45 {
    color: rgb(83, 100, 113);
    font-weight: 400;
    font-size: 15px;
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
    line-height: 20px;
    overflow-wrap: break-word;
    min-width: 0px;
    max-width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    border: 0 solid black;
    box-sizing: border-box;
    color: rgba(0,0,0,1.00);
    display: inline;
    font: 14px -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
    margin-bottom: 0px;
    margin-left: 0px;
    margin-right: 0px;
    margin-top: 0px;
    padding-bottom: 0px;
    padding-left: 0px;
    padding-right: 0px;
    padding-top: 0px;
    white-space: pre-wrap;
    word-wrap: break-word;

    }

    .tw-preview .box-46 {
        margin-right: 2px;
        line-height: 16px;
        font-size: 13px;
        font-family: inherit;
        overflow-wrap: break-word;
        min-width: 0px;
        color: inherit;
        font: inherit;
        white-space: inherit;
        border: 0 solid black;
        box-sizing: border-box;
        color: rgba(0,0,0,1.00);
        display: inline;
        font: 14px -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
        margin-bottom: 0px;
        margin-left: 0px;
        margin-right: 0px;
        margin-top: 0px;
        padding-bottom: 0px;
        padding-left: 0px;
        padding-right: 0px;
        padding-top: 0px;
        white-space: pre-wrap;
        word-wrap: break-word;
    }

.tw-preview .box-47 {
    -moz-user-select: none;
    -ms-user-select: none;
    -webkit-user-select: none;
    user-select: none;
    vertical-align: text-bottom;
    position: relative;
    max-width: 100%;
    height: 1.25em;
    fill: currentcolor;
    display: inline-block;
    }

    .tw-preview .box-50 {
        font-weight: 400;
        font-size: 15px;
        color: rgb(15, 20, 25);
        font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
        line-height: 20px;
        overflow-wrap: break-word;
        max-width: 100%;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

.tw-preview .box-51 {
        color: rgb(83, 100, 113);
        font-weight: 400;
        font-size: 15px;
        font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
        line-height: 20px;
        overflow-wrap: break-word;
        min-width: 0px;
        -webkit-box-orient: vertical;
        display: -webkit-box;
        max-width: 100%;
        overflow: hidden;
        text-overflow: ellipsis;
    }

.tw-preview .box-60 {
    margin-top: 12px;
    outline-style: none;
    border-color: rgb(207, 217, 222);
    border-radius: 16px;
    border-width: 1px;
    border-style: solid;
    overflow: hidden;
}

    .tw-preview .box-61 {
        height: 100%;
        width: 100%;
        position: absolute;
        top: 0px;
        left: 0px;
        bottom: 0px;
    }

.tw-preview .box-62 {
    position: absolute;
    top: 0px;
    right: 0px;
    left: 0px;
    bottom: 0px;
}

    .tw-preview .box-63 {
        position: absolute;
        top: 0px;
        right: 0px;
        left: 0px;
        bottom: 0px;
    }

    .tw-preview .box-64 {
        height: 100%;
        width: 100%;
        position: relative;
        overflow: hidden;
        display: block;
    }

    .tw-preview .box-65 {
        height: 100%;
        width: 100%;
        position: absolute;
        top: 0px;
        left: 0px;
        bottom: 0px;
    }

    .tw-preview .retweeted-svg {
        width: 16px;
        height: 16px;
        color: rgb(83, 100, 113);
        -moz-user-select: none;
        -ms-user-select: none;
        -webkit-user-select: none;
        user-select: none;
        vertical-align: text-bottom;
        position: relative;
        max-width: 100%;
        fill: currentcolor;
        display: inline-block;
    }

    .tw-preview .retweeted-text {
        color: rgb(83, 100, 113);
        -moz-user-select: none;
        -ms-user-select: none;
        -webkit-user-select: none;
        user-select: none;
        vertical-align: text-bottom;
        position: relative;
        max-width: 100%;
        display: inline-block;
        font-family: TwitterChirp, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
    }

    .tw-preview .qouted-status-link {
        border-color: rgb(207, 217, 222);
        border-radius: 16px;
        border-width: 1px;
        border-style: solid;
    }

/* Linkedin preview*/
.linkedin-preview {

}

.box-0 {
    display: block;
    max-width: 100%;
    height: auto;
    vertical-align: top;
    overflow: hidden;
    margin: 0 auto;
}

    .linkedin-preview .box-1 {
        font-family: -apple-system,system-ui,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Fira Sans,Ubuntu,Oxygen,Oxygen Sans,Cantarell,Droid Sans,Apple Color Emoji,Segoe UI Emoji,Segoe UI Symbol,Lucida Grande,Helvetica,Arial,sans-serif;
        margin-bottom: 20px;
    }

.linkedin-preview .box-2 {
    height: 552px;
    display: flex;
    flex-wrap: wrap;
    width: 100%;
    position: relative;
    background-color: #fff;
}

    .linkedin-preview .box-3 {
        height: 100%;
        width: 50%;
        position: relative;
        top: 0;
        left: 0;
        display: block;
        cursor: pointer;
        background: none;
        border: none;
        padding: 0;
    }

.linkedin-preview .box-4 {
        width: 100%;
        height: 100%;
    }

    .linkedin-preview .box-5 {
        width: 100%;
        height: 100%;
        display: flex !important;
    }

.linkedin-preview .box-6 {
    border: 1px solid transparent;
    object-position: center;
    object-fit: cover;
    width: 100%;
    height: 100%;
    background-position: 50%;
    background-size: cover;
    }

.linkedin-preview .box-7 {
    height: 60%;
    width: 100%;
    position: relative;
    top: 0;
    left: 0;
    display: block;
    cursor: pointer;
    background: none;
    border: none;
    padding: 0;
}

.linkedin-preview .box-8 {
    height: 40%;
    width: 50%;
    position: relative;
    top: 0;
    left: 0;
    display: block;
    cursor: pointer;
    background: none;
    border: none;
    padding: 0;
}

.linkedin-preview .box-9 {
    height: 40%;
    width: 33.33%;
    position: relative;
    top: 0;
    left: 0;
    display: block;
    cursor: pointer;
    background: none;
    border: none;
    padding: 0;
}

.linkedin-preview .box-10 {
    height: 60%;
    width: 50%;
    position: relative;
    top: 0;
    left: 0;
    display: block;
    cursor: pointer;
    background: none;
    border: none;
    padding: 0;
}

.linkedin-preview .box-11 {
    display: flex;
    justify-content: center;
    align-items: center;
    position: absolute;
    top: 1px;
    left: 1px;
    height: calc(100% - 2px);
    width: calc(100% - 2px);
    background-color: rgba(0,0,0,0.6);
}

.linkedin-preview .box-12 {
    font-size: 32px;
    color: hsla(0,0%,100%,0.9)
}

.linkedin-preview .box-13 {
    height: 0;
    padding-top: 52.3%;
    max-width: 100%;
    position: relative;
    flex-shrink: 0;
    background-color: #eef3f8;
}

.linkedin-preview .box-14 {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    outline-offset: -1px;
    text-decoration: none;
    cursor: pointer;
}

.linkedin-preview .box-15 {
    padding: 8px 12px;
    padding: 8px 16px;
    display: flex;
    flex-grow: 1;
    align-items: flex-start;
    justify-content: space-between;
    background-color: #eef3f8;
}

.linkedin-preview .box-16 {
    text-decoration: none;
    cursor: pointer;
    /*touch-action: manipulation;*/
    min-width: 0;
    /*flex-grow: 1;*/
    align-self: center;
    max-width: 100%;
    flex-grow: 1 !important;
    width: 100% !important;
}

.linkedin-preview .box-17 {
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    display: block;
    line-height: 2em !important;
    max-height: 4em;
    overflow: hidden;
    text-overflow: ellipsis;
    overflow-wrap: break-word !important;
    word-wrap: break-word !important;
    word-break: break-word !important;
    color: rgba(0, 0, 0, 0.9);
    font-size: 1.4em;
    line-height: 1.42857;
    font-weight: 600;
}

.linkedin-preview .box-18 {
    color: rgba(0, 0, 0, 0.9);
    font-size: 14px;
    font-family: -apple-system,system-ui,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Fira Sans,Ubuntu,Oxygen,Oxygen Sans,Cantarell,Droid Sans,Apple Color Emoji,Segoe UI Emoji,Segoe UI Symbol,Lucida Grande,Helvetica,Arial,sans-serif;
    margin-top: 10px;
    margin-bottom: 8px;
}

.linkedin-preview .box-19 {
    color: rgba(0, 0, 0, 0.6);
    font-size: 12px;
    font-family: -apple-system,system-ui,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Fira Sans,Ubuntu,Oxygen,Oxygen Sans,Cantarell,Droid Sans,Apple Color Emoji,Segoe UI Emoji,Segoe UI Symbol,Lucida Grande,Helvetica,Arial,sans-serif;
    margin-top: 0px;
    margin-bottom: 6px;
}


/* IG post preview*/

.ig-prview {

}

.ig-preview .box-1 {
    padding-left: 16px !important;
    padding-right: 16px !important;
    flex-direction: row;
    display: flex;
    flex-shrink: 0;
    margin: 0;
    padding: 0;
    position: relative;
}

.ig-preview .box-2 {
    display: inline-block;
    margin-left: -8px;
}

.ig-preview .box-3 {
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    background: 0 0;
    border: 0;
    cursor: pointer;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    padding: 8px;
}

.ig-preview .box-4 {
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
}

.ig-preview .box-5 {
    display: block;
    position: relative;
}

.ig-preview .box-6 {
    color: rgb(38, 38, 38);
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
    font-size: 14px;
    margin-top: 4px;
    padding-left: 16px;
    padding-right: 16px;
    margin-bottom: 10px;
    margin-top: 4px;
}

    .ig-preview .box-6 a {
        color: #007cba;
    }

.thump-shift {
    margin-bottom: 12px;
}

.my-account-filter-active {
   color: #00a6f8;
}

.settings-menu-fix {
    padding-bottom: 5px !important;
}

/*Community Feed*/
.insights-item {
    color: #969696;
    padding-top: 6px;
    text-align: left;
}

[class~="prev-icn"]:before {
    vertical-align: middle;
}

.video-selector .progress-bar {
    height: unset !important;
    line-height: unset;
    font-size: 9px;   
}

.video-selector .progress {
    height: unset !important;
}

/* Specify styling for tooltip contents */
.community-feed .tooltip.customClass .tooltip-inner {
    color: white;
    background-color: #65676b;
    box-shadow: 0 6px 12px rgba(0,0,0,.175);
    width: 250px;
}
/* Hide arrow */
.community-feed .tooltip.customClass .tooltip-arrow {
    display: none;
}

.additional-padding-community {
    padding-right: 20px;
}

/*Albums Shared Image Gallery*/
.album-controls-container {
    float: right;
    font-size: 16px;
    
}

    .album-controls-container a {
        color: #007cba;
        text-decoration: none;
        cursor: pointer;
        transition: transform .2s;
        display: inline-block;
    }

.album-controls-container a .tscon-trash {
    color: #e45f16;
    text-decoration: none;
    cursor: pointer;
}

    .album-controls-container a:hover {
        color: #007cba;
        text-decoration: none;
        transform: scale(1.3);
    }

.album-controls-container a:hover .tscon-trash {
    color: #e45f16;
    text-decoration: none;
}

.album-controls-container a:visited {
    color: #007cba;
    text-decoration: none;
}

.album-controls-container a:visited .tscon-trash {
    color: #e45f16;
    text-decoration: none;
}

.album-controls-container a:hover:visited {
    color: #007cba;
    text-decoration: none;
}

.album-controls-container a:focus {
    /*color: #007cba;*/
    text-decoration: none;
}

.album-controls-container a:hover .tscon-trash {
    color: #e45f16;
    text-decoration: none;
}

.album-controls-container a.disabled {
    color: #ccc;
    cursor: default;
    pointer-events: none;
    text-decoration: none;
}

.album-controls-container a.disabled .tscon-trash {
    color: #ccc;
    text-decoration: none;
}

/*InviteCommunity*/
.welcome-community-block {
    /*padding-left: 69px;*/
    padding-right: 69px;
    padding-top: 34px;
}

.welcome-text {
    margin-bottom: 30px;
    padding-left: 69px;
}

.welcome-features-block {
    padding-left: 68px;
    margin-top: 24px;
    padding-top: 27px;
}

.welcome-community-block .welcome-text-item {
    margin-bottom: 10px;
}

.welcome-community-block .welcome-text {
    font-size: 20px;
    color: #444444;
}

.welcome-community-block .welcome-feature-item {
    margin-bottom: 10px;
}


.welcome-features-block .item-icon-block {
    display: inline-block;
    width: 25px;
    font-size: 24px;
    margin-right: 10px;
    color: #444444;
    position: relative;
}
.welcome-features-block .item-icon-block i {
    position: absolute;
    top: -46px;
}

    .welcome-features-block .item-text-block {
    display: inline-block;
    color: #444444;
}

.welcome-features-block .item-text-block .item-header {
    font-size: 20px;
    color: #444444;
}

.welcome-features-block .item-text-block .item-text {
    font-size: 16px;
    color: #444444;
    max-width: 450px;
}

/*Pending Activations Report*/
.pending-activations-row {
    display: flex;
    flex-direction: row;
}

.list-group-custom .list-group-el:hover .tscon-reload9,
.list-group-custom .list-group-el:focus .tscon-reload9 {
    color: #3c763d;
}

/*Organizations list*/

.select-all-orgs.active {
    box-shadow: none !important;
    background-color: #FFFFEF !important;
    border-color: #00a6f8 !important;
}

.select-all-orgs.active .thumb{
    display: block;
}

/*Email temaplates preview*/
.invite-user-email-contianer table{
    border-spacing: 0;
    font-family: sans-serif;
    color: #333333;
    background: #fff;
}

.no-click {
    pointer-events: none;
    cursor: not-allowed !important;
}

.active-contact-item {
    border-left: 5px solid #00a6f8 !important;
    /*margin-left: -5px;*/
    background-color: aliceblue;
    padding-left: 0px;
}

.selected-contact-box {
    box-shadow: inset 0 0 0 1px #dadce0;
    color: #5f6368;
    border-radius: 50vh;
    display: inline-block;
    margin: 3px;
    cursor: default;
    background-color: aliceblue;
}

.selected-contact-box > .wrapper {
    padding-left: 8px;
    padding-right: 8px;
    padding-top: 3px;
    padding-bottom: 3px;
}

.selected-contact-box .remove-icon {
    cursor: pointer;
}

.selected-contact-box .remove-icon:hover {
    cursor: pointer;
    color: #d55c5c;
}

li.contact-item {
    /*padding-left: 5px;*/
}

li.contact-item.active-contact-item {
    padding-left: 0px;
}

.contact-item a {
    padding-left: 15px;
}

.contact-item.active-contact-item a {
    padding-left: 10px;
}

/* Specify styling for tooltip contents */
.community-emails-feed .tooltip.customClass .tooltip-inner {
    color: white;
    background-color: #65676b;
    box-shadow: 0 6px 12px rgba(0,0,0,.175);
    width: 250px;
}
/* Hide arrow */
.community-emails-feed .tooltip.customClass .tooltip-arrow {
    display: none;
}

.opacity-50 {
    opacity: 0.5;
}

/* found feeds modal body*/
.found-feed-body {
    padding-top: 10px;
    padding-bottom: 10px;
}

.found-feed-body:hover {
    background-color: #eff9ff;
    cursor: pointer;
}

.found-feed-body .found-feed-icon {
    width: 35px;
    height: 35px;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: 50% 50%;
    border: 1px #e5e5e5 solid;
    border-radius: 5px;
}

.tg-spoiler {
    background-color: #777777;
}