body{font-family: Roboto, sans-serif;font-weight: 400;margin:0px}

.w150{width:150px}
.w250{width:250px}
.w350{width:350px}
.w450{width:450px}
.w550{width:550px}
.w650{width:650px}


.help-hook{position:absolute;top:0;left:0;z-index:30}
.help-hook .hook{position:absolute;top:4px;left:5px;background-color:#b642ff;border-radius:40px;line-height:40px;width:40px;text-align:center;box-shadow:2px 3px 10px 0 rgb(0 0 0 / 40%);
color:white;cursor:pointer;border:1px solid #000000;text-shadow:1px 1px 1px #000000;transition: opacity 0.5s;font-size:30px;font-weight:bold;opacity:0}
.help-hook.loaded .hook{opacity:1}
.help-content .hcover{z-index:30;display:none;background:#00000055;position:fixed;top:0;bottom:0;left:0;width:100%}
.help-content .hcontent{z-index:31;display:none;background:#FFFFFF;position:fixed;top:0;bottom:0;right:0;width:0%;box-shadow:-2px 0 4px 0 rgba(0,0,0,0.4);transition: width 0.5s}
.help-content .hcontent .helphead{background:#D9D9D9;padding:20px;height:16px}
.help-content .hcontent iframe{width:100%;height:100%;border:none}
.help-content .hclose{font-size:16px;display:none;cursor:pointer;color:#000000;float:right}

.help-hook.active .hook{right:50%;margin-right:10px}
.help-content.active .hclose{display:block;}
.help-content.active .hcover{display:block;}
.help-content.active .hcontent{display:block;width:50%}



.flashcard{position:fixed;top:20px;left:20px;z-index:999999;padding:20px;width:300px;
box-shadow:0 10px 20px 0 #00000088;background-color:#FFFF00;color:#000000;border-radius:4px;}

.flashcards_cnt{position:fixed;top:20px;left:20px;z-index:999999;}
.flashcards_cnt .flashcard{position:relative;margin-bottom:4px}

.res{position:relative;}
.leftj{text-align:left}
.rightj{text-align:right}
.mt {
background-color: #13353f;
padding: 5px; /*box-shadow:-40px 0 50px -10px rgba(0,0,0,0.4) inset;*/
margin-bottom: 2px
}
.update-treshold{display:inline-block;background:#DD0000;color:#FFFFFF;padding:3px 5px;border-radius:2px}

.menu{width:240px;position:fixed;left:0;top:0;bottom:0;background:#13353f;z-index:10}
.menu{overflow-y:scroll;-ms-overflow-style:none;scrollbar-width:none}
.menu::-webkit-scrollbar{display:none}

/*.menu.disabled{overflow:hidden;width:224px;padding-right:16px}*/
.content{left:241px;position:fixed;right:0px;top:0;bottom:0;z-index:15;overflow:scroll}
.scnt{width:99.9%}

body.modal{position:fixed;left:0;right:0}
.mt.modal{position:fixed;top:10%;left:50%;margin-left:-116px;z-index:9999999;box-shadow:0 4px 10px 0 rgba(0,0,0,0.4);border-radius:3px;}
body>.cover{position:fixed;top:0;bottom:0;left:0;right:0;background-color:rgba(0,0,0,0.7);z-index:9}
.menu.disabled>.cover{position:fixed;top:0;bottom:0;left:0;width:240px;background-color:rgba(0,0,0,0.7);z-index:11}
.mt.modal ttl span{display:block !important;float:right;}

.mt.modal .ml.sel a{background-color:#004396}

:not(.cnt)>.menu .mt{position:relative}
:not(.cnt)>.menu .mt.collapsed{height:19px;overflow:hidden}
:not(.cnt)>.menu .mt .aricon{position:absolute;right:6px;top:6px;width:18px;transition: transform 0.5s ease;color:white;transform: rotate(180deg);}
:not(.cnt)>.menu .mt.collapsed .aricon{transform: rotate(0deg);}
:not(.cnt)>.menu .mt.red.collapsed ttl{color:red}

.cnt .menu .mt.home,
.cnt .menu .mt .aricon{display:none}


.icon-after{position:relative;}
.icon-after::after{content:"";display:block;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;width:32px;height:32px;background:#000000;position:absolute;right:2px;top:2px}
.icon-after.edit::after{-webkit-mask-image:url("/icons/edit.svg");mask-image:url("/icons/edit.svg");}

.icon{-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat}
.icon.edit{-webkit-mask-image:url("/icons/edit.svg");mask-image:url("/icons/edit.svg");}


.cog,.archive,.activate,.recordedit,.collection{margin-top:-5px;vertical-align:middle;display:inline-block;position:relative;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;}
.archive{width:24px;height:24px;-webkit-mask-image:url("/icons/remove-document.svg");mask-image:url("/icons/remove-document.svg");background:#ce5d5d}
.activate{width:24px;height:24px;-webkit-mask-image:url("/icons/add-document.svg");mask-image:url("/icons/add-document.svg");background:#00b962}
.recordedit{width:20px;height:20px;-webkit-mask-image:url("/icons/edit.svg");mask-image:url("/icons/edit.svg");background:blue}
.collection{width:20px;height:20px;-webkit-mask-image:url("/icons/collection.svg");mask-image:url("/icons/collection.svg");background:blue}
.cog{width:24px;height:24px;-webkit-mask-image:url("/icons/cog.svg");mask-image:url("/icons/cog.svg");background:blue}

.nb{white-space:nowrap;}/*non brake*/
.moveright{float:right}

.mt ttl {
display: block;
text-align: left;
font-weight: bold;
padding: 4px 10px;
color: #FFFFFF
}
a{text-decoration:none;color:#0000FF}
a:hover{text-decoration:underline !important;color:#00BB00;cursor:pointer;}
.c{text-align:center}
.rj{text-align:right}
.lj{text-align:left}
.ml a {
position:relative;
display: block;
background-color: #051318;
color: #FFFFFF99 !important;
padding: 8px 10px;
margin-bottom: 3px;
text-decoration: none;
border-radius: 2px;
box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.4);
}

.ml.active a {
    color: #000000 !important;
    border-radius: 3px;
    box-shadow: none;
    background: #38c7f1;
    padding: 8px 10px;
}
.ml.inactive a {
background: #333333;
color:#888888 !important;
}



.testsite{position:relative;z-index:999999;background-color:#FFFF00;color:#000000;height:20px;line-height:20px;font-size:16px;font-weight: bold;text-align:center}

.ml a:hover{
    background-color: #38c7f1;
    color: #000000 !important;
    box-shadow: 0 3px 5px 0 rgba(0, 0, 0, 0.4) inset;
    text-decoration: none !important;
}

.ml.active a{
    color: #000000 !important;
    box-shadow: none;
    background-color: #38c7f1;
}

div.cnt {
    padding: 15px;
    height: 100%;
}

h1 {
    background-color: #F5F5F5;
    margin: -10px -10px 10px -10px;
    padding: 10px;
    box-shadow: 0 6px 11px -6px rgba(0, 0, 0, 0.4);
}

div.h1 {
    height: 50px;
    background-color: #38c7f1;
    color: #FFFFFF;
    line-height: 50px;
    padding: 0 10px 0 60px;
    font-size: 25px;
    box-shadow: 0 2px 3px 0 rgba(0, 0, 0, 0.4);
    z-index: 3;
    position: relative;
}

div.function-panel {
    background-color: #f0ad4e;
    padding: 1px 15px 15px 15px;
    margin: -16px -16px 15px -16px;
}

div.function-panel * {
    vertical-align: middle;
    line-height: 30px !important;
    outline: none
}

div.function-panel select,
div.function-panel input[type="text"] {
    border-radius: 2px;
    border: 1px solid #555555;
    padding: 4px 7px;
    font-size: 16px
}

/*div.function-panel select{height:27px}height:25px;*/
div.legend {
    padding: 4px 10px;
    background-color: #FFFFFF;
    border-radius: 3px;
    margin-top: 10px
}

.hidden {
    display: none
}

.dn {
    display: none
}

a:visited {
    color: #0000FF
}

a:hover {
    text-decoration: none
}

table {
    border-spacing: 0;
    border-collapse: separate;
    border: 1px solid #AAAAAA;
    width: 100%;
    border-radius:.25rem
}

table.adm th, table.adm td {
    padding: 5px;
    font-size: 0.9em
}

table.adm th {
    background-color: #CCCCCC;
    border-bottom: 1px solid #AAAAAA;
    border-left: 1px solid #AAAAAA
}
table.adm td{border-bottom: 1px dotted #AAAAAA;border-left: 1px dashed #DDDDDD}
table.adm th:first-child,table.adm td:first-child{border-left:none!important}

table.adm tr:nth-child(even) {
    background-color: #F5F5F5
}

table.adm tr:hover td {

}

table.adm.clients td.red {
    background-color: #CC0000
}

table.adm td.actions {
    text-align: center;
    line-height: 50px;
    vertical-align: middle;
    background: #F5F5F5
}

table.adm td.actions input[type="submit"], td.actions input[type="button"] {
    border: none;
    background: #777777;
    color: #FFFFFF;
    border-radius: 3px;
    margin: 3px 10px;
    padding: 5px 15px;
    font-size: 15px;
    cursor: pointer
}

.rel {
    position: relative
}

.abs {
    position: absolute
}

.bgr {
    background: #ffaa00;
    padding: 0 2px
}

.bgri {
    background: #00ffaa;
    padding: 0 2px
}

.fs12 {
    font-size: 12px
}

.fs13 {
    font-size: 13px
}

.fs14 {
    font-size: 14px
}

.fs15 {
    font-size: 15px
}

.fs16 {
    font-size: 16px
}

.fs17 {
    font-size: 17px
}

input[type="submit"], input[type="button"], button, .btn, .btn-link {
    line-height: 18px;
    cursor: pointer;
    background: #777777;
    font-size: 14px;
    border-radius: 3px;
    text-transform: uppercase;
    border: 1px solid #555555;
    padding: 2px 10px;
    color: #ffffff !important;
    text-decoration: none;
}

input[type="submit"]:hover, input[type="button"]:hover, .btn:hover, button:hover, .btn-link:hover {
    box-shadow: 1px 1px 3px 0 rgba(0, 0, 0, 0.7)
}



/* end global */

/* from clients module */
/*.ur-email.cst,.fu-renewal.cst,.follow-up.cst,.perf-acc.cst,.promo-acc.cst,.from-feed.cst{float:none;display:inline-block}*/
.from-feed {
    float: right;
    background: darkorchid;
    padding: 3px;
    border-radius: 3px;
    color: white;
    font-size: 10px;
    margin-left: 10px;
    box-shadow: 1px 1px 3px 0 rgba(0, 0, 0, 0.9) inset;
    text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.9)
}

.lsyndication {
    float: right;
    background: rgb(50, 186, 204);
    padding: 3px;
    border-radius: 3px;
    color: white;
    font-size: 10px;
    margin-left: 10px;
    box-shadow: 1px 1px 3px 0 rgba(0, 0, 0, 0.9) inset;
    text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.9)
}

.promo-acc {
    float: right;
    background: lightgreen;
    padding: 3px;
    border-radius: 3px;
    color: white;
    font-size: 10px;
    margin-left: 10px;
    box-shadow: 1px 1px 3px 0 rgba(0, 0, 0, 0.9) inset;
    text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.9)
}

.perf-acc {
    float: right;
    background: red;
    padding: 3px;
    border-radius: 3px;
    color: white;
    font-size: 10px;
    margin-left: 10px;
    box-shadow: 1px 1px 3px 0 rgba(0, 0, 0, 0.9) inset;
    text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.9)
}

.follow-up {
    float: right;
    background: magenta;
    padding: 3px;
    border-radius: 3px;
    color: white;
    font-size: 10px;
    margin-left: 10px;
    box-shadow: 1px 1px 3px 0 rgba(0, 0, 0, 0.9) inset;
    text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.9)
}

.fu-renewal {
    float: right;
    background: brown;
    padding: 3px;
    border-radius: 3px;
    color: white;
    font-size: 10px;
    margin-left: 10px;
    box-shadow: 1px 1px 3px 0 rgba(0, 0, 0, 0.9) inset;
    text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.9)
}

.ur-email {
    float: right;
    background: yellow;
    padding: 3px;
    border-radius: 3px;
    color: black;
    font-size: 10px;
    margin-left: 10px;
    box-shadow: 1px 1px 3px 0 rgba(0, 0, 0, 0.9) inset;
    text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.9)
}

.cst {
    float: none;
    display: inline-block
}

.legend .cst {
    padding: 0 5px
}

/*.ur-email.cst,.fu-renewal.cst,.follow-up.cst,.perf-acc.cst,.promo-acc.cst,.from-feed.cst{float:none;display:inline-block}*/

table.clients {
    border-spacing: 0;
    border-spacing: 0
}

table.clients th, table.admin_clients td {
    text-align: left
}
table th{color: #000000 !important;background: #dddddd !important;border-bottom: 2px solid #000000;text-shadow: 1px 1px 1px white;}
.admin_clients{border:1px dotted #dddddd;box-shadow:0px 1px 2px 0 #cccccc;font-size:12px;}
.admin_clients tr th {border-left:1px dotted #DDDDDD;line-height:16px;height:24px;background:#e5e5e5}
.admin_clients tr td {border-top:1px dotted #DDDDDD;border-left:1px dotted #DDDDDD;height:24px;padding:0px 4px;}
.admin_clients tr th.no-brd,.admin_clients tr td.no-brd{border-left:none;}
table.admin_clients tr th.l{text-align: left !important;}

a.button {
    display: inline-block;
    background-color: #DDDDDD;
    color: #000000;
    min-width: 110px;
    text-align: center;
    padding: 4px 10px;
    border-bottom: 2px solid #CCCCCC;
    text-decoration: none;
    font-weight: bold;
}
a.button.disabled{color:#F5F5F5}
a.button:hover {
    border-color: #aa0000;
    background-color: #AAAAAA;
}
span.custom_statuses{display:inline-block;border-radius:3px;
    background-color: #D5D5D5;
    border: 1px solid #FFFFFF;
    font-size: 10px;
    padding: 3px;
    color: #FFFFFF;
    text-shadow: 1px 0px 1px #aaaaaa;
}
span.custom_statuses.st_err{background-color:#EE0000/*F59E51*/;}
span.custom_statuses.st_2,
span.custom_statuses.st_16,
span.custom_statuses.st_32{background-color:#EE0000/*D01616*/;}
span.custom_statuses.st_4,
span.custom_statuses.st_8,
span.custom_statuses.st_128{background-color:#47ca40/*559E51*/;}
span.custom_statuses.st_256{background-color:#F61CF7;}

th.client_info {
    background-color: grey
}

th.stats {
    background-color: red
}

th.action {
    background-color: green
}

div.td-name {
    min-width: 200px;
    overflow-x: hidden
}

.cst34329 {
    cursor: help;
    margin-top: 4px;
    background: #ffcccc;
    text-align: center;
    padding: 2px 0;
    box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.4) inset;
    border-radius: 3px;
    text-shadow: 1px 1px 1px rgba(255, 255, 255, 1);
}

.sendc a {
    font-size: 1.2em;
    letter-spacing: -1px
}

.pty {
    padding: 2px 4px;
    float: left;
    clear: right;
    margin: 0 1px;
    border-radius: 3px
}

.pty.rt {
    background: #ffffff;
    color: #dddddd;
    box-shadow: 0 0 2px 0 rgba(0, 0, 0, 0.2) inset;
}

.pty.se {
    background: #00cc00;
    color: #ffffff;
    box-shadow: 0 0 3px 0 rgba(0, 0, 0, 0.7) inset;
    text-shadow: 1px 1px 1px #000000
}

.prmax {
    margin-top: 25px;
    font-size: 1.5em;
    color: #999999
}

td.action span {
    display: inline-block;
    padding: 3px 10px;
    border-radius: 3px
}

td.action span[active] {
    background-color: #00FF00;
    color: #000000;
}

td.action span[pending] {
    background-color: #ffff55;
    color: #000000;
}

td.action span[inactive] {
    background-color: #e031c1;
    color: #ffffff;
}

td.action span[supended] {
    background-color: #ff0000;
    color: #ffffff;
}

td.action span[deleted] {
    background-color: #fb7600;
    color: #000000;
}

span.outside-ca {
    display: inline-block;
    padding: 3px 10px;
    border-radius: 3px;
    background-color: #ff0000;
    color: #ffffff;
}

/* custom headers module */
.sample {
    width: 28px;
    height: 28px;
    float: left;
    margin-right: 5px;
    border: 1px solid #CCCCCC
}

.csthead .grad {
    width: 58px;
    height: 28px;
    float: left;
    margin-right: 5px;
    border: 1px solid #CCCCCC
}

.csthead th {
    text-align: left
}

.csthead input[type="text"] {
    border: 1px solid #CCCCCC;
    font-size: 15px
}

.csthead input[type="text"][readonly] {
    border: none;
    background: transparent;
    color: #000000
}

.csthead td.status {
    position: relative
}

.csthead td.status select {
    position: relative;
    z-index: 4
}

.csthead .saved-status {
    position: absolute;
    background-color: #00AA00;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    z-index: 1;
    opacity: 0
}

.preview {
    margin: 0 0 20px 0;
    padding: 20px;
    background-color: #f2ece1
}

.preview .cell {
    background-color: #ffffff;
    width: 1100px;
    height: 200px;
    box-shadow: 0 2px 8px 0 rgba(0, 0, 0, 0.4);
    margin: 0 auto;
    border-radius: 3px;
    overflow: hidden;
    padding: 0;
}

.preview .cell .head {
    margin: 0;
    padding: 0;
    background-color: #CCCCCC
}

.preview .cell .head h2 {
    margin: 0 240px 10px 15px;
    padding: 10px 0 0 0;
    font-size: 23px;
    line-height: 30px;
}

.preview .cell .head span {
    background-color: #000000;
    color: #FFFFFF;
    padding: 4px 0 4px 17px;
    font-size: 1.3em;
    width: 100%;
    display: block
}

.preview .agency-header {
    float: right;
    background-image: url('/assets/images/realestate-agency/default-res.png');
    background-repeat: no-repeat;
    background-size: cover;
    width: 215px;
    height: 112px
}

table.adm.csthead td img, table.adm.csthead td a {
    vertical-align: middle;
    line-height: 50px
}

table.adm.csthead td a {
    color: #0000FF;
    text-decoration: underline
}

/* chm - image uploader */
#wrapper {
    position: fixed;
    z-index: 10;
    background: #FFFFFF;
    padding: 0 20px;
    box-shadow: 0 3px 10px 0 rgba(0, 0, 0, 0.4);
    left: 50%;
    margin-left: -315px
}

#wrapper #result {
    height: 220px;
    width: 430px;
    margin: 20px auto 0;
    box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.4);
}

#wrapper #holder {
    margin-bottom: 20px;
}

#wrapper input[type="button"] {
    border: none;
    color: #FFFFFF;
    background-color: #CC0000;
}

#wrapper input[type="button"][disabled] {
    background-color: #CCAAAA;
}

#pagination-wrapper {

}



.btn {
    text-decoration: none;
    color: #000000 !important;
}

div.function-panel select {
    padding: 10px;
}

.select-box {
    width: 150px;
    padding: 5px;
    font-size: 16px;
}

.form-control {
    display: block;
}

.no-border {
    border: none !important;
}

.send-reply-btn {
    margin-right: 20px;
}

.error-wrapper {
    color: white;
    background: red;
    padding: 10px;
}

.error-wrapper p {
    margin: 0;
}

.hide {
    display: none !important;
}
.login-account-btn{
    background: #0f0;
    border-color: #19e219;
    font-weight: bold;
    display: inline-block;
    margin: 5px 0;
}
.bg-green{
    background: green;
    padding: 3px 10px;
    color: white;
    border-radius: 3px;
}
.bg-yellow{
    background: yellow;
    padding: 3px 10px;
    color: black;
    border-radius: 3px;
}
.bg-red{
    background: red;
    padding: 3px 10px;
    color: white;
    border-radius: 3px;
}
.bg-blue{
    background: dodgerblue;
    padding: 3px 10px;
    color: white;
    border-radius: 3px;
}

.stat-container{
margin-bottom: 10px;
display:grid;
grid-template-columns: repeat(5, 1fr);
}
.stat-box{
padding: 10px 10px;
font-size:22px;
font-weight:bold;
display:inline-block;
text-align:center
}
.stat-box.active,
.stat-box.confirmed,
.stat-box.active-confirmed
{background:#31d838}

.stat-box.pending{
    background: #d8a212;
}
.stat-box.disabled{
    background: #8d8e91;
}
.stat-box.bounced{
    background: #0089d8;
}
.stat-box.unsubscribed{
    background: #d80004;
}
.success{
    background: #00ff0a;
    padding: 2px 5px;
    border-radius: 3px;
}
.warning{
    background: #d8a212;
    padding: 2px 5px;
    border-radius: 3px;
}
.default{
    background: #8d8e91;
    padding: 2px 5px;
    border-radius: 3px;
}

.allowed-ip-tbl td{
    padding-right: 20px !important;
    padding-bottom: 10px !important;
}

/* Tooltip container */
.tooltip {
    position: relative;
    display: inline-block;
}

/* Tooltip text */
.tooltip .tooltiptext {
    visibility: hidden;
    width: 300px;
    background-color: white;
    color: #000;
    padding: 15px;
    border-radius: 3px;
    /* Position the tooltip text - see examples below! */
    position: absolute;
    z-index: 3;
    bottom: -5px;
    left: 105%;
    white-space: pre-wrap;
    -webkit-box-shadow: 0px 0px 9px 0px rgba(0,0,0,0.48);
    /* -moz-box-shadow: 0px 0px 9px 0px rgba(0,0,0,0.48); */
    box-shadow: 0px 0px 9px 0px rgba(0,0,0,0.48);
    min-height: 100px;
    max-height: 300px;
    overflow-y:scroll;
}

/* Show the tooltip text when you mouse over the tooltip container */
.tooltip:hover .tooltiptext {
    visibility: visible;
}

.alert-wrapper{
    margin: 10px 0;
}
.alert-wrapper.success{
    background: green;
    padding: 15px 10px;
    color: #ffffff;
}
.alert-wrapper.error{
    background: red;
    padding: 15px 10px;
    color: #ffffff !important;
}
.error{
    color: red !important;
}
.badge{position:absolute;right:3px;top:6px;background:red;padding:3px 4px 2px 4px;border-radius:10px;color:#ffff;min-width:16px;display:block;text-align:center}
.badge.x{position:relative;float:right;margin-top:-9px;margin-right:-12px;margin-left:15px}
.badge.info{background:lime;color:black}
.inactive a{
    background: #ccc;
    cursor: not-allowed;
    pointer-events: none;
}
.sml-text{font-size:.6rem}

div[r]{text-align:right}
div[l]{text-align:left}

table.mc_style{border:solid 1px #00000020;}
table.mc_style.wauto{width:auto;}
table.mc_style td{
padding: 15px;
text-align: left;
vertical-align:middle;
font-weight: 300;
font-size: 13px;line-height:19px;vertical-align:top;
color: #444444;
border-bottom: solid 1px #00000010;
}
table.mc_style td div.error{background-color:red;color:white !important;padding:2px 5px;border-radius:2px}
table.mc_style td.uc{text-transform: uppercase;}
table.hl1stc td:first-child{background:#EEEEEE88}
table.mc_style td[c]{text-align:center}
table.mc_style td[sp]{padding:5px 15px}
table.mc_style input[type]{border:1px solid #00000030;padding:10px}
table.mc_style select{padding:10px;border:1px solid #00000030}
table.mc_style tr th{text-align:left;padding:15px;border-bottom:1px solid #00000010}

div[fl]{float:left;display:inline-block;margin-bottom:3px}

.commands{margin-bottom:20px;min-height:24px;display:grid;grid-template-columns: 55% 45%}
.commands,.commands *{vertical-align:middle;}
.commands>div div{background:#08919F;margin-right:20px;padding:1px 1px 1px 6px;border-radius:3px;color:white;font-size:15px;display:inline-block;line-height:28px;}
.commands div input[type="text"]{border:none;border-radius:2px;width:100px;height:26px}
.commands div button{border:none;background:black;margin-left:4px;/*margin-bottom:3px;*/height:26px}
.commands div label{background:black;border-radius:3px;display:inline-block;height:26px;line-height:26px;padding:0 4px;cursor:pointer}
.commands div label *{line-height:0px;margin:0} */




.tag{display:inline-block;margin-right:8px;margin-bottom:5px;padding:2px 2px 2px 5px;background:#F5F5F5;position:relative;}
.tag::after{content:"❌";display:inline-block;padding:2px 5px;margin-left:5px;cursor:pointer;}
.tag:hover::after{background:#E5E5E5}
.addtag{text-align:right;position:relative;}
.newtag{font-size:200%;display:inline-block;padding:3px 5px 5px 5px;background:#F5F5F5;cursor:pointer;}
.newtag:hover{background:#E5E5E5}

.newtags{text-align:left; position:absolute;border:1px solid #D5D5D5;background:white;padding:15px;right:0;top:30px;width:318px;box-shadow:0 2px 5px 0 rgba(0,0,0,0.3)}
.newtags input{width: calc(100% - 22px)}
.newtags .manage{float:left;margin-top:10px}
.newtags .close{float:right;margin-top:10px;cursor:pointer}

.newtags .taglist{margin:5px 0}
.newtags .taglist>div{max-height:200px;overflow-y:scroll}
.newtags .tline{padding:4px 8px;background:#F5F5F5;margin-bottom:2px;position:relative;min-height:19px}
.newtags .tline:hover{background:#E5E5E5}
.newtags .tline.s{background:#D5D5D5;color:#000000}
.newtags .tline.s::before{content:"✔ "}
.newtags .tline.s:hover{background:#C5C5C5}
.newtaginput{outline:none}
.newtagaction{margin:10px 0 15px 0;padding-bottom:15px;border-bottom:1px solid #888888}
.newtagaction.nopad{padding-bottom:0;border-bottom-width:0}

.old.tline:not(.s)::after{content:"Click to select";right:24px;position:absolute;color:blue;cursor:pointer}

.ntagdata::after{content:"Click to add";right:24px;position:absolute;color:blue;cursor:pointer}
.grid{display:grid;}
.g23{grid-template-columns:66% 34%}
.g80_20{grid-template-columns:80% 20%}
.g90_10{grid-template-columns:90% 10%}



/*tailwind like classes*/
.rounded{border-radius:.25rem}
.flex{display:flex}
.p-1{padding:.25rem}.px-1{padding-left:.25rem;padding-right:.25rem}.py-1{padding-bottom:.25rem;padding-top:.25rem}.pl-1{padding-left:.25rem}.pr-1{padding-right:.25rem}.pb-1{padding-bottom:.25rem}.bt-1{padding-top:.25rem}
.p-2{padding:.5rem}.px-2{padding-left:.5rem;padding-right:.5rem}.py-2{padding-bottom:.5rem;padding-top:.5rem}.pl-2{padding-left:.5rem}.pr-2{padding-right:.5rem}.pb-2{padding-bottom:.5rem}.bt-2{padding-top:.5rem}
.p-3{padding:.75rem}.px-3{padding-left:.75rem;padding-right:.75rem}.py-3{padding-bottom:.75rem;padding-top:.75rem}.pl-3{padding-left:.75rem}.pr-3{padding-right:.75rem}.pb-3{padding-bottom:.75rem}.bt-3{padding-top:.75rem}
.p-4{padding:1rem}.px-4{padding-left:1rem;padding-right:1rem}.py-4{padding-bottom:1rem;padding-top:1rem}.pl-4{padding-left:1rem}.pr-4{padding-right:1rem}.pb-4{padding-bottom:1rem}.bt-4{padding-top:1rem}
.text-blue-600{color: rgb(37 99 235 / 1)}
:is(.dark .dark\:text-green-600){color: rgb(22 163 74 / 1)}
.items-center{align-items:center}.items-start{align-items:flex-start}.items-end{align-items:flex-end}.items-stretch{align-items:stretch}.items-baseline{align-items:baseline}
.gap-2{gap:.5rem}.gap-6{gap:1.5rem}.text-lg{font-size:1.25rem}