/******************************************
 * mao.css
 * alert sentry plugin stylesheet
 * 
 * s/h - short-hand
 ******************************************/

body {
    background-color: #556061;
    background-image: url("https://www.asgorderportal.com/wp-content/themes/evolve/library/media/images/pattern/pattern_2.png");
}

/* fe plugin main content area */
div#mao-canvas {   
    
}

div.mao-subheader {
    display: flex;
    flex-direction: row;
    margin: 0px 0px 16px 0px;
    border: 3px solid transparent;
    padding: 2px 8px 2px 1px;
    border-radius: 16px;
    background: linear-gradient(#bbb,#ddd);
}

div.mao-subfooter {
}

div#dyn-logo-ctnr {
    float:right;
    text-align:center;
}

img#dyn-logo {
    width:160px;
}

div#dyn-logo-ctnr div {
    padding:6px 6px 0px 0px;
    font-weight:bold;
    font-style:italic;
}


/* fe [Plugin Current View] (s/h: [pcv] - inside div#mao-canvas) */
div#mao-view {
    margin:0px;
}

div#mao-view div#contact {
    width:220px;
    height:50px;
    font-family:arial;
    font-size:16px;
    font-weight:bold;
    border:0px solid red;
    line-height:84px;
    text-align:left;
}

div#mao-view h3 span,
div#mao-view h4 span, 
div#mao-view h5 span {
    font-size:18px;
    font-weight:normal;
}

/* LINKS - BEGIN */

/* pcv link container - Listamatic */ 
div#mao-view div.links {
    margin: 0 auto;
    font-family: georgia, serif;
    height:33px;
    padding: 4px;
/*  background: #fafbfc; */
    background: #d9d9db;
    border-radius: 3px 3px 3px 3px;
    box-shadow: 0 0 4px rgba(0, 0, 0, 0.15) inset;
    border-color: #CCCCCC #CCCCCC #BBBBBB;
    border-style:solid;
    border-width:1px;
}

/* pcv link container - to stretch the container div to contain floated list */
div#mao-view div.links:after {
    /* content: "."; */
    display: block;
    line-height: 1px;
    font-size: 1px;
    clear: both;
}

/* pcv links - list */
div#mao-view div.links ul.mao-navlist {
    margin: 0 auto;
    list-style: none;
    font-size: 0.8em;
    padding: 0;
    float:left;
}

div#mao-view div.links ul.mao-navlist li.a-enph {
    border: 2px solid red;
}
/* pcv links - list item */
div#mao-view div.links  ul.mao-navlist li {
    margin: 0;
    display: block;
    float: left;
    width: 100px;
    padding: 0;
    text-align:center;
}

/* pcv links - list item anchor */
div#mao-view div.links ul.mao-navlist li a {
    display: block;
    width: 100%;
    border-width: 1px;
    border-color: #ffe #aaab9c #ccc #fff;
    border-style: solid;
    padding: 0.5em;
    text-decoration: none;
/*  background: #f7f2ea; */
    background: #556061;
/*  color: #777; */
    color:#989898;
    font-weight:bold;
}

/* pcv links - list item anchor (specific) */
div#mao-view div.links>ul.mao-navlist li a { width: auto; }

/* pcv links - list item anchor (selected) */
div#mao-view div.links ul.mao-navlist li#active a {
  /*
    background: #f0e7d7;
    color: #800000;
   */
    color: #278f9f;
/*  background: #556061; */
    background: #dbdce0;
}

/* pcv links - list item anchor (hover) */
div#mao-view div.links ul.mao-navlist li a:hover, 
div#mao-view div.links ul.mao-navlist li#active a:hover {
    border-color: #aaab9c #fff #fff #ccc;
    background: transparent;
/*  color: #800000; */
    color: #278f9f;
}

/* pcv content container */
div#mao-view div#content {
    padding: 20px 0px 0px 0px;
/*  background-color: #F4F5F7; */
/*  border:3px solid #52BEE2; */
}

/* LINKS - END */

/* order sections / fields */

div#mao-view div.saddr-diff-ctnr {
    margin:20px 0px 4px 0px;
}

div#mao-view div.saddr-diff-ctnr span {
    font-weight:bold;
}

div#mao-view input#saddr-diff {
    margin-right:5px;
}

div#mao-view div#saddr-box {
    display:none;
}

p.trans-message {
    color: #167281;
    font-family: tahoma;
    font-weight: bold;
    position:relative;
}

div.trans-message {
    color: #167281;
    font-family: tahoma;
    font-weight: bold;
    margin:0px 0px 20px 0px;
}

div.trans-message table {
    margin:10px 0px 0px 0px;
}

div.trans-message table tr td {
    color: #167281;
    font-family: tahoma;
    font-weight: bold;
}

div#mao-view span.coupon-info {
  color: gray;
  font-style:italic;
}

/* form field labels */
div.cbr-box input#ck-suse-cu,
div.cbr-box input#bcu-addr,
div.cbr-box input#bship-addr {
  margin: 0 6px 6px 0;
}

div#mao-view label {
    background-color:#d9d9db;
    display:block; /* consider removing this */
    width:180px;
    padding:2px 0px 2px 6px;
    border-radius:0px 12px 0px 0px;   
}

div#mao-view table td.med label {
    width:80px;
}

div#mao-view table td.short label {
    width:50px;
}

div#mao-view table td.tiny label {
    border-radius:2px 2px 2px 2px;
    width:16px;
    margin:0px;
    padding:2px;
    text-align:center;
}

div#mao-view table td.small label {
    width:36px;
    text-align:center;
}

div#mao-view table td.smallr label {
    width:36px;
    text-align:left;
}

/* form field inputs */
div#mao-view .bvalidator_invalid {
    background-color: #FFFFAE;
}

div#mao-view table td {
/*  border:0px solid red; - blocks with 0, just comment */
}

div#mao-view table td.smallr {
    width:50px;
}

div#mao-view table td.thin {
    width:1px;
    padding:10px 0px 0px 4px;
    margin:0px
}

div#mao-view input[type="text"],
div#mao-view table td input[type="text"]
{
    padding:7px;
}
div#mao-view table td.med input {
    width:100px;
}
div#mao-view table td.med input[type="checkbox"] {
    width:20px;
    margin:8px 0px 18px 0px;
}


div#mao-view table td.short input {
    width:80px;
}

div#mao-view table td.smallr input,
div#mao-view table td.small  input {
    width:40px;
    text-align:center;
}

div#mao-view table td.tiny {
    width:40px;
    white-space:nowrap;
/*  padding:0px 0px 0px 10px; */
    padding: 8px 10px 0 0; /** proposed for responder's ui changes **/
    text-align:center;
    vertical-align:top;
}

div#mao-view table td.tiny input {
    display: block;
    margin: 8px 0 0;
    padding: 0;
    text-align: left;  
}

div#mao-view input#bdelay {
    margin:0px 4px 2px 0px;
    float:left;
}

/* BEGIN: order form products */

div#ctnr-prices tr td input[type="text"].subscription {
    background-color:transparent;
}

/* BEGIN: order form product-groups */

div#ctnr-prices tr.product-group {
    cursor:pointer;
}
div#ctnr-prices tr.pline {
    display:none;
}
div#ctnr-prices tr.standard {
    background-color:#8c1941;
    color:#ffffff;
}
div#ctnr-prices tr.cellpic {
    background-color:#bf6bbf;
}
div#ctnr-prices tr.cellular {
    background-color:#eaadea;
}
div#ctnr-prices tr.responder {
    background-color:#40569a;
    color:#ffffff;
}
div#ctnr-prices tr.elite {
    background-color:#2b7878;
    color:#ffffff;
}
div#ctnr-prices tr.er {
    background-color:#b557ef;
    color:#ffffff;
}
div#ctnr-prices tr.third-party {
    background-color:#814A81;
    color:#ffffff;
}
div#ctnr-prices tr.accessory {
    background-color:#ef993e;
    color:#ffffff;
}

div#ctnr-prices tr.standard td,
div#ctnr-prices tr.cellpic td,
div#ctnr-prices tr.cellular td,
div#ctnr-prices tr.responder td, 
div#ctnr-prices tr.elite td, 
div#ctnr-prices tr.er td, 
div#ctnr-prices tr.third-party td, 
div#ctnr-prices tr.accessory td {
    text-align:left;
    padding-left:120px;
    font-size:20px;
    font-style:bold;
}

div#ctnr-prices tr.standard td {
    background-repeat:no-repeat;
    background-position:10px 50%;
    background-image:url("../images/home-based-px-102.png");
    height:110px;
    padding-left:120px;
}

div#ctnr-prices tr.cellular td {
    background-repeat:no-repeat;
    background-position:10px 50%;
    background-image:url("../images/home-based-px-102.png");
    height:110px;
    padding-left:120px;
}

div#ctnr-prices tr.cellpic td {
    background-repeat:no-repeat;
    background-position:10px 50%;
    background-image:url("../images/home-based-px-102.png");
    height:110px;
    padding-left:120px;
}

div#ctnr-prices tr.responder td {
    background-repeat:no-repeat;
    background-position:10px 50%;
    background-image:url("../images/isafe-px-102.png");
    height:110px;
}

div#ctnr-prices tr.elite td {
    background-repeat:no-repeat;
    background-position:10px 50%;
    background-image:url("../images/isafe-px-102.png");
    height:110px;
}

div#ctnr-prices tr.er td {
    background-repeat:no-repeat;
    background-position:10px 50%;
    background-image:url("../images/isafe-er-px-102.png");
    height:110px;
}

div#ctnr-prices tr.third-party td {
    background-repeat:no-repeat;
    background-position:10px 50%;
    background-image:url("../images/third-pp-px-102.png");
    height:110px;
}

div#ctnr-prices tr.accessory td {
    background-repeat:no-repeat;
    background-position:10px 50%;
    background-image:url("../images/lockbox-px-102.png");
    height:110px;
}

/* END: order form product-groups */

/* more optional order fields - begin */

div.opt-box
{
    display: inline-block;
    margin: -22px 0 0 62px;
    padding: 0;
    position: absolute;
}

div.opt-box > span
{
    padding: 0 8px 0 3px;
    vertical-align: sub;
}

/* more optional order fields - end */

div#ctnr-prices table thead tr th.ckcol {
    width:20px;
}
div#ctnr-prices table thead tr th.qtcol {
    width:40px;
}
div#ctnr-prices table thead tr th.desc {
    width:65%;
}
div#ctnr-prices table tbody tr td:first-child {
    padding-right:0px;
}

div#ctnr-prices th.currency, 
div#ctnr-prices td.currency {
    text-align:right;
}

div#ctnr-prices input.quantity {
    width:40px;
    text-align:right;
}

div#mao-view input#bdelayuntil {
    width:164px;
    text-align:center;
}

/* order sections - totals */
div#mao-view input#btotal {
    width:190px;
    text-align:right;
}

/* order sections - pmt mthd */
div#mao-view div#method table {
    border:0px solid blue;
    width:360px;
}

div#mao-view div#method table tr td {
    padding:14px;
}

div#mao-view div#method table tr td input {
    margin-top:-4px;
}

div#mao-view div#method table tr td span {
    margin:0px 0px 0px 4px;
    display:inline-block;
}

div#mao-view div#bd-fields span {
    padding-left: 5px;
}

div#mao-view textarea#notes {
    height: 90px;
    width: 96%;
}

div#mao-view div#success-buttons {   
}

div#mao-view div#success-buttons a#another {
    border: 5px outset #12616d;
    border-radius: 12px;
    padding: 6px 20px;
    background-color: #328e9c;
    color: #ffffff;
    text-decoration: none;
    text-transform: capitalize;
    margin: 0px 0px 0px 10px;
}

div#mao-view div#success-buttons a#another:hover {
    text-decoration: underline;
}

div#mao-view div#success-buttons a#activate {
    border: 5px outset #f57304;
    border-radius: 12px;
    padding: 6px 20px;
    background-color: #f57304;
    color: #ffffff;
    text-decoration: none;
    text-transform: capitalize;
    margin: 0px 0px 0px 10px;
}

div#mao-view div#success-buttons a#activate:hover {
    text-decoration: underline;
}

div#mao-view div#success-buttons span {
    padding:0px 0px 0px 10px;
}

/* *****************************/
/* BEGIN .. responder's data collection */
/* *****************************/

table.responders-ui {
}

/* responder table row background, even, odd */
table.responders-ui tr:nth-child(2n+1) {
    background-color: #e9e9e9;
}

/* row bottom borders */
table.responders-ui tr td {
    border-bottom: 1px solid #bbbbbb;
    vertical-align: top;  /* very important for changes as we need this when adding dynamic elements so the line up automatically when added */
}

table.responders-ui tr td.increment {
    position:relative;
}

table.responders-ui tr td div.responder-extra {
    display:none;
}

/* new - general dynamic button style */
div.dyn-button {
    display: inline-block;
    border: 1px solid #aaaaaa;
    border-radius: 16px;
    color: #aaaaaa;
    cursor: pointer;
    font-family: courier;
    font-size: 16px;
    font-weight: bold;
    opacity: 0.3;
    text-align: center;
    vertical-align: middle;
    width: 20px;
    height:20px;
    line-height: 20px;
}

div.dyn-button:hover {
    opacity:0.8;
}

/* firefox only */
@-moz-document url-prefix() {
    div.dyn-button {
        line-height: 25px;
    }    
}

/* new - the add button version of div.dyn-button */
div.dyn-button.dyn-add {
    border: 2px solid rgba(0, 255, 0, 1);
    color: rgba(0, 255, 0, 1);
}

/* new - delete button to delete dynamically added phone number */
div.dyn-button.dyn-delete {
    border: 2px solid rgba(255, 0, 0, 1);
    color: rgba(255, 0, 0, 1);
    margin-bottom: 9px;
}

div.dyn-button.dyn-expand {
    border: 2px solid rgba(0, 0, 255, 1);
    background-image: url("images/ui-icons_222222_256x240.png");
    background-position: -31px -14px;
    background-color: linear-gradient(to left, #bbbbbb, #eeeeee);
    width:20px;
    height:20px;
}

div.dyn-button.dyn-collapse {
    border: 2px solid rgba(0, 0, 255, 1);
    background-image: url("images/ui-icons_222222_256x240.png");
    background-position: -63px -13px;
    background-color: linear-gradient(to left, #bbbbbb, #eeeeee);
    width:20px;
    height:20px;
}

/* new - wrapper for dynamically created elements */
div.dyn-wrap {
    white-space: nowrap;
}

div.dyn-wrap div.dyn-button {
    margin-left:3px;
}


/* dyn-delete button to delete dynamic responder */
table.responders-ui tr td.increment div.dyn-delete {
    text-align:center;
    position:absolute;
    left:5px;
    top:36px;
    display:block;
    margin:0px;
}

/* new - the box that contains the label or text */
div.dyn-box {
    display: inline-block;
    line-height: 18px;
    text-align: right;
}

/* new - dynamic box that contains text (really a label - change to label and modify markup to use "-label" instead of "-text" */
div.dyn-box.dyn-input-text {
    border: 1px solid transparent;
    padding: 0 4px 0 10px;
    width: 207px;
}

/* new - for span within dyn-box with text "Add Phone Number" */
div.dyn-box span.dyn-label {
    color: #aaaaaa;
    text-shadow: 2px 2px 2px #ffffff;
}

div.dyn-box.dyn-spacer {
    height: 20px;
    margin-bottom: 4px;
}

div.dyn-wrap input[type="radio"] {
    margin: 24px 0 0 !important;
}

div.carrier-box {
    display:block;
}
div.carrier-box select.carrier {
    height: 28px;
    margin-bottom: 17px;
}

/** responders tfoot section **/
table.responders-ui tfoot tr td {
    border-top:1px solid #d8d8d8 !important;
    padding: 8px 0px 8px 6px; /* td style is 8px 11px - changed horizontal */
}
table.responders-ui tfoot tr td div.dyn-wrap {
    display:inline-block;
    margin-top:3px;
}
table.responders-ui tfoot tr td div.dyn-box {
    display: inline-block;
    line-height: 18px;
    text-align: left;
}


/* *****************************/
/* END .. responder's data collection */
/* *****************************/

/* activate */

/* legacy
div#mao-view input.sn-suggested {
    color:gray;
    font-weight:bold;
}
*/

div#mao-view div#activate-wrap {
    border:0px solid blue;
    width:738px;
    float:normal;
/*  height:160px; */
}
div#mao-view div.horiz-ctrl-box {
    display:inline-block;
    margin:0px 8px 4px 0px;
}
div#mao-view div.horiz-ctrl-box label {
    padding:2px 0px 2px 4px;
    height:22px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
div#mao-view div.horiz-ctrl-box label.sub-plc {
    margin-top:7px;
    margin-bottom:2px;
}
div#mao-view div.horiz-ctrl-box label.oos {
    color: #3879D9;
}
div#mao-view form#activate {
    border:0px solid red;
    border-radius: 3px;
    box-shadow: 2px 2px 5px #777777;
    padding: 16px;
/*  display:inline-block; */
}

div#mao-view form#activate div.fbox {
    display:flex;
}

div#mao-view form#activate div.qbox {
    padding:6px 2px;
}
div#mao-view form#activate div.qbox input[type="checkbox"] {
    margin:0px 4px 0px 0px;
}
div#mao-view form#activate div.qbox div.sel-qty {
    padding:1px 0px 0px 0px;
    width:174px;
    text-align:center;
    font-style:italic;
}
div#mao-view form#activate div.qbox div.quantity {
    border: 1px solid #3879D9;
    border-radius: 3px 10px 10px 3px;
    width: 90% !important;
    padding: 0px !important;
    background-color: #3879D9;
    color: #eeeeee;
    height:26px;
    margin:1px 0px 0px 0px;
}
div#mao-view form#activate div.q-active div.sel-qty {
    border: 1px solid #369621;
    background-color: #369621;
    border-radius: 10px;
    width: 50% !important;
    padding: 0px !important;
    margin-left: 42px;
    color: #eeeeee;
}

div#mao-view form#activate div.q-active span {
    border: 1px solid #369621;
    background-color: #369621;
    border-radius: 4px;
    color: #eeeeee;
    width:180px;
    padding:0px 8px 0px 3px;
    display:inline-block;
    margin-top:1px;
}
div#mao-view form#activate div.qbox div.quantity span.q-oos {
    padding:0px 0px 0px 20px;
}
div#mao-view form#activate div.buttons {
    margin:8px 0px 0px 0px;
}
div#mao-view form#activate div.buttons div {
    display:table-cell;
}
div#mao-view form#activate div.buttons div div {
    display:inline-block;
}
div#mao-view form#activate div.buttons div:first-child {
    width:202px;
}
div#mao-view form#activate div.buttons div:last-child {
    white-space:nowrap;
}
div#mao-view form#activate div.buttons input#action2 {
    background: -webkit-gradient(linear,left top,left bottom,color-stop(.2, #3879D9),color-stop(1, #2869D9));
    background: rgba(0, 0, 0, 0) -moz-linear-gradient(center top , #3879D9 20%, #2869D9 100%) repeat scroll 0 0;
    background: -o-linear-gradient(top, #3879D9, #2869D9) transparent;
    background: linear-gradient(top, rgba(56,121,217,0.2), rgba(40,105,217,1.0));
}
div#mao-view form#activate select.serial-no { 
    min-width:180px;
    padding: 5px 0;
    text-align:center;
}
div#mao-view form#activate select.serial-no option { 
    text-align:left;
}
div#mao-view div#activate-cbox {
    position: relative;
    background: linear-gradient(45deg, gold, #e0bf0e);
    box-shadow: 8px 8px 8px #ccccff;
    border-radius: 6px;
    max-width: 740px;
    padding: 12px 0 10px 10px;
    text-align: center;
    text-shadow: 1px 1px 1px #ffffff77;
}
div#mao-view div#activate-cbox a {
    color:#278f9f;
    text-decoration:none;
}
div#mao-view div#activate-cbox a:hover {
    text-decoration:underline !important;
}
div#mao-view div#activate-sbox {
    background-color: #3879d9;
    color:#eeeeee;
    border-radius: 6px;
    max-width: 740px;
    padding: 1px 0 10px 10px;
    text-align:center;
}
div#mao-view div.instruct {
    margin:0px 0px 10px 0px;
}
div#mao-view div.inst {
    display: inline-block;
    border-radius: 50%;
    border: 2px solid #c9c9cb;
    color: #c9c9cb;
    width: 20px;
    height: 20px;
    text-align: center;
    line-height: 20px;
    margin-top:4px;
}
div#mao-view div.inst-lit {
    display: inline-block;
    border-radius: 50%;
    border: 2px solid maroon;
    color:maroon;
    font-weight:bold;
    background-color:gold;
    width: 20px;
    height: 20px;
    text-align: center;
    line-height: 20px;
    margin-top:4px;
}

div#mao-view label div.inst {
    display: inline-block;
    border-radius: 50%;
    border: 2px solid #c9c9cb;
    color: #c9c9cb;
    width: 16px;
    height: 16px;
    text-align: center;
    line-height: 18px;
    margin-top:0px;
}
div#mao-view label div.inst-lit {
    display: inline-block;
    border-radius: 50%;
    border: 2px solid maroon;
    color:maroon;
    font-weight:bold;
    background-color:gold;
    width: 16px;
    height: 16px;
    text-align: center;
    line-height: 18px;
    margin-top:0px;
}

div#mao-view label div.inst, 
div#mao-view th div.inst-lit {
    margin-top:0px;
}

div#mao-view div.serial-no {
    border: 1px solid #3879d9;
    width:180px;
    height: 28px;
    background-color: #3879d9;
    border-radius: 4px;
    color:#eeeeee;
}
div#mao-view div.s-active {
    background-color:#369621;
    border:1px solid #369621;
    text-align:center;
    padding-top:2px;
}
div#mao-view div.s-oos {
    text-align:center;
    padding-top:2px;
}
div#mao-view div.serial-no input[type="checkbox"] {
    margin:7px 4px 0px 10px;
}

div#mao-view div#ctnr-inactive div.filter {
    width:98%;
    margin:4px 0px 14px 0px;
    padding:4px 0px;
    text-align:left;
    border-radius:8px;
    background: #d9d9db; /* For browsers that do not support gradients */
    background: -webkit-linear-gradient(135deg, #e9e9e9, #e9e9e9, #d9d9db); /* For Safari 5.1 to 6.0 */
    background: -o-linear-gradient(135deg, #e9e9e9, #e9e9e9, #d9d9db); /* For Opera 11.1 to 12.0 */
    background: -moz-linear-gradient(135deg, #e9e9e9, #e9e9e9, #d9d9db); /* For Firefox 3.6 to 15 */
    background:  linear-gradient(135deg, #e9e9e9, #e9e9e9, #d9d9db); /* Standard syntax */
    box-shadow:8px 8px 8px #ccccff;
    min-height:20px;
}
div#mao-view div#ctnr-inactive div.filter label {
    display:inline-block;
    font-size:12px;
    border-radius:0px;
    padding:2px;
    background-color:transparent;
    width:auto;
    margin:0px 2px 0px 30px;
}
div#mao-view div#ctnr-inactive div.filter input[type="checkbox"] {
    padding:0px;
    margin:0px;
/*  vertical-align:text-top; */
    vertical-align:middle;
}
div#mao-view div#ctnr-inactive div.filter div.refresh {
    float:left;
    margin:1px 0px 0px 16px;
    background-repeat:no-repeat;
    background-image:url("../images/refresh.png");
}
div#mao-view div#ctnr-inactive div.filter div.refresh:hover {
    background-image:url("../images/refresh-l.png");
}
div#mao-view div#ctnr-inactive div.filter div.refresh a {
    padding:2px 10px;
}

div#mao-view div#ctnr-inactive table.heading {
    margin:0px;
    padding:0px;
    border-collapse:collapse;
    border:0px solid red;
    position:static;
}
div#mao-view div#ctnr-inactive table.heading tr {
    margin:0px;
    padding:0px;
}
div#mao-view div#ctnr-inactive table.heading td {
    margin:0px;
    padding:0px;
}
div#mao-view div#ctnr-inactive table.heading td:last-child {
    margin:0px;
    padding:0px 10px 0px 0px;
    vertical-align:bottom;
    text-align:right;
}
div#mao-view div#ctnr-inactive table.heading h2 {
    display:inline-block;
    border:0px solid blue;
    margin:0px;
    padding:5px 0px 5px 10px;
}
div#mao-view div#ctnr-inactive table.heading span {
    border:0px solid green;
    font-style:italic;
    padding:0px 4px 4px 0px;
    display:inline-block;
}
div#mao-view div#ctnr-inactive table.actt-list {
    border-collapse:collapse;
    position:static;
    border-radius: 3px;
    box-shadow:2px 2px 5px #777777;
}
div#mao-view div#ctnr-inactive table.actt-list tr td a {
    text-decoration:none !important;
    font-weight:bold;
    white-space:nowrap;
}
div#mao-view div#ctnr-inactive table.actt-list tr td a:hover {
    text-decoration:underline !important;
}
div#mao-view div#ctnr-inactive table.actt-list tr.tid-sel td {
    background-color:#ffffbf;
    text-shadow:4px 2px 2px #f7ea4c;
}
div#mao-view div#ctnr-inactive table.actt-details {
    margin:0px;
    border:0px solid black;
    position:static;
}

div#mao-view div#ctnr-inactive table.actt-details td {
    padding:0px 0px;
    border-bottom:1px solid #e0dddd !important;
    font-size:13px;
}
div#mao-view div#ctnr-inactive table.actt-details td:first-child {
    padding:0px 4px;
    background-color:#eeeeee;
    border-right:1px solid #e0dddd;
    font-style:italic;
    width:100px;
}
div#mao-view div#ctnr-inactive table.actt-details tr.status td {
    font-weight:bold;
}
div#mao-view div#ctnr-inactive table.actt-details tr.status td:first-child {
    text-shadow:1px 1px 1px #ffffff;
}
div#mao-view div#ctnr-inactive table.actt-details tr.status td:last-child {
    text-shadow:1px 1px 1px #ffffff;
    background-color:#eeeeee;
}
div#mao-view div#ctnr-inactive table.actt-details tr.non-inv td:first-child {
}
div#mao-view div#ctnr-inactive table.actt-details tr.inactive td {
    color:#ff0000;
}
div#mao-view div#ctnr-inactive table.actt-details tr.active td {
    color:#369621;
}
div#mao-view div#ctnr-inactive table.actt-details tr.partial td {
    color:purple;
}
div#mao-view div#ctnr-inactive table.actt-details tr.ship td {
    color:#3879d9;
}
div#mao-view div#ctnr-inactive table.actt-list tr.tid-sel td table.actt-details {
    box-shadow:0px 0px 12px #f7ea4c;
}
div#mao-view div#ctnr-inactive table.actt-list tr.tid-sel td table.actt-details td:first-child {
    padding:0px 4px;
    background-color:#fefcaf;
    font-style:italic;
    width:100px;
    text-shadow:4px 2px 2px #f7ea4c;
    border-right:1px solid #fff321;
    border-bottom:1px solid #fff321 !important;
}
div#mao-view div#ctnr-inactive table.actt-list tr.tid-sel td table.actt-details td:last-child {
    text-shadow:4px 2px 2px #f7ea4c;
    border-bottom:1px solid #fff321 !important;
}
div#mao-view div#ctnr-inactive table.actt-list tr.tid-sel td table.actt-details tr.status td:last-child {
    background-color:#fefcaf;
}
div#mao-view div#ctnr-inactive table.actt-list tr td table.actt-details td:last-child span {
    display: inline-block;
    padding:0px 6px;
}
div#mao-view div#ctnr-inactive table.actt-details td span.pb {
}
div#mao-view div#ctnr-inactive table.actt-details td span.pb-me {
    border: 1px solid rgba(255, 165, 0,.33);
    padding: 0px 4px !important;
    background-color: rgba(255, 165, 0,.33);
    display: inline-block;
    margin-left: 2px;
}
div#mao-view div#ctnr-inactive table.actt-details td span.pf {
}
div#mao-view div#ctnr-inactive table.actt-details td span.pf-cp { 
    font-weight:bold;
}
div#mao-view div#ctnr-inactive table.actt-details td span.pd {
    margin:0px;
    padding:0px !important;
}
div#mao-view label.act-label {
    width:188px;
}
div#mao-view div#act-messages {
    position:relative;
}
div#mao-view div#act-messages h4 {
    cursor:pointer;
    display:inline-block;
}
div#mao-view div#act-messages div.qm {
    border-radius:14px;
    color:#545454;
    font-weight:bold;
    font-size:16px;
    border:3px solid #545454;
    background-color:#e9e9eb;
    display:inline-block;
    margin:0px 10px 0px 0px;
    padding:1px 5px;
    cursor:pointer;
}
div#mao-view table.act-errors {
    max-width:500px;
    background-color: #ffffcf;
    border-radius: 10px 10px 10px 10px;
    box-shadow: 2px 2px 5px #777777;
    display:none;
    position:absolute;
    top:0px;
    left:275px;
    z-index:10;
}
div#mao-view table.act-errors td:first-child {
    white-space:nowrap;
    vertical-align:top;
}
div#mao-view table.act-errors td {
    font-size:12px;
}

/**
 * activation serial inventory custom droplist 
 */

/* custom grid container */
div.act-inv-grid {
    position:relative;
    width:172px;
}

/* serial inventory custom droplist */

/* serial jQuery button */
div.act-inv-grid label.lgselect {
    box-sizing: unset;
    font-size: 13px;
    font-weight: bold;
    height: 28px !important;
    line-height:26px;
    margin:0px;
    border-radius:4px !important;
    width:186px !important;
}
div.act-inv-grid label.lgselect span.ui-button-text {
    padding:0px; // (1) for different jQuery versions (see 2)
}
div.act-inv-grid label.lgselect span.ui-checkboxradio-icon {
    display: none; // (2) for different jQuery versions (see 1)
}
div.act-inv-grid label.ui-state-active {
    border-radius:4px 4px 0px 0px !important;
    border-bottom:0px solid #000;
}

div.act-inv-grid label.act-ready {
    border-color: #c7f3b9;
    box-shadow: 0 0 16px #2ec83a99;
}
div.act-inv-grid label.act-dead {
    border-color: #f3bcb9;
    box-shadow: 0 0 16px #c8362e99;
}

/* tabular serial grid */
div.act-inv-grid div.gdata {
    position:absolute;
    z-index:100;
    display:none;
    box-shadow:4px 4px 5px #777777;
    background-color:#e6e6e6;
    min-width:240px;
}
div.act-inv-grid div.gdata div.dhead div {
    display:table-row;
    width: 100%;
}
div.act-inv-grid div.gdata div.dhead div span {
    display: table-cell;
    min-height: 100%;
    text-align:left;
    text-shadow: 0 1px 0 #fff;
    background-color:rgba(167,205,155,.5);
    border-top:0px;
    border-left: 1px solid gray;
    border-bottom: 1px solid gray;
    margin: 0px 0px;
    padding: 2px 6px 1px 6px;
    white-space:nowrap;  
    
}
div.act-inv-grid div.gdata div.dhead div span:first-child {
    border-left: 0px solid gray;
}

div.act-inv-grid div.gdata div.dbody {
    max-height: 200px;
    overflow-y: scroll;
}
div.act-inv-grid div.gdata div.dbody div {
    display:table-row;
    width: 100%;   
}
div.act-inv-grid div.gdata div.dbody div span {
    display: table-cell;
    min-height: 100%;
    padding: 1px 6px;
    white-space:nowrap;
    border-left: 1px solid gray;
}
div.act-inv-grid div.gdata div.dhead div span.item,
div.act-inv-grid div.gdata div.dbody div span.item {
    min-width:116px;
}
div.act-inv-grid div.gdata div.dhead div span.assigned,
div.act-inv-grid div.gdata div.dbody div span.assigned {
    min-width:190px;
}
div.act-inv-grid div.gdata div.dbody div span.assigned {
    padding-left:0px;
    padding-right:0px;
}
div.act-inv-grid div.gdata div.dhead div span.coupon,
div.act-inv-grid div.gdata div.dbody div span.coupon {
    width:100%;
}
div.act-inv-grid div.gdata div.dbody div span:first-child {
    border-left: 0px solid gray;
}
div.act-inv-grid div.gdata div.dbody div span.sel-value {
    color:#e6e6e6;
}
div.act-inv-grid div.gdata div.dbody div span span {
    padding:0px 6px 0px 6px;
}
div.act-inv-grid div.gdata div.dbody div span span.unalloc {
    font-weight:bold;
    color:maroon;
}
div.act-inv-grid div.gdata div.dbody div span span.pf {
    font-weight:bold;
}
div.act-inv-grid div.gdata div.dbody div span span.mine {
    background-color: rgba(255, 165, 0, .33);
    border: 1px solid rgba(255, 165, 0, .33);
    display: inline-block;
    width: calc(100% - 14px); /* -14px is less padding and border */
}
div.act-inv-grid div.gdata div.dbody div:hover span, 
div.act-inv-grid div.gdata div.dbody div.selected span 
{
    background-color:#a7cd9b;
    color:#ffffff;
    cursor:pointer;
}
div.act-inv-grid div.gdata div.dbody div:hover span.sel-value {
    color:#a7cd9b;
}

div.act-inv-grid div.gdata div.dfoot {
    min-height: 18px;
    border-top: 1px solid gray;
    padding: 10px 0 6px;
    text-align: center;
    color: #ffffff;
    font-style: italic;
    text-shadow: -1px -1px 0px rgba(255,255,255,0.3), 1px 1px 0px rgba(0,0,0,0.8);
    opacity: 0.4;
    background-color: #e0e0e0;
}

/* quantity jQuery button */
div.act-inv-grid label.lqselect {
    box-sizing: unset;
    font-size: 13px;
    font-weight: bold;
    height: 27px;
    margin:0px;
    border-radius:4px !important;
    width:174px;
    line-height:22px;
}
div.act-inv-grid label.lqselect span.ui-button-text {
    padding:0px;
}

/* tabular quantity grid */
div.qdata {
    position:absolute;
    z-index:100;
    display:none;
    box-shadow:4px 4px 5px #777777;
    background-color:#e6e6e6;
    min-width:240px;
}
div.qdata div.dhead div {
    display:table-row;
    width: 100%;
}
div.qdata div.dhead div span {
    display: table-cell;
    min-height: 100%;
    text-align:left;
    text-shadow: 0 1px 0 #fff;
    background-color:rgba(167,205,155,.5);
    border-top:0px;
    border-left: 1px solid gray;
    border-bottom: 1px solid gray;
    margin: 0px 0px;
    padding: 2px 6px 1px 6px;
    white-space:nowrap;  
}
div.qdata div.dhead div span:first-child {
    border-left: 0px solid gray;
}
div.qdata div.dhead div span:last-child {
    border-right: 0px solid gray;
}
div.qdata div.dbody {
    max-height: 200px;
    overflow-y: scroll;
}
div.qdata div.dbody div {
    display:table-row; /*keep cells aligned*/
    width: 100%;   
}
div.qdata div.dbody div span {
    display: table-cell;
    min-height: 100%;
    padding: 1px 6px;
    border-left: 1px solid gray;
    white-space: nowrap;
}
div.qdata div.dbody div span:first-child {
    border-left: 0px solid gray;
}
div.qdata div.dhead div span.item,
div.qdata div.dbody div span.item {
    min-width:176px;
}
div.qdata div.dbody div span.item input[type="checkbox"] {
    margin:0px 4px 0px 0px;
    cursor:pointer;
}
div.qdata div.dbody div span.ship {
    background-color:#3879d9;
    color:#eeeeee;
}
div.qdata div.dhead div span.assigned {
    min-width:150px;
}
div.qdata div.dbody div span.assigned {
    min-width:150px;
    padding-left:0px;
    padding-right:0px;
}
div.qdata div.dhead div span.coupon,
div.qdata div.dbody div span.coupon {
    width:100%;
}
div.qdata div.dbody div span span {
    padding:0px 6px 0px 6px;
}
div.qdata div.dbody div span span.unalloc {
    font-weight:bold;
    color:maroon;
}
div.qdata div.dbody div span span.pf {
    font-weight:bold;
}
div.qdata div.dbody div span span.mine {
    border: 1px solid rgba(255, 165, 0, .33);
    display: inline-block;
    width: 100%;
    background-color: rgba(255, 165, 0, .33);
}
div.qdata div.dbody div:hover span {
    background-color:#a7cd9b;
    color:#ffffff;
    cursor:pointer;
}
div.qdata div.dfoot {
    min-height: 18px;
    border-top: 1px solid gray;
    padding: 10px 0 6px;
    text-align: center;
    color: #ffffff;
    font-style: italic;
    text-shadow: -1px -1px 0px rgba(255,255,255,0.3), 1px 1px 0px rgba(0,0,0,0.8);
    opacity: 0.4;
    background-color: #e0e0e0;
}

/**
 * activate ade
 */
.ade-dialog {
    background-color:#c7a1a1 !important;
    border-radius: 4px !important;
    box-shadow: 6px 6px 6px #aaaaaa !important;
}
.ade-dialog-content {
    padding:3px 0px 0px 2px !important;
}
.ade-dialog-buttonpane {
    padding:0px !important;
    border: 1px solid #aaaaaa !important;
    background: #cccccc url(images/ui-bg_highlight-soft_75_cccccc_1x100.png) 50% 50% repeat-x !important;
    color: #222222 !important;
}
.ade-dialog-buttonset {
    background-color: transparent !important;
    text-align:center !important;
    float: none !important;
}
div.ade-wrapper {
}
div.ade-head {
}
div.ade-foot {
}
div.ade-row {
    background-color: #ffffff33;
    margin: 0px 0px 3px 0px;
    border-radius: 8px 0px 0px 8px;
}
div.ade-row div.unavailable {
    color:#ff9595;
    text-shadow:1px 1px 4px #000000ff;
}
div.ade-label {
    display: inline-block;
    width: 25%;
    text-align: right;
    padding: 2px 6px 2px 8px;
    background-color: #00000022;
    border-radius: 8px 0px 0px 8px;
}
div.ade-value {
    display:inline-block;
    width:65%;
    text-align:left;
    padding:2px 8px 2px 8px;
}
 
/******************************
 * description wrapper, BEGIN 
 ******************************/

div.desc-wrap {
    margin-bottom:2px !important;
}

div.desc-wrap div.product-name {
    font-weight:bold;
    margin-bottom:2px;
    padding:4px 2px;
}

div.desc-wrap span {
    font-size:9pt;
    font-style:italic;
}

div.desc-wrap li {
    font-size:9pt;
    font-style:italic;
}

span.desc-wrap {
    font-size:9pt;
    font-style:italic;
}

/* alert */
div.alert {
    color:#2b3f3f;
    padding:4px 8px 6px 8px;
    border-radius:4px;
    background-color:#e8d5d5;
}

div.alert div.product-name {
    font-weight:bold;
    border-bottom:1px solid #8c1941;
    margin-bottom:2px;
    padding:4px 2px;
}

/* alert fall */
div.alert-fd {
    color:#333333;
    padding:4px 8px 6px 8px;
    border-radius:4px;
    background-color:#d3ffce;
}

div.alert-fd div.product-name {
    font-weight:bold;
    border-bottom:1px solid #a6eaa1;
    margin-bottom:2px;
    padding:4px 2px;
}

/* isafe */
div.isafe {
    color:#37364f;
    padding:4px 8px 6px 8px;
    border-radius:4px;
    background-color:#d7deed;
}

div.isafe div.product-name {
    font-weight:bold;
    border-bottom:1px solid #40569a;
    margin-bottom:2px;
    padding:4px 2px;
}

/* isafe elite */
div.isafe-elite {
    color:#4f3836;
    padding:4px 8px 6px 8px;
    border-radius:4px;
    background-color:#cde3e7;
}

div.isafe-elite div.product-name {
    font-weight:bold;
    border-bottom:1px solid #2b7878;
    margin-bottom:2px;
    padding:4px 2px;
}

/* isafe er */
div.isafe-er {
    color:#37364f;
    padding:4px 8px 6px 8px;
    border-radius:4px;
    background-color:#e2c3ef;
}

div.isafe-er div.product-name {
    font-weight:bold;
    border-bottom:1px solid #b557ef;
    margin-bottom:2px;
    padding:4px 2px;
}

/* third-party */
div.third-party {
    color:#37364f;
    padding:4px 8px 6px 8px;
    border-radius:4px;
    background-color:#dfc3df;
}

div.third-party div.product-name {
    font-weight:bold;
    border-bottom:1px solid #814a81;
    margin-bottom:2px;
    padding:4px 2px;
}

/* accessory ??? */
div.alert-ac {
    color:#333333;
    padding:4px 8px 6px 8px;
    border-radius:4px;
}

div.alert-ac div.product-name {
    font-weight:bold;
    border-bottom:1px solid #fcc325;
    margin-bottom:2px;
    padding:4px 2px;
}

/* accessory (generic) */
div.accessory {
    padding:4px 8px 6px 8px;
    border-radius:4px;
    background-color:rgba(255,232,207,0.6);
}

div.accessory div.product-name {
    font-weight:bold;
    border-bottom:1px solid #ef993e;
    margin-bottom:2px;
    padding:4px 2px;
}

/******************************
 * description wrapper, END
 ******************************/

table.csz td.cmd-cell {
    vertical-align:bottom;
    padding:0px 0px 8px 4px;
}

/* impersonation url */
table.csz td a.imp-url {
    text-decoration:none;
}

table.csz td a.imp-url:hover {
    text-decoration:underline !important;
}

table.phone {
    width:420px;
}

table.phone tr td:first-child {
    width:254px;
}

table.phone tr td:last-child label {
    width:100px !important;
}

/**
 * medical
 */
h4.med-head {
    margin:16px 0px 0px 0px;
}

h4.med-head div.dyn-button.dyn-expand,
h4.med-head div.dyn-button.dyn-collapse {
    margin-left:10px;
    display:inline-block; 
    vertical-align:sub;
}

div.med-box {
    background: rgba(238, 238, 238, 0.9) none repeat scroll 0 0;
    border-color: #ccc !important;
    border-image: none;
    border-spacing: 0;
    border-style: solid solid none;
    border-width: 1px 1px 0;
    box-shadow: 0 1px 0 rgba(255, 255, 255, 0.3) inset, 0 0 2px rgba(255, 255, 255, 0.3) inset, 0 0 10px rgba(0, 0, 0, 0.1) inset, 0 1px 2px rgba(0, 0, 0, 0.1) !important;
    line-height: 18px;
    margin: 0 0 22px;
    text-align: left;
    width: 95%;
    padding:16px 10px 8px 10px;
}

/**
 * stp styles
 */

/* stp page */
div.stp-content {
    padding-left:0px !important;
    padding-right:0px !important;
}
h2.stp-page-title {
    position:relative;
    font-size:30px;
}
img.stp-logo {
    position: absolute;
    top: 10px;
    right: 2px;
    background: linear-gradient(#ccc,#777);
    box-shadow: 5px 5px 5px #999;
}
div#mao-view div.stp-desc {
    margin-bottom:20px;
    box-shadow:4px 4px 4px #a5a5a5;
    border:2px solid transparent;
}
div#mao-view div.stp-desc span {
    padding:0px 20px;
}
div#mao-view div.stp-desc:hover {
    box-shadow:4px 4px 4px #a5b5ff;
}
div#mao-view a.stp {
    display:inline-block;
    background:linear-gradient(#cccccc,#777777);
    border:2px solid #aaaaaa;
    border-radius:4px;
    min-width:200px;
    padding:3px 10px;
    font-weight:bold;
    color:white;
    text-align:center;
    text-shadow:2px 2px 2px black;
    text-decoration:none;
    box-shadow:4px 4px 4px #a5a5a5;
}
div#mao-view a.stp:hover {
    background:linear-gradient(#c7d0ff,#274dff);
    border:2px solid #647eff;
    text-shadow: 4px 4px 4px #0c0c6f;
}
div#mao-view a.stp:active {
    border-style:inset;
    border-width:3px;
}

/* order page */
div.stp-header-message {
    flex: 7 0 0;
    flex-direction: column;
    justify-content: flex-start;
    line-height: 34px;
}
span.stp-title {
    vertical-align: baseline;
    display: inline-flex;
    background: linear-gradient(315deg, #bbb, #ccc);
    color: #757575;
    padding: 0px 10px;
    border-radius: 12px 0px 0px 12px;
    border: 1px solid #aaa;
    text-shadow: 1px 1px 1px #dddddd;
    font-weight: bold;    
}
span.stp-body {
    display: inline-flex;
    padding: 0px 16px;
    color: #0a0;
    font-style: italic;
    text-shadow: 4px 4px 4px #aaa;
    font-weight: bold;
}
div.stp-header-ctrls {
    flex: 1 0 0;
    flex-direction: column;
    justify-content: flex-end;
    text-align: right;
    align-self: center;
}

div#mao-wait {
    background: rgba(0, 0, 0, 0) url(../images/wpspin_light.gif) no-repeat scroll 0 0 / 16px 16px;
    background-position: center;
    display: none !important;
    height: 20px;
    padding: 0px 0px 0px 54px;
    opacity: 0.7;
    width: 20px;
}

/* for activate extension */
div#ext-message { 
    position: absolute;
    top: 8px;
    right: 16px;
    opacity: 1;
    width: 32px;
    height: 32px;
    background-size: 32px;
    cursor:pointer;
}
div.ext-success {
    background-image: url(/wp-content/plugins/alert-sentry/images/icons8-ok-64.png);
}
div.ext-incomplete {
    background-image: url(/wp-content/plugins/alert-sentry/images/icons8-incomplete-64.png);   
}
div.ext-failure {
    background-image: url(/wp-content/plugins/alert-sentry/images/icons8-cancel-64.png);
}

div.adev-box {
    display: none;
    position: absolute;
    width: 300px;
    background: linear-gradient(#444444, #222222) !important;
    font-size: 12px;
    left: 32px;
    color: #eeeeee;
    text-align: left;
    border-radius: 0px 8px 8px 0px;
    border: none;
}
div#ext-message:hover div.adev-box {
    display: block;
}

div.adev-row {
    border-bottom: 1px solid #444444;
}
div.adev-row:last-child {
    border: none;
}
div.adev-header {
    font-weight: bold;
    text-align: center;
    font-size: 14px;
    padding: 2px 0px;
    background: linear-gradient(#777777, transparent);
    border-bottom: 1px solid #555555;
    border-radius: 0px 8px 0px 0px;
}
div.adev-header span.adev-failure {
    color: #fffcfc;
    border: 1px solid #ffffff77;
    padding: 0px 10px 0px 10px;
    background: linear-gradient(360deg, transparent, red);
    border-radius: 10px;
}
div.adev-name {
    display: table-cell;
    width: 84px;
    padding: 1px 8px 1px 0px;
    text-align: right;
    background: linear-gradient(45deg, #9a9a9a, transparent);
    border-right: 1px solid #4f4f4f;
}
div.adev-value {
    display: table-cell;
    width:192px;
    position:relative;
    padding: 1px 0px 1px 12px;
}

div.adev-value div.adev-error {
    position: absolute;
    display: inline-block;
    right: 8px;
    top: 2px;
    z-index:101;
    margin: 0px 0px 0px 0px;
    background: linear-gradient(360deg, gold, transparent);
    width: 16px;
    height: 16px;
    border: 2px solid #777777;
    border-radius: 50%;
    box-shadow: 0px 0px 10px #ffff00;
    line-height: 16px;
    text-align: center;
    font-weight: bold;  
}

/* original class in bValidator, add z-index */
div.bVErrMsgContainer {
    z-index: 10;
}

/**
 * referral
 */
p.referral-desc {
    font-style: italic;
    font-size: small;    
}
div.referral-section-box {
    display:block;
    position:relative;
    margin:0px 0px 16px 0px;
}
div.referral-subsection-box {
    position:absolute;
    top:0px;
    left:270px;    
}
div.referral-heading-box {
}
div.referral-heading-box h4 {
    display:inline-block;
}
div.referral-heading-subbox {
    vertical-align:top;
    position: relative;
    display: inline-block;
    width:300px;"    
}
div.referral-heading-subbox span {
    position:absolute;
    top:4px;
    right:0px;
    font-size:14px;
}
div.referral-heading-subbox span input {
    margin:0px 5px 2px 0px;
}
div.referral-success {
    position: relative;
    background: linear-gradient(45deg, gold, #e0bf0e);
    box-shadow: 8px 8px 8px #ccccff;
    border-radius: 6px;
    max-width: 740px;
    padding: 12px 0 10px 10px;
    text-align: center;
    text-shadow: 1px 1px 1px #ffffff77;
    margin: 0px 0px 30px 0px;
}