@import '../../assets/user_theme_css/user_theme.css';
:root { /*or just body*/
    --blueish: #4a77c3;         /*The background color used in all headers, tables. Also applies as background to menu on hover*/
    --blueishText: #F8F8F8;     /*Also applies to menu on hover. Should contrast the color defined above. */
    --menuItem: #c7c7c7;        /*Applies to all menu items at all levels & sidebarToggler*/
    --menuItemHover: #4f80d1;   /*Applies to active link (Custom sub fields)) + on HOVER on all other links. */
    --headings: #446db3;        /*Various labels, h elements, icons on hover*/
    --popOverBack: #0066cc;     /*Background for info, tips etc popovers*/
    --faIconColor: #656565;     /*icon color*/
    --bodyBackColor: #F8F8FF;   /*body background F8F8FF FAF9F6*/
    --bodyTextColor: #222222;   /*body text*/
    --roweven: #eaf0ff;
    --rowevenHover: #FAF9F6;
    --arrowDown: url(../images/arrow_d_w.png);
    --arrowUp: url(../images/arrow_u_w.png);
    --sidebar: #232323;        /*Side menu background*/
    --highlight: #C4DBFC;   /* Highlighted elements color. After editing and reloading page */
    /*--barWidth: 235px*/
}
.darkTheme {
    --blueish: #000000;
    --blueishText: #dddddd;
    --menuItem: #dddddd;
    --menuItemHover: #9ecaff;
    --headings: #dbdbdb;
    --popOverBack: #212121;
    --faIconColor: #dddddd;
    --bodyBackColor: #313131;
    --bodyTextColor: #c7c7c7;
    --roweven: #444;
    --rowevenHover: #222;
    --arrowDown: url(../images/arrow_d_w.png);
    --arrowUp: url(../images/arrow_u_w.png);
    --sidebar: #2f2f2f;
    --highlight: #41151b;   /* Highlighted elements color. After editing and reloading page */
}
.purpleTheme {
    --blueish: #4F46E5;
    --blueishText: #dfdfdf;
    --menuItem: #cab6ff;
    --menuItemHover: #FFFFFF;
    --headings: #4F46E5;
    --popOverBack: #4F46E5;
    --faIconColor: #544af4;
    --bodyBackColor: #FAF5FF;
    --bodyTextColor: #555;
    --roweven: #F5F5F5;
    --rowevenHover: #f0eded;
    --arrowDown: url(../images/arrow_d_w.png);
    --arrowUp: url(../images/arrow_u_w.png);
    --sidebar: #2e2987;
    --highlight: #C4DBFC;   /* Highlighted elements color. After editing and reloading page */
}

.coffeeTheme {
    --blueish: #61321e;
    --blueishText: #E8D8C4;
    --menuItem: #f8e7d2;
    --menuItemHover: #c57138;
    --headings: #804227;
    --popOverBack: #4E3F33;
    --faIconColor: #804227;
    --bodyBackColor: #FBF2EA;
    --bodyTextColor: #41151b;
    --roweven: #f6e5d0;
    --rowevenHover: #f0eded;
    --arrowDown: url(../images/arrow_d_w.png);
    --arrowUp: url(../images/arrow_u_w.png);
    --sidebar: #561C24;
    --highlight: #C4DBFC;   /* Highlighted elements color. After editing and reloading page */
}
.greenTheme {
    --blueish: #19a526;
    --blueishText: #ccff68;
    --menuItem: #efefef;
    --menuItemHover: #ccff68;
    --headings: #19a526;
    --popOverBack: #157335;
    --faIconColor: #87A922;
    --bodyBackColor: #F8F8F8;
    --bodyTextColor: #555;
    --roweven: #F5F5F5;
    --rowevenHover: #f0eded;
    --arrowDown: url(../images/arrow_d_w.png);
    --arrowUp: url(../images/arrow_u_w.png);
    --sidebar: #468c46;
    --highlight: #C4DBFC;   /* Highlighted elements color. After editing and reloading page */
}
.orangeTheme {
    --blueish: #ed7700;
    --blueishText: #FFFFFF;
    --menuItem: #FFFFFF;
    --menuItemHover: #ffff00;
    --headings: #c06000;
    --popOverBack: #ed7700;
    --faIconColor: #c06000;
    --bodyBackColor: #FFFFFF;
    --bodyTextColor: #555;
    --roweven: #F5F5F5;
    --rowevenHover: #f0eded;
    --arrowDown: url(../images/arrow_d_w.png);
    --arrowUp: url(../images/arrow_u_w.png);
    --sidebar: #ff8000;
    --highlight: #C4DBFC;   /* Highlighted elements color. After editing and reloading page */
}
/*
https://gwfh.mranftl.com/fonts
------------------------- static ------------------------- */
/*
    Montserrat      */
@font-face {
    font-family: 'Montserrat';
    font-style: normal;
    font-weight: 200;
    src: url('./fonts/montserrat/montserrat-v18-latin-ext_cyrillic-ext-200.eot'); /* IE9 Compat Modes */
    src: local(''),
    url('./fonts/montserrat/montserrat-v18-latin-ext_cyrillic-ext-200.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
    url('./fonts/montserrat/montserrat-v18-latin-ext_cyrillic-ext-200.woff2') format('woff2'), /* Super Modern Browsers */
    url('./fonts/montserrat/montserrat-v18-latin-ext_cyrillic-ext-200.woff') format('woff'), /* Modern Browsers */
    url('./fonts/montserrat/montserrat-v18-latin-ext_cyrillic-ext-200.ttf') format('truetype'), /* Safari, Android, iOS */
    url('./fonts/montserrat/montserrat-v18-latin-ext_cyrillic-ext-200.svg#Montserrat') format('svg'); /* Legacy iOS */
}
@font-face {
    font-family: 'Montserrat';
    font-style: normal;
    font-weight: 300;
    src: url('./fonts/montserrat/montserrat-v18-latin-ext_cyrillic-ext-300.eot'); /* IE9 Compat Modes */
    src: local(''),
    url('./fonts/montserrat/montserrat-v18-latin-ext_cyrillic-ext-300.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
    url('./fonts/montserrat/montserrat-v18-latin-ext_cyrillic-ext-300.woff2') format('woff2'), /* Super Modern Browsers */
    url('./fonts/montserrat/montserrat-v18-latin-ext_cyrillic-ext-300.woff') format('woff'), /* Modern Browsers */
    url('./fonts/montserrat/montserrat-v18-latin-ext_cyrillic-ext-300.ttf') format('truetype'), /* Safari, Android, iOS */
    url('./fonts/montserrat/montserrat-v18-latin-ext_cyrillic-ext-300.svg#Montserrat') format('svg'); /* Legacy iOS */
}
@font-face {
    font-family: 'Montserrat';
    font-style: normal;
    font-weight: 400;
    src: url('./fonts/montserrat/montserrat-v18-latin-ext_cyrillic-ext-regular.eot'); /* IE9 Compat Modes */
    src: local(''),
    url('./fonts/montserrat/montserrat-v18-latin-ext_cyrillic-ext-regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
    url('./fonts/montserrat/montserrat-v18-latin-ext_cyrillic-ext-regular.woff2') format('woff2'), /* Super Modern Browsers */
    url('./fonts/montserrat/montserrat-v18-latin-ext_cyrillic-ext-regular.woff') format('woff'), /* Modern Browsers */
    url('./fonts/montserrat/montserrat-v18-latin-ext_cyrillic-ext-regular.ttf') format('truetype'), /* Safari, Android, iOS */
    url('./fonts/montserrat/montserrat-v18-latin-ext_cyrillic-ext-regular.svg#Montserrat') format('svg'); /* Legacy iOS */
}
@font-face {
    font-family: 'Montserrat';
    font-style: normal;
    font-weight: 500;
    src: url('./fonts/montserrat/montserrat-v18-latin-ext_cyrillic-ext-500.eot'); /* IE9 Compat Modes */
    src: local(''),
    url('./fonts/montserrat/montserrat-v18-latin-ext_cyrillic-ext-500.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
    url('./fonts/montserrat/montserrat-v18-latin-ext_cyrillic-ext-500.woff2') format('woff2'), /* Super Modern Browsers */
    url('./fonts/montserrat/montserrat-v18-latin-ext_cyrillic-ext-500.woff') format('woff'), /* Modern Browsers */
    url('./fonts/montserrat/montserrat-v18-latin-ext_cyrillic-ext-500.ttf') format('truetype'), /* Safari, Android, iOS */
    url('./fonts/montserrat/montserrat-v18-latin-ext_cyrillic-ext-500.svg#Montserrat') format('svg'); /* Legacy iOS */
}
@font-face {
    font-family: 'Montserrat';
    font-style: normal;
    font-weight: 600;
    src: url('./fonts/montserrat/montserrat-v18-latin-ext_cyrillic-ext-600.eot'); /* IE9 Compat Modes */
    src: local(''),
    url('./fonts/montserrat/montserrat-v18-latin-ext_cyrillic-ext-600.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
    url('./fonts/montserrat/montserrat-v18-latin-ext_cyrillic-ext-600.woff2') format('woff2'), /* Super Modern Browsers */
    url('./fonts/montserrat/montserrat-v18-latin-ext_cyrillic-ext-600.woff') format('woff'), /* Modern Browsers */
    url('./fonts/montserrat/montserrat-v18-latin-ext_cyrillic-ext-600.ttf') format('truetype'), /* Safari, Android, iOS */
    url('./fonts/montserrat/montserrat-v18-latin-ext_cyrillic-ext-600.svg#Montserrat') format('svg'); /* Legacy iOS */
}

/*
    Raleway     */
@font-face {
    font-family: 'Raleway';
    font-style: normal;
    font-weight: 400;
    src: url('./fonts/raleway/raleway-regular-webfont.woff2') format('woff2'), url('./fonts/raleway/raleway-regular-webfont.woff') format('woff');
}
@font-face {
    font-family: 'Raleway';
    font-style: normal;
    font-weight: 700;
    src: url('./fonts/raleway/raleway-bold-webfont.woff2') format('woff2'), url('./fonts/raleway/raleway-bold-webfont.woff') format('woff');
}
/*
    Poppins     */
/* poppins-200 - latin_latin-ext */
@font-face {
    font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
    font-family: 'Poppins';
    font-style: normal;
    font-weight: 200;
    src: url('./fonts/poppins/poppins-v21-latin_latin-ext-200.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* poppins-200italic - latin_latin-ext */
@font-face {
    font-display: swap;
    font-family: 'Poppins';
    font-style: italic;
    font-weight: 200;
    src: url('./fonts/poppins/poppins-v21-latin_latin-ext-200italic.woff2') format('woff2');
}
/* poppins-300 - latin_latin-ext */
@font-face {
    font-display: swap;
    font-family: 'Poppins';
    font-style: normal;
    font-weight: 300;
    src: url('./fonts/poppins/poppins-v21-latin_latin-ext-300.woff2') format('woff2');
}
/* poppins-300italic - latin_latin-ext */
@font-face {
    font-display: swap;
    font-family: 'Poppins';
    font-style: italic;
    font-weight: 300;
    src: url('./fonts/poppins/poppins-v21-latin_latin-ext-300italic.woff2') format('woff2');
}
/* poppins-regular - latin_latin-ext */
@font-face {
    font-display: swap;
    font-family: 'Poppins';
    font-style: normal;
    font-weight: 400;
    src: url('./fonts/poppins/poppins-v21-latin_latin-ext-regular.woff2') format('woff2');
}
/* poppins-500 - latin_latin-ext */
@font-face {
    font-display: swap;
    font-family: 'Poppins';
    font-style: normal;
    font-weight: 500;
    src: url('./fonts/poppins/poppins-v21-latin_latin-ext-500.woff2') format('woff2');
}
/* poppins-600 - latin_latin-ext */
@font-face {
    font-display: swap;
    font-family: 'Poppins';
    font-style: normal;
    font-weight: 600;
    src: url('./fonts/poppins/poppins-v21-latin_latin-ext-600.woff2') format('woff2');
}
/* poppins-700 - latin_latin-ext */
@font-face {
    font-display: swap;
    font-family: 'Poppins';
    font-style: normal;
    font-weight: 700;
    src: url('./fonts/poppins/poppins-v21-latin_latin-ext-700.woff2') format('woff2');
}

html {
    height: 100%;
    width: 100%;
}
body {
    height: 100%;width: 100%;
    font-family: Poppins,Montserrat, Raleway, Verdana, Tahoma, Arial, Helvetica, sans-serif;
    font-weight: 300;
    font-size: 0.9rem;
    color: var(--bodyTextColor);
    background-color: var(--bodyBackColor);
    padding: 0;
    /*transition: font-size 0.2s ease-in-out;*/
}

.select {
    color: var(--bodyTextColor) !important;
}

.fa, .fas, .far, .fab {
    color: var(--faIconColor);  /*#6c6c6c*/
}
.fa:hover, a.fa, a.fa:hover, a.fa:link, a.fa:visited,
.fas:hover, a.fas, a.fas:hover, a.fas:link, a.fas:visited,
.fab:hover, a.fab, a.fab:hover, a.fab:link, a.fab:visited,
.far:hover, a.far, a.far:hover, a.far:link, a.far:visited{
    text-decoration: none;
}
.fa:hover, a.fa:hover,
.fas:hover, a.fas:hover,
.fab:hover, a.fab:hover,
.far:hover, a.far:hover {
    color: var(--headings)
}
.fa-file-image {
    color: var(--faIconColor);
}

img[class*="svg"] {fill: var(--faIconColor);stroke: var(--faIconColor)}
img[class*="svg"]:hover {fill: var(--blueishText);stroke: var(--blueishText)}


span[class*="trash"]:hover {color: red !important;}

.company {
    opacity: 0.7;
    color: var(--menuItem);
    /*font-family: Montserrat, Raleway, Verdana, Tahoma, Arial, Helvetica, sans-serif;*/
    font-size: 135%;
    font-weight: 400;
    /*word-wrap: break-word;*/
    word-break: break-word;
}

/*v.10.1*/
.topHeaderIconsBox {
    padding:6px 18px;
    background: var(--sidebar) !important;
    border-radius: 8px 8px 8px 8px;
    transition:top .2s ease-in-out;
    position:fixed;
    top:5px;
    right:5px;
    z-index:1000
}
.topHeaderIcons {
    color: var(--menuItem) !important;
    opacity: 0.8;
    font-size: 1.2rem;
    cursor: pointer;
    padding: 0.5rem !important;
}
.topHeaderIcons:hover {
    color: var(--menuItemHover) !important;
}

.pageIcons {
    display: none;
    opacity: 0.4;
}

h1 {
    font-family: Poppins, Montserrat, Raleway, Verdana, Tahoma, Arial, Helvetica, sans-serif;
    /*text-shadow: 1px 1px 1px #E0E0E0;*/
    font-size: 155% !important;
    font-weight: 400;
}
h2 {
    color: var(--bodyTextColor);
    font-family: Poppins, Montserrat, Raleway, Verdana, Tahoma, Arial, Helvetica, sans-serif;
    font-size: 130% !important
}
h3 {
    font-family: Poppins, Montserrat, Raleway, Verdana, Tahoma, Arial, Helvetica, sans-serif;
    font-size: 125% !important
}
.heading3 {
    font-family: Poppins, Montserrat, Raleway, Verdana, Tahoma, Arial, Helvetica, sans-serif;
    font-size: 125%;
    font-weight: 400;
}
h1, h2, h3, .heading3 {
    color: var(--headings);
    /*color: var(--bodyTextColor);*/
}
.overlay {
    opacity: 0.3;
    filter: alpha(opacity=0);
    position: fixed;
    top: 0;
    left: 0;
    z-index: 1000;
    width: 100%;
    height: 100%;
    background: #B2B2B2 !important
}

B, strong {
    font-weight: 500;
}

.subsBox span {color: var(--bodyTextColor);}
.subsBox {  /*F8F8F8*/
    /*background: #F6FAFF;*/
    /*background: linear-gradient(to left, #F9FBFE, #FFF);*/
/*    box-shadow: #535353 0 10px 20px 0 !important;*/
    border-style: solid;
    border-color: var(--blueish);
    border-width: 0 0 0 8px ;
}
.subsBox:hover {box-shadow: #535353 0 16px 28px 0 !important;}
.subsBox > a { text-decoration: none !important; }
.subsBox  div:hover span,
.subsBox  div[class*="row"]:hover,
.subsBox div:hover span[class*="fas "],
.subsBox div:hover span[class*="far "] {
    color: var(--blueishText) !important;
    background-color: var(--blueish) !important;
    text-decoration: none !important;
}

.campaignsBox span {color: var(--bodyTextColor);}
.campaignsBox { /*F2F2FB*/
    /*background: #f6f6ff;*/
    /*background: linear-gradient(to top left, #f6f6ff, #FFF);*/
/*    box-shadow: #535353 0 10px 20px 0 !important;*/
    border-style: solid;
    border-color: var(--blueish);
    border-width: 0 0 0 8px ;
}
.campaignsBox:hover {box-shadow: #535353 0 16px 28px 0 !important;}
.campaignsBox > a { text-decoration: none !important; }
.campaignsBox  div:hover span,
.campaignsBox  div[class*="row"]:hover,
.campaignsBox div:hover span[class*="fas "],
.campaignsBox div:hover span[class*="far "] {
    color: var(--blueishText) !important;
    background-color: var(--blueish) !important;
    text-decoration: none !important;
}

.nslBox span {color: var(--bodyTextColor);}
.nslBox {/*FEFAF7*/
    /*background: #fffbf8;*/
    /*background: linear-gradient(to left, #fffbf8, #FFF);*/
    /*box-shadow: #535353 0 10px 20px 0 !important;*/
    border-style: solid;
    border-color: var(--blueish);
    border-width: 0 0 0 8px ;
}
.nslBox:hover {box-shadow: #535353 0 16px 28px 0 !important;}
.nslBox > a { text-decoration: none !important; }
.nslBox  div:hover span,
.nslBox  div[class*="row"]:hover {
    color: var(--blueishText) !important;
    background-color: var(--blueish) !important;
    text-decoration: none !important;
}

.subsBox2 span {color: var(--bodyTextColor);}
.subsBox2 {
    /*background: #F8F8F8;*/
    /*background: linear-gradient(to left, #F8F8F8, #FFF);*/
    /*box-shadow: #535353 0 10px 20px 0 !important;*/
    border-style: solid;
    border-color: var(--blueish);
    border-width: 0 0 0 8px ;
}
.subsBox2:hover {box-shadow: #535353 0 16px 28px 0 !important;}
.subsBox2 > a { text-decoration: none !important; }
.subsBox2  div[class*="col"]:hover,
.subsBox2  div[class*="col"]:hover span {
    color: var(--blueishText) !important;
    background-color: var(--blueish) !important;
    text-decoration: none !important;
}

.shadowBox {
    /*box-shadow: #535353 0 10px 20px 0 !important;*/
}
.shadowBox:hover {
    box-shadow: #535353 0 16px 28px 0 !important;
}

.homeBoxLarge  {
    font-family: Poppins, Montserrat, Raleway, Verdana, Tahoma, Arial, Helvetica, sans-serif;
    font-size: 135%;
    font-weight: 400;
    text-decoration: none !important;
}


.statsLabel {
    color: var(--headings);
    font-weight: 400;
}

._statsLabel {
    color: var(--headings);
    font-size: 105%;
    font-weight: 400;
}
.statsLabel2  {
    color: var(--headings);
    font-size: 125%;
    font-weight: 500
}

.smallTitle {
    color: var(--bodyTextColor);
    font-size: 125%;
    font-weight: 400
}

a, a:link, a:visited {
    color: var(--bodyTextColor);
    text-decoration: underline
}
a:hover {
    color: var(--headings);
}
a.none {
    text-decoration: none;
}
a:active {
    color: var(--bodyTextColor)
}

a.cross, a.cross:link, a.cross:visited, .pageIcons {
    color: red;
    text-decoration: none
}
a.cross:link, a.cross:visited, a:active, a:hover {
    text-decoration: none
}
.cross:hover, a.cross:hover {
    color:  var(--headings);
}

.iconHover {
    font-size: 0.9rem;
    color: #333;
    margin-top: 0.25em;
    margin-bottom: 0.25em;
}
.iconHover:hover {
    /*color: #111 !important;*/
    background-color: #e1e1e1 !important;
    border: 1px #999 solid;
    border-radius: 4px;
}

.okmessage {
    font-weight: 400;
    background: #197219 /*var(--bodyBackColor)*//*#e9effe*/;
    color: #FFFFFF /*var(--bodyTextColor)*/;
    border:  #197219 2px solid;
    width: 400px;
    padding: .3rem 1.5rem .45rem .25rem !important;
    text-align: left;  /* Align text to the left */
    position: relative;  /* Enable positioning for child elements */
}
.okmessage a {
    color: #FFFFFF !important;
}

.okmessage::after {
    color: #FFFFFF;
    font-family:"Font Awesome 5 Free";
    content: "\f058";
    font-weight: 900;
    font-size: 140%;
    opacity: 0.9;
    position: absolute;  /* Position icon absolutely */
    left: 10px;  /* Adjust the left position */
    top: 50%;  /* Move to the vertical center */
    transform: translateY(-50%);  /* Center vertically */
}
#messageBoxText, .messageBoxText {
    display: inline-block;
    vertical-align: middle;  /* Center vertically */
    padding-left: 30px;  /* Add padding to account for the icon */
}
#messageBoxBubble .close span{
    color: #FFFFFF /*var(--bodyTextColor)*/ !important;
    text-shadow: none !important;
    position: absolute;
    top: 1px;
}
.okmessage100 {
    font-weight: 400;
    background: #D4EDDA;
    border: 1px solid #c3e6cb;;
    color: #555555;
    border-radius: 4px;
    padding: .75rem 1.25rem;
    text-align: center;
}
.errormessage {
    font-weight: 400;
    background: #902922;
    color: #FFFFFF;
    border:  #902922 2px solid;
    width: 400px;
    padding: .3rem 1.5rem .45rem .25rem !important;
    text-align: left;  /* Align text to the left */
    position: relative;  /* Enable positioning for child elements */
}
.errormessage::after {
    color: #FFFFFF;
    font-family:"Font Awesome 5 Free";
    content: "\f057";
    font-weight: 900;
    font-size: 140%;
    opacity: 0.9;
    position: absolute;  /* Position icon absolutely */
    left: 10px;  /* Adjust the left position */
    top: 50%;  /* Move to the vertical center */
    transform: translateY(-50%);  /* Center vertically */
}
.errormessage100 {
    font-weight: 400;
    background: #FFF3CD;
    color: #555555;
    border-color:  #c8bfa1 #c8bfa1 #c8bfa1 #902922;
    border-width: 1px 1px 1px 5px;
    border-style: solid;
    padding: .75rem 2.5rem .75rem 1.25rem;
    text-align: center;
}
.dbfield {
}

/*.holderDiv {
    background: #FFF;
    border-color: #555;
    border-width: 1px 1px 1px 1px;
    border-style: solid;
    box-shadow: 0 -1px 12px 5px rgba(119, 119, 119, 1);
    margin: 0;
    padding: 0;
    position: fixed;
    z-index: 1000;
    cursor: move
}*/

.frameHolder {
    height: 100%;
    width: 100%
}

.settingsTab {
    border-radius: 5px;
    font-family: Poppins, Montserrat, Raleway, Verdana, Tahoma, Arial, Helvetica, sans-serif;
    display: inline-block;
    cursor: pointer;
    width: 100%;
    outline: 0;
    font-weight: 400;
    /*padding-bottom: 8px;*/
}
.settingsTab::after {
    font-family:"Font Awesome 5 Free";
    content: "\f055";
    font-weight: 900;
    font-size: 170%;
    opacity: 0.9;
    float: right;
    padding-right: 15px;
    padding-bottom: 6px;
    /*position: relative;
    right: 20px;
    padding: 0;*/
}

.changed::after {
    content: "\f056"
}

.listsTab {
    background: var(--blueish);
    color: var(--blueishText);
    font-size: 110%;
    line-height: 1.6;
    padding: 12px 0 0 12px;
}
.listsTab::after {
    font-size: 125%;
}

.bigger {
    font-size: 120%;
    text-decoration: none;
}

.confirmBox { /*not used */
    border: 1px solid #343434;
    border-radius: 10px;
    background: #494949;
    cursor: move;
    text-align: center;
    width: 380px
}
.confirmBoxTop { /*not used */
    color: #ffff22;
    /*font-family: Poppins, Montserrat, Raleway, Verdana, Tahoma, Arial, Helvetica, sans-serif;*/
    font-size: 125%;
    padding: 10px 0 0 0;
}
.confirmBoxBottom { /*not used */
    color: #FFFFE0;
    font-size: 115%;
    padding: 15px 20px 20px 20px;
}

.campaignHeader {
    background: var(--blueish);
    color: var(--blueishText);
    font-family: Poppins, Montserrat, Raleway, Verdana, Tahoma, Arial, Helvetica, sans-serif;
    font-weight: 400;
    font-size: 130%;
    border-top-right-radius: 4px;
    border-top-left-radius: 4px;
    padding: 6px 10px 8px 1px
}
/*Button with campaign options*/
.cmp:hover > .dropdown-menu {
    display: block;
}

.headerIcon, .headerIcon:hover{
    color: var(--blueishText);
}
textarea {
    color: var(--bodyTextColor) !important;
    border-radius: 3px;
    border: 1px solid #CCC;
    background: #FFF;
    padding: 6px 8px;
    box-shadow: 0 0 3px 0 #CCC inset
}

input[type="checkbox"] {
    width: 16px; height: 16px;
}

.filterDesc, .filterSql {
    /*background: var(--bodyBackColor);*/
    line-height: 200%;
    border-radius: 6px;
    word-wrap: break-word;
    padding: 6px;
}

.addPencil::after  {
    position: relative;
    right: -10px;
    content: "\f303";
    font-family:"Font Awesome 5 Free";
    font-weight: 900;
    color: var(--faIconColor);
}
/*admin/scripts/jquery.jeditable.js*/
.editBox {
    box-shadow: 0 0 3px 0 #CCC inset;
    padding: 2px;
    color: #212529;
    border-radius: 3px;
    background: #fdfdfd;
    font-size: inherit !important;
    height: inherit !important;
    border: 0 !important;
}

.filterSql {
    margin-top: 8px
}
.nslSubject {
    background: transparent;
    border-top: 0; border-left: 0; border-right: 0;
    border-bottom: 1px solid #e2e1df;
    border-radius: 5px;
    color: #1b1e21;
    font-size: 155% !important;
    text-align: left;
    text-decoration: none;
}
.inav{
    font-size: 90%;
    color: var(--blueishText);
    text-decoration: none;
    background-color: var(--blueish);
    position: relative;
    display: inline-block;
    padding: .5rem .75rem;
    margin-left: -1px;
    line-height: 1.25;
    border: 1px solid var(--blueish);
}
a.inav2 {
    font-size: 90%;
    color: var(--bodyTextColor) !important;
    text-decoration: none;
    background-color: var(--bodyBackColor);
    position: relative;
    display: inline-block;
    padding: .5rem .75rem;
    margin-left: -1px;
    line-height: 1.25;
    border: 1px solid #dee2e6;
}
a.inav2:hover {
    text-decoration: none;
    color: var(--blueishText) !important;
    border: 1px solid var(--blueish);
    background-color: var(--blueish);
}

/******     TABLES      */
.table {    /*to override Bootstrap*/
    color: var(--bodyTextColor) !important;
    border-top: 0 !important;
}
td.headerCell, td.leftCorner, td.rightCorner {
    border-top: 0 !important;
    font-family: Poppins, Montserrat, Raleway, Verdana, Tahoma, Arial, Helvetica, sans-serif;
    background: var(--blueish);;
    color: var(--blueishText);  /*#ededed;*/
    font-weight: 400;
    text-align: left;
    vertical-align: top;
}
td.leftCorner {
    border-top-left-radius: 4px;
    min-width: 50px
}
td.rightCorner {
    border-top-right-radius: 4px;
}
td.headerCell.sortasc, td.leftCorner.sortasc, td.linksHeader.sortasc, td.linksHeader.sortdesc, td.rightCorner.sortasc {
    background-position: 100% 35%;
    background-repeat: no-repeat
}

td.headerCell.sortasc, td.leftCorner.sortasc, td.rightCorner.sortasc {
    background-image: var(--arrowUp);
    background-position: 100% 15%;
    background-repeat: no-repeat;
}

td.headerCell.sortdesc, td.leftCorner.sortdesc, td.rightCorner.sortdesc {
    background-image: var(--arrowDown);
    background-position: 100% 15%;
    background-repeat: no-repeat;
}

td.listingCell {
    padding: .35rem;
    border: 0;
}
td.linksHeader {
    background: var(--blueish);;
    color: var(--blueishText);
    padding: 4px 15px 4px 4px;
    vertical-align: top;
}

td.linksHeader.sortasc {
    background-image: var(--arrowUp);
}

td.linksHeader.sortdesc {
    background-image: var(--arrowDown);
}
td.summaryStats {
    border-width: 0 0 1px;
    padding-top: 2px;
    border-style: solid;
    vertical-align: top;
    border-color: #e8e8e8
}

tr.roweven {
    background-color: var(--roweven)
}
tr.roweven:hover{
    background-color: var(--rowevenHover)
}
tr.rowodd {
    background-color: transparent;
}
tr.rowodd:hover {
    background-color: var(--rowevenHover)
}

tr.highlight {
    cursor: pointer
}
tr a {
    text-decoration: none
}

.dropdown-toggle {
    border-color: var(--bodyTextColor);
    color: var(--bodyTextColor);
}
.dropdown-toggle:hover {
    /*border-color: blue;
    color: green;*/
}

/***** INDEX-LOGIN PAGE START */
/*https://codepen.io/wowthemesnet/pen/LgeQKd*/
.indexBody {
    height: 100%;
    width: 100%;
    margin: 0;
    padding: 0;
    color: #9a9a9a;
}
.left-index-panel {
    height : 100%;
    max-height: 100%;
    display : flex;
    justify-content : center;
    align-items : center;
    /*background: linear-gradient(to right, #141928, #1b2337);*/
}
.left-index-panel::before {
    background: linear-gradient(90deg, #202941 30%, #455e98 60%, #FFFFFF 100%);
    /*background: linear-gradient(90deg, #2d2d2d 30%, #455e98 60%, #FFFFFF 100%);*/
    content: "";
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: -1;
    opacity: 1 /*color on top*/
}
.left-index-panel::after {
    /*filter: drop-shadow(0 0 0.75rem #2a3554);*/
    filter: drop-shadow(8px 8px 20px #2a3554) drop-shadow(-1px 0 10px #313f64);
    /*filter: drop-shadow(-1px 0 6px #ffffff);*/
    background-image: url(../images/at.png);
    background-size: auto;
    background-position: top center;
    background-repeat: no-repeat;
    content: "";
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: -1;
    opacity: 1;
}

.right-index-panel {
    height : 100%;
    max-height: 100%;
    display : flex;
    align-items : center;
    /*background-color:#FFF;*/
    background: rgb(255,255,255);
    background: linear-gradient(90deg, rgba(255,255,255,1) 75%, rgba(211,214,225,1) 100%);
    color: #757575;
}

.titleMetaTag {
    font-family: Poppins, Montserrat, Raleway, Verdana, Tahoma, Arial, Helvetica, sans-serif;
    color: #4d7ccc;
    filter: drop-shadow(6px 6px 10px #202941) drop-shadow(-6px -6px 10px #202941);
    /*text-shadow: 1px 1px 1px #f8f8f8, -1px -1px 1px #f8f8f8;*/
    -webkit-text-stroke: 1px #4d7ccc;
    font-size: 1.9rem;
}
.titleMetaTag_div {
    margin-top: 5rem !important;
}
.nuevoMailer {
    font-family: Montserrat, Raleway, Verdana, Tahoma, Arial, Helvetica, sans-serif;
    color: #4d7ccc; /*gray 9a9a9a*/
    font-size: 1.1rem;
    opacity: 0.7;
}
a.langLink, a.langLink:link, a.langLink:visited, a.langLink:active{
    color: #4d7ccc; /*gray 9a9a9a*/
    text-decoration: none;
    opacity: 0.7;
}
.indexLangs {
    font-size: 90%;
    background-color: #27314e
}
.faIconIndex {
    color: #555555;
    font-size: 1.5em;
}

input[type="email"].login, input[type="password"].login {
    width: 100%;
    max-width: 260px !important;
    padding: 8px 10px;
    color: #808080;
    background-color: transparent;
    /*border: 1px solid #6c6c6c;
    border-radius: 12px;*/
    border-color: #a6a6a6;
    border-width: 0 0 1px 0;
}
input.login:-webkit-autofill {
    -webkit-box-shadow: 0 0 0 1000px #ffffff inset !important;
    -webkit-text-fill-color: #808080 !important;
}

input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus,
input:-webkit-autofill:active  {
    transition: background-color 86400s;
    -webkit-text-fill-color: #999 !important;
}
.submit-login {
    /*background: linear-gradient(#585858, #000000,#585858);*/  /*blackish*/
    background: linear-gradient(#4670b7,#4a77c3,#4670b7);   /*OK for blue*/
    color: #e7e7e7;
    width: 100%;
    max-width: 320px;
    margin-top: 20px;
    /*margin-left: 2.25em;*/
    border-radius: 8px;
    border: 1px solid #4670b7;
    padding: 8px 10px;
    /*background-color: transparent;  *//*2A4573*/
    cursor: pointer;
    text-decoration: none;
    display: inline-block;
    vertical-align: baseline;
    outline: 0;
    box-shadow: 0 0 3px 0 #e3e3e3;;
}
.submit-login:hover {
    background: linear-gradient(#4976c1, #4168ab, #4976c1); /*OK for blue*/
    /*background: linear-gradient(#333, #000000,#333);*/ /*blackish*/
    color:#FFFFFF;
    text-decoration: none;
}
/*** INDEX-LOGIN PAGE END   */

/*jqTableKitJs*/
.nosort {
    cursor: default
}
.sortcol {
    background-position: right center;
    background-repeat: no-repeat;
    cursor: pointer;
    padding-right: 20px
}
th.resize-handle-active {
    cursor: e-resize
}
div.resize-handle {
    border-right: 1px dashed var(--blueish);
    cursor: e-resize;
    left: 0;
    position: absolute;
    top: 0;
    width: 2px
}
.deleted {
    color: #ff0000
}

/** BOOTSTRAP OVERRIDES START*/

.dropdown-menu,
.dropdown-menu div.dropdown-item
/*
? Required to exclude the top nav menu: applies to campaigns, lists, ARs dropdowns
, .dropdown-submenu .dropdown-submenu .dropdown-item :not(.nav-link, a.nav-link)*/ {
    color: var(--bodyTextColor);
    background-color: var(--bodyBackColor);
}

ul.topminimenu.dropdown-menu {
    font-size: 100% !important;
    font-family: Poppins, Raleway, Montserrat,'segoe ui','Helvetica Neue','lucida grande',Verdana,sans-serif !important;
    background-color: var(--sidebar);
    /*margin-left:-22px;*/
}
ul.topminimenu a.nav-link,
ul.topminimenu li.dropdown-item {
    padding: .3em .3em;
    color: var(--menuItem) !important;
    text-decoration: none;

}
ul.topminimenu.dropdown-menu a.nav-link:hover
,ul.topminimenu li.dropdown-item:hover {
    text-decoration: none;
    background-color: var(--sidebar);
    color: var(--menuItemHover) !important;
}
ul.topminimenu li.dropdown-item.active:not(:hover) {
    /*padding: .3em .3em;*/
    color: var(--menuItemHover) !important;
    background-color: var(--blueish);
}

/* Required for mini dropdowns*/
.dropdown-menu div.dropdown-item:hover,
.dropdown-menu .dropdown-item:hover > .fas,
.dropdown-menu .dropdown-item:hover > .far  {
    background-color: var(--blueish);
    color: var(--menuItem);
}

.nav-pills .nav-link.active, .nav-pills .show>.nav-link {
    color: var(--blueishText);
    background-color: var(--blueish);
    text-decoration: none;
}
.btn {
    margin: 0.20em;
}
input[type=text]:read-only {
    background-color: #f4f7fa !important;
}
label {
    /* font-size: 1rem;
     text-shadow: 0 1px 0 #999;
     font-weight: 400;
     color: #424a52;*/
}
.form-control {
    color: var(--bodyTextColor);
    background: var(--bodyBackColor);
    font-size: 95%;
    height: calc(1.5em + 0.70rem + 2px);
    padding: 0.355rem 0.70rem;
    margin: 0.2rem 0.30rem 0 0;

}
.form-control-sm {
    color: var(--bodyTextColor);
    background: var(--bodyBackColor);
    font-size: 95%;
    border: 1px solid #ced4da;
    margin: 0.2rem 0.30rem 0 0;
}
.form-control:focus, .form-control-sm:focus {
    color: var(--bodyTextColor);
    background: var(--bodyBackColor);
}
/*  CHOSEN OVERRIDES  */
.chosen-container {
    font-size: 95% !important;
}
/*Gives background to whole container*/
.chosen-container .chosen-drop {
    background: var(--bodyBackColor);
}
/*Gives color to all li items except disabled both multi & single*/
.chosen-container .chosen-results {
    color: var(--bodyTextColor);
    background: var(--bodyBackColor);
}
.chosen-container .chosen-results li {
    line-height: 1.5;
}
/*What's already selected in the top box */
.chosen-container-multi .chosen-choices li.search-choice {
    color: var(--blueishText);
    background-color: var(--blueish);
}
/*Same as above for more inner targeting*/
.chosen-container-multi .chosen-choices li.search-choice span {
    /*color:  var(--bodyBackColor) !important;
    background-color: var(--bodyTextColor) !important;*/
}
/*First li in the drop-down*/
.chosen-container-multi .chosen-results li.highlighted {
    /*color: red;*/
}

/* Multi container  - Hover on li items*/
.chosen-container-multi .chosen-results li.active-result:hover {
    color: var(--blueishText);
    background-color: var(--blueish);
}
/* Already selected in the doprdown*/
.chosen-container-multi .chosen-results li.result-selected {
    /*color: var(--bodyBackColor);
    background-color: var(--blueish);*/
    opacity: 0.6;
}
/* HOver on already selected in the doprdown*/
.chosen-container-multi .chosen-results li.result-selected:hover {
    opacity: 0.6 !important;
    color: var(--blueishText) !important;
    background-color: var(--blueish) !important;
}

/*Single container, hover on li*/
.chosen-container-single .chosen-results li.active-result:hover {
    color: var(--blueishText);
    background-color: var(--blueish);
    cursor: pointer;
}
/* Single container: Already selected in the doprdown. Does not exist in chosen.css*/
.chosen-container-single .chosen-results li.result-selected {
    color: var(--blueishText);
    background-color: var(--blueish);
    opacity: 0.8;
}
/*It is done with highlighted*/
.chosen-container-single .chosen-results li.highlighted {
    cursor: default;
}
/* The above on hover*/
.chosen-container-single .chosen-results li.result-selected:hover {
    cursor: default;
}

.chosen-container-single .chosen-single {
    background-color: var(--bodyBackColor);
    color: var(--bodyTextColor) !important;
}
.chosen-container-single .chosen-single  span  {
    /*opacity: 0.9;*/
    /*color:  var(--bodyTextColor) !important;
    background-color: var(--bodyBackColor);*/
}

.chosen-container-multi .chosen-choices li.search-field input[type=text] {
    opacity: 0.7;
    color:  var(--bodyTextColor) !important;
    background-color: transparent;
}
.chosen-container-single .chosen-search input[type=text] {
    color:  var(--bodyTextColor) !important;
}


.chosen-container-active.chosen-with-drop .chosen-single {
    color:  var(--bodyTextColor) !important;
    background-color: var(--bodyBackColor);
    opacity: 0.7;
}
.list-group-item-mine::after {
    position: relative;
    font-family:"Font Awesome 5 Free";
    content: "\f055";
    font-weight: 900;
    font-size: 24px;
    right: 20px;
    float: right;
}
.list-group-item-mine.active::after {
    content: "\f056"
}
.popover {
    white-space: pre-line;
    /*white-space: pre-wrap;*/
    box-shadow: 3px 3px 6px 2px #a1a1a1 !important;
    border-radius: 12px;
    padding: 0  !important;
    background: var(--popOverBack);
    border: 0  !important;
}

.popover-header {
    padding: 0.75rem 0.85rem 0.5rem 0.85rem;
    font-weight: 500;
    font-size: 105% !important;
    margin-bottom: -0.5rem;
    background-color: var(--popOverBack);;
    color: #FFFFFF;
    border: 0  !important;
    font-family: Poppins, Raleway, Montserrat, Verdana, Arial, Tahoma, sans-serif;
    border-radius: 12px 12px 0 0;
}
.popover-body {
    padding: 0.5rem 0.85rem 0.75rem 0.85rem;
    font-size: 95% !important;
    font-weight: 400  !important;
    color: #FFFFFF;
    background: var(--popOverBack);;
    border: 0  !important;
    font-family: Poppins, Montserrat, Raleway, Verdana, Tahoma, Arial, Helvetica, sans-serif;
    border-radius: 12px 12px 12px 12px;
}
.popover-body a,
.popover-body a:link,
.popover-body a:visited,
.popover-header a,
.popover-header a:link,
.popover-header a:visited{
    color: #FFFFFF;
}
.popover-body a:hover  {
    color: #a8df36;
}
/*https://stackoverflow.com/questions/54337652/unable-to-change-the-color-of-bootstrap-popover-arrow*/
.arrow::after,
.bs-popover-top .arrow::after {
    border-bottom-color: var(--popOverBack); !important;
    border-top-color: var(--popOverBack); !important;
}
.arrow::after,
.bs-popover-bottom .arrow::after {
    border-top-color: var(--popOverBack); !important;
    border-bottom-color: var(--popOverBack); !important;
}

.bs-popover-top .popover-header::before, /* ? */
.bs-popover-bottom .popover-header::before {
    border-bottom: 0 !important;
}

.progress {
    height: 25px;
}
.progress-bar {
    font-size: 0.8rem;
}
.progress-bar-value {
    position: absolute;
    /*display: block; width: 100%;*/ /*centered*/
    /*top: 50%;left: 6%;transform: translate(0%,-50%);*/
    padding-left: .1em;
    text-shadow: 2px 1px 5px black;
}

.progress_div {
    border-radius: 4px;
    width: 100%;
    height: 26px;
    background-color: #E9ECEF;
    padding: 0;
}
.fill_bar {
    border-radius: 4px;
}
.dlvrd { background-color: #866ec7;}
.uvc { background-color: #009000; }
.ctv { background-color: #00B300; }
.uv { background-color: #006de2; }
.uc { background-color: #007BFF; }
.opt { background-color: #FFC107; }
.snz { background-color: #666666; }
.cmpl { background-color: #DC3545; }
.bnc { background-color: #f29704; }
.bnch {background-color: #FF5F0A; }
.fill_value {
    color:  #FFFFFF;
    font-size: 0.9rem;
    position: relative;
    padding: .1em .4em;
    text-shadow: 2px 2px 4px black;
}
.no_fill_value {
    font-size: 0.9rem;
}
.popUnderlined {
    border-bottom: 2px dotted #b3b3b3;
    padding-bottom: 2px;

}
.alert {
    text-align: center;
    min-width: 400px;
}

.toast {
    min-width: 300px;
}
.toast-header {
    cursor: move;
    background-color: var(--blueish);
    color:  var(--blueishText);!important;
    font-size: 105% !important;
    font-weight: 400 !important;
}
.toast-close-button {
    color:  var(--blueishText) !important;
}
.toast-body, .toast-body > a {
    font-size: 100% !important;
    background-color: var(--bodyBackColor);
    color:  var(--bodyTextColor);!important;
}


.custom-control-input:focus~.custom-control-label::before {
    border-color: var(--blueish) !important;
    box-shadow: 0 0 0 0.2rem rgba(71, 143, 36, 0.25) !important;
}

.custom-control-input:checked~.custom-control-label::before {
    border-color: var(--blueish) !important;
    background-color: var(--blueish) !important;
}

.custom-control-input:active~.custom-control-label::before {
    background-color: var(--blueish) !important;
    border-color: var(--blueish) !important;
}

.custom-control-input:focus:not(:checked)~.custom-control-label::before {
    border-color: var(--blueish) !important;
}

.custom-control-input-green:not(:disabled):active~.custom-control-label::before {
    background-color: var(--blueish) !important;
    border-color: var(--blueish) !important;
}

/*BOOTSTRAP OVERRIDES END*/

/* jquery UI */
.ui-widget{
    /*font-size: 95%*/
}
.ui-widget-content{
    background: var(--bodyBackColor);
    color: var(--bodyTextColor);
}
.ui-datepicker-header {
    background: var(--blueish);  !important;
}
.ui-datepicker .ui-datepicker-prev, .ui-datepicker .ui-datepicker-next {
    background-color: #ededed;
}
.ui-widget.ui-widget-content_cs {
    padding: 0px 1px 1px 1px !important;
    /*border: 1px solid #000 !important;*/
}
.ui-widget-header_cs {
    border: 1px solid var(--blueish);
    background: var(--blueish);
}
.ui-dialog-content_cs {
    color: #212529 !important;
    padding: 10px 5px 5px 10px !important;
    /*border: 1px solid #000 !important;*/
    margin: 0 !important;
}
.ui-dialog-titlebar_cs {
    border-radius: 3px !important;
    border: 0 !important;
    background: var(--blueish);  !important;
}
.ui-dialog-title_cs {
    color: var(--blueishText)  !important;
    font-weight: 400  !important;
    font-size: 130%  !important;
    font-family: Poppins, Montserrat, Raleway, Verdana, Tahoma, Arial, Helvetica, sans-serif;
}
.ui-dialog .ui-dialog-content {
    background: var(--bodyBackColor);
}
.ui-resizable-handle {
    width: 10px !important;
    height: 10px  !important;;
    /*background: var(--blueish); Optional: to make it more visible */
}

/*  UI TABS
    E.g. Htrml newsletter, Text, multipart tabs when creating campaign*/
.ui-tabs-nav  { /* the area around */
    background: var(--bodyBackColor);
    border: 0;
}
.ui-tabs .ui-tabs-nav li {  /* not active */
    padding: 4px;
    border: 1px solid var(--blueishText);
    color: var(--bodyTextColor) !important;
    /*background: red !important;*/
}
.ui-tabs .ui-tabs-nav li.ui-tabs-active {
    padding: 4px;
    border: 1px solid var(--blueishText);
    background: var(--blueish) !important;
}
.ui-tabs .ui-state-active,
.ui-tabs .ui-state-active >a  {
    /*background: var(--blueish) !important;*/
    color: var(--blueishText)  !important;
    font-weight: 500;
}
.ui-tabs .ui-tabs-nav li:hover {
    background-color: var(--blueish);
    color: var(--blueishText)  !important;
}
.ui-tabs .ui-tabs-nav li:hover >a {
    color: var(--blueishText)  !important;
}

.ui-tooltip {
    border: 1px solid #cad1d7 !important;
    border-radius: 4px;
}
.my_tooltip {
    color: #212529  !important;
    font-size: 100% !important;
    font-weight: 400  !important;
    background: #f0f8ff !important;    /*fffdfd*/
    padding: 0.15rem 0.35rem 0.15rem 0.35rem !important;
}

/*new*/
.sidebar {
    background: var(--sidebar);
    background-image: url("../images/sidebar_wm.png");
    background-repeat: no-repeat;
    background-position: center bottom;
}

.wrapper{display:flex;text-decoration:none;transition:all .4s}
.sidebarToggler{
    padding:.4em .2em;z-index:2;text-decoration:none;
    font-size:1.3rem;
    color:var(--menuItem);
    cursor:pointer
}


/*affects all menu items*/
.navbar-custom, .navbar-custom .dropdown-menu   {
    font-size: 100% !important;
    font-family: Poppins, Raleway, Montserrat,'segoe ui','Helvetica Neue','lucida grande',Verdana,sans-serif !important;
}
.navbar-custom .dropdown-menu {
    background-color:transparent;
    border:0; border-radius:10px;
    padding-left:14px; margin-top:-8px;
    max-width: 235px;
}
.navbar-custom .nav-link,.navbar-custom .dropdown-item {
    /*font-size: 125% !important;*/
    color: var(--menuItem);
    background:transparent;
    width:100%;
    white-space:normal;
    padding:.2em 0;
    margin:0;
    display:inline-block;
    text-decoration:none;
    cursor:pointer;
}
/*only the direct child <li> elements of the <ul> navbar-nav and navbar-custom*/
.navbar-nav.navbar-custom > li {
    /*padding-bottom: 6px;*/
}
/*targets <a> elements with class nav-link that are direct children of <li> elements with class nav-item, which in turn are descendants of an element with the class navbar-custom*/
.navbar-custom li.nav-item > a.nav-link{
    padding-left:.4em;
    padding-top:.6rem;
    padding-bottom:.6rem;
}
.navbar-custom li.nav-item:hover > a.nav-link.dropdown-toggle {
    color: var(--menuItemHover) !important;
    /*Nice alternative:
        color: var(--blueishText) !important;
        background-color: var(--blueish);
    */
}
/* The left side border */
.navbar-custom li.nav-item.active {
    border-left:2px solid var(--menuItemHover);
}
/*Applies on Newsletters when Html>View-edit is active
 Applies to Home, Triggers when active */
.navbar-custom li.nav-item.active.expanded > a.nav-link {
    border-radius:0 6px 6px 0;border-width:1px 0 0 1px;border-style:solid;
    border-color: var(--blueish);
    background-color: var(--blueish);
    color: var(--blueishText) !important;

}
/*Applies on "Html newsletters" when View-edit is active */
.navbar-custom .nav-link.dropdown-toggle.active{
    color: var(--menuItemHover) !important;
}
/*Applies on HOVER on ALL sub-items under a top level item like "Subscribers"
    but not at "Subscribers" */
.navbar-custom li.dropdown-item:hover > a.nav-link{
    color: var(--menuItemHover) !important;
}
/* Active items like "View all" & "View & edit" */
.navbar-custom li.dropdown-item.active > a.nav-link{
    color: var(--menuItemHover) !important;
}
.navbar-custom li.dropdown-item.active > a.nav-link::after{content:"\2192";font-size:120%;opacity:1;padding-left:6px}
.mainPageContent{transition:0!important}

/*Home & Triggers: no dropdown*/
.navbar-custom li.nav-item.top-level:hover > a.nav-link {
    color: var(--menuItemHover);
}


/*searchAll.php*/
.ui-menu .ui-menu-item {
    color: var(--bodyTextColor);
}

/*  Smaller screens we use onclick*/
@media (max-width: 991px) {
    .topHeaderIconsBox {
        padding: 0;
        /*background: var(--sidebar) !important;*/
        border-radius: 4px;
        transition:top .2s ease-in-out;
        position:fixed;
        top:5px;
        right:5px;
        z-index:1000;
        /*text-align: center;*/
    }
    .topHeaderIcons {
        padding: 0.5rem !important;
    }
    .left-index-panel {
        background: linear-gradient(to bottom, #000, var(--blueish));
    }
    .titleMetaTag_div {
        margin-top: 1rem !important;
    }

    .calculator tr {    display: table;  width:100%; padding:12px;text-align: left}
    .calculator td {    display: table-row;padding:12px;text-align: left}
    .goToCampaign {
        display: block;
        position: relative;
        top: 0;
        visibility: hidden;
    }
    /*index*/
    .left-index-panel-content {margin: 0; padding: 20px}
    .right-index-panel-content {margin: 0;}
    .right-index-panel {
        justify-content : center;
        background:#FFF;
    }
    /*new*/
    .mainPageContent{width:100%;margin-left:0!important}
    .mainPageContent.active{margin-left:235px!important}
    #sidebar{margin-left:-235px!important;width:235px;transition:all .4s}
    #sidebar.active{margin-left:0!important;position:fixed;max-width:235px!important;height:100vh;transition:all .4s;left:0;top:0;z-index:2!important}
    #sidebarCollapse span{display:none}
}
/*new*/
#sidebar{margin-left:-235px;position:fixed;left:0;top:0;width:235px;max-width:235px;height:100vh;
    z-index:2}
.mainPageContent{min-width:height 100vh;width:100%;margin-left:235px}

@media (min-width: 992px) {
    .goToCampaign {
        display: block;
        position: relative;
        top: -250px;
        visibility: hidden;
    }
    /*index*/
    .h-md-100 {height: 130vh;}
    .left-index-panel-content {margin-bottom: 60%;padding:0}
    .right-index-panel-content {margin-bottom: 35%;}

    /*new*/
    #sidebar.collpased{margin-left:0;position:fixed;left:0;top:0;width:30px;max-width:30px;transition:all .2s;z-index:1}
    #sidebar.collpased:hover{margin-left:0;width:235px;max-width:235px;z-index:2;transition:width .2s}
    #sidebar.expanded{margin-left:0;min-width:235px;max-width:235px;transition:0!important}
    .mainPageContent.contract{margin-left:235px;transition:width .9s}
    .mainPageContent.expand{margin-left:30px;width:100%;transition:0!important}
} /*min-w 992*/

@media (min-width: 2600px) {
    /*new*/
    html{max-width:2610px}
}

/*Custom radios and checkboxes*/
.checkbox label:after, .radio label:after {content: ''; display: table; clear: both;}

.checkbox .cr, .radio .cr {
    position: relative;
    display: inline-block;
    border: 1px solid #a9a9a9;  /*var(--bodyTextColor)*/
    border-radius: .25em;
    width: 1.2em;
    height: 1.2em;
    float: left;
    margin-right: .5em;
}

.radio .cr {
    border-radius: 50%;
}

.checkbox .cr .cr-icon,
.radio .cr .cr-icon {
    color: var(--headings);
    position: absolute;
    font-size: .9em;
    line-height: 0;
    top: 48%;
    left: 7%;
}
.radio .cr .cr-icon {
    margin-left: 0.04em;
}
/*hide*/
.checkbox label input[type="checkbox"],
.radio label input[type="radio"] {
    display: none;
}

.checkbox label input[type="checkbox"]+.cr>.cr-icon,
.radio label input[type="radio"]+.cr>.cr-icon {
    opacity: 0;
}

.checkbox label input[type="checkbox"]:checked+.cr>.cr-icon,
.radio label input[type="radio"]:checked+.cr>.cr-icon {
    opacity: 1;
}

.checkbox label input[type="checkbox"]:disabled+.cr,
.radio label input[type="radio"]:disabled+.cr {
    opacity: .5;
}
/*jquery UI - openAlertBox */
.ui-dialog_nv {
    margin: 0 !important;
    padding: 0 !important;
    /*background: #FFF !important;*/
    border: 0 !important;
    border-radius: 0 !important;
    box-shadow: #535353 0 18px 26px 0 !important;
}
.ui-dialog-content_nv {
    margin: 0 !important;
    color: var(--bodyTextColor) !important;
    text-align: center !important;
    padding: 1.1rem 0.8rem 0.8rem 0.8rem !important;
}
.ui-dialog-titlebar_nv {
    /*background: linear-gradient(#1d193b, #212121);*/
    background: linear-gradient(#232323, #212121);
    border-bottom: 2px solid var(--blueish);
}
.ui-dialog_nv .ui-dialog-titlebar-close_nv {display:none;}

.ui-dialog-title_nv {
    margin: 0 !important;
    padding: 0.6rem 0 0.6rem 0;
    text-align: center !important;
    vertical-align: middle;
    color: #F0F0F0 !important;
    font-weight: 500 !important;
    font-size: 130% !important;
}
.ui-dialog-buttonpane_nv {
    text-align: center !important;
    border: 0 !important;
    background-image: none !important;
    /*background: transparent !important;*/
    background: var(--bodyBackColor);
    padding-bottom: 1.2rem !important;
    margin: 0 !important;
}
.ui-dialog_nv .ui-dialog-buttonpane_nv .ui-dialog-buttonset_nv {
    float: none;
}
.ui-dialog_nv .ui-dialog-buttonpane_nv button {
    margin: .5em .8em .5em 0;
    cursor: pointer;
}
.ui-button_nv  {}
.tox-statusbar__branding {display: none !important;}

/** Boostrap custom switch */
.green .custom-control-input:focus~.custom-control-label::before {
    border-color: #28a745 !important;
    box-shadow: 0 0 0 0.2rem rgba(73, 255, 28, 0.25) !important;
}

.green .custom-control-input:checked~.custom-control-label::before {
    border-color: #28a745 !important;
    background-color: #28a745 !important;
}

.green .custom-control-input:active~.custom-control-label::before {
    background-color: #28a745 !important;
    border-color: #28a745 !important;
}

.green .custom-control-input:focus:not(:checked)~.custom-control-label::before {
    border-color: #28a745 !important;
}

.custom-control-input-green:not(:disabled):active~.custom-control-label::before {
    background-color: #28a745 !important;
    border-color: #28a745 !important;
}
.highlight {
    background-color: #EEF43B;
}