/*body {
    margin: 0px 0px 8px 0px;
}*/

table {
    text-align: left;
}


.label_hover {
    background-color: #ffc;
}

h1 {
    font-size: 18px;
    color: #000000;
    font-weight: bold;
}

h2 {
    font-size: 16px;
    color: #000000;
    font-weight: bold;
}

h3 {
    font-size: 14px;
    color: #000000;
    font-weight: bold;
}

.tableborder2 {
    border: 1px solid gray;
}

/*********** MENU ***********/

#menutable {
    margin: 0px 4px 0px 0px;
    padding: 0px;
}

#menutablemarginless {
    margin: 0px;
    padding: 0px;
}

#mainmenu {
    padding: 0px;
    margin: 0px;
    list-style-type: none;
}

    #mainmenu li span {
        padding-left: 2px;
    }

    #mainmenu ul li a {
        margin: 0px;
        display: block;
        /*padding-left: 10px;*/
        line-height: 14px;
        /*width: 100%;*/
    }

    #mainmenu a {
        display: block;
        /*width: 100%;*/
        border: 1px solid white;
        padding-left: 2px;
    }

        #mainmenu a:hover {
            display: block;
            color: #00a;
            background-color: #eee;
            text-decoration: none;
            border-top: 1px solid #ccc;
            border-left: 1px solid #ccc;
            border-right: 1px solid #999;
            border-bottom: 1px solid #999;
        }

    #mainmenu li {
        font-weight: bold;
        margin: 0px;
        padding: 0px;
        padding-top: 1px;
        padding-bottom: 5px;
        font-size: 12px;
    }

    #mainmenu ul li {
        font-weight: normal;
        padding: 0px;
        margin: 0px;
        font-size: 11px;
    }

    #mainmenu ul {
        margin: 0px;
        padding: 0px;
        list-style-type: none;
    }

#menuheader {
    color: white;
    font-size: 12px;
    padding: 2px 2px 2px 3px;
    margin: 0px;
    text-align: left;
}

/*********** FLOATER ***********/

#floatlayer_cover {
    position: absolute;
    right: 10px;
    top: 50px;
    width: 160px;
    padding-top: 12px;
    padding-bottom: 12px;
    vertical-align: middle;
    border: 1px solid #687C8D;
    color: #000;
    background-color: #FFAEB9;
    float: right;
    margin: 0px;
    z-index: 999;
}

    #floatlayer_cover table {
        box-shadow: 0 0 0 rgba(0,0,0,0);
    }

    #floatlayer_cover a, .plainlink {
        text-decoration: none;
        color: black;
    }

#fl_text {
    padding-left: 12px;
    padding-right: 12px;
}

#fl_input {
    text-align: right;
    padding: 0px;
    padding-top: 10px;
    margin: 0px;
}

    #fl_input input {
        width: 70px;
    }

/*********** FLOATER FORM ***********/

div.float_title {
    font-family: verdana, arial, helvetica, sans-serif;
    font-size: 14px;
    text-align: center;
}

div.float_left_title {
    font-family: verdana, arial, helvetica, sans-serif;
    font-size: 14px;
    text-align: left;
}

div.float_center {
    font-family: verdana, arial, helvetica, sans-serif;
    font-size: 14px;
    width: 90%;
    padding: 0px;
    margin-left: auto;
    margin-right: auto;
}

/********** SESSION AUTH FORM *******/
#session_auth_form {
    position: absolute;
    color: #000;
    z-index: 201;
    width: 300px;
    top: 50%;
    left: 50%;
    margin-left: -150px;
    margin-top: -100px;
    font-family: verdana, arial, helvetica, sans-serif;
    background-color: #f0f5fe;
    padding: 10px 10px 21px 10px;
    border: #777 solid 1px;
}

/*********** UIHIDE ***********/

.hide, .uiHide {
    display: none;
}

.uiShow {
    opacity: 1.0;
    -moz-opacity: 1.0;
    filter: alpha(opacity=100);
}

.uiTrans {
    opacity: 0.30;
    -moz-opacity: 0.30;
    filter: alpha(opacity=30);
}

.uiStrike {
    opacity: 1.0;
    -moz-opacity: 1.0;
    filter: alpha(opacity=100);
    text-decoration: line-through;
}

.showBlock {
    display: block;
}

/* Styles for mouse over menus */
.dateRange ul, .combo ul {
    margin: 0px;
    padding: 0px;
    list-style: none;
    /*width: 35px;*/
    text-align: left;
}

    .dateRange ul a {
        width: 35px;
    }

    .dateRange ul li, .combo ul li {
        position: relative;
    }

.dateRange li ul {
    width: 103px;
    left: 30px;
}

.combo li ul {
    padding-right: 2px;
    left: 19px;
    /*padding:4px;*/
    /*padding-right:2px;*/
}

.dateRange li ul, .combo li ul {
    position: absolute;
    top: 0px;
    display: none;
    border: 1px #687C8D solid;
    margin: 0px;
    background: #F0F5FE;
}

/* Allows the option to have pull outs move up or down */
.up li ul {
    top: -184PX;
}

.dateRange ul li ul li a {
    width: 101PX;
}

.combo ul li ul a {
    /*width:98%;*/
    width: 100%;
}

.dateRange ul li ul li a, .combo ul li ul a {
    display: block;
    white-space: nowrap;
    text-decoration: none;
    color: #777;
    background: #F0F5FE;
    padding-left: 2px;
    margin: 0px;
}

.dateRange ul li ul li, .combo ul li ul li {
    display: block;
}

    .dateRange ul li ul li a.noHighlight:hover {
        width: 93px;
        /*width: 101px;*/
    }

.combo table.dashtable, .combo table.dashtable tr, .combo table.dashtable tr td {
    padding: 0px;
    margin: 0px;
    white-space: nowrap;
    /*font-weight: bold;*/
    border-collapse: collapse;
    border-bottom: dashed 1px black;
    background: #F0F5FE;
}

.dateRange ul li ul li a.noHighlight:hover,
.combo ul li ul li a.noHighlight:hover {
    display: block;
    text-decoration: none;
    color: #777;
    background: #F0F5FE;
    padding-left: 2px;
    margin: 0px;
    border-top: 0px #000000 solid;
    border-bottom: 0px #000000 solid;
}

.dateRange ul li ul li a:hover {
    width: 93px;
    /*width: 101px;*/
    padding-left: 10px;
}

.combo ul li ul li a:hover {
    padding-left: 0px;
}

.dateRange ul li ul li a:hover,
.combo ul li ul li a:hover {
    /*color: #CE3210; */
    display: block;
    color: black;
    background: #FFF;
    /*
    border-left: 5px solid #CE3210;
    border-right: 5px solid #CE3210;
    border-top: 1px #0000cd solid;
    border-bottom: 1px #0000cd solid;
    */
    border-top: 1px #000000 solid;
    border-bottom: 1px #000000 solid;
}

/* Fix IE. Hide from IE Mac \*/
/* Not sure why someone wanted the li's to float on Mozilla it
   causes the li's to lose their block-iness and become inlines. */
*.dateRange ul li, *.combo ul li { /*float: left;*/
}

    *.dateRange ul li a, *.combo ul li a {
        height: 1%;
    }
/* End of IE Fix */
.combo img {
    z-index: 1;
}
/* Make it work */
/* old .combo li:hover ul, .combo li.over ul */
.dateRange li:hover ul, .dateRange li.over ul,
.combo li ul.display {
    display: block;
    z-index: 10;
    border: 1px #000000 solid;
}

/* End of the mouse over menu styles */
.small_notice {
    color: #999999;
    font-size: 11px;
    text-align: left;
}

    .small_notice span {
        font-weight: bold;
    }

.dashedbox {
    background: #f8f8f8;
    border: 1px dashed #ccc;
    color: black;
    padding: 1px;
}

.selected_table {
    background-color: #ff0000;
    /*color: red;*/
}

.unselected_table td {
    color: #aaaaaa;
}

.unselected_table {
    background-color: #aaaaaa;
}

.list_table {
    border-top: 1px dotted #ccc;
    border-bottom: 1px solid gray;
    border-right: 1px solid gray;
    table-layout: fixed;
    margin-right: 0px;
    padding: 0px;
}

.list_form_table {
    border-top: 1px dotted #ccc;
    border-bottom: 1px solid gray;
    border-right: 1px solid gray;
    /*table-layout: fixed;*/
    margin: 1px 0px 0px 0px;
    padding: 0px;
}
/******** EXPAND LIST ********/
.list_section {
    background: url('../images/lines_bg.gif') repeat-x top left;
    /* border-right: 1px solid gray;*/
    /*table-layout: fixed;*/
    margin: 0px;
    padding: 0px;
}

    /*ie: middle, ff: top*/
    .list_section img, .list_table img, .list_form_table img {
        vertical-align: middle;
    }

    html > body .list_table img, html > body .list_section img, html > body .list_form_table img {
        vertical-align: top;
    }

.expand_ht, .expand_h {
    cursor: pointer;
}

    .expand_ht td, .expand_h td, .expand_ht_no_pointer td {
        font-size: 13px;
        font-family: arial;
        font-weight: bold;
        line-height: 24px;
        height: 24px;
        padding: 0;
        margin: 0px;
        white-space: nowrap;
        overflow: hidden;
    }

    .expand_h td {
        background: url('../images/lines_bg.gif') repeat-x top left;
    }

.expand td, .expand_2 td {
    font-size: 12px;
    line-height: 24px;
    height: 24px;
    padding: 0;
    margin: 0;
    white-space: nowrap;
    overflow: hidden;
    background-image: url('../images/lines_bg.gif');
    background-repeat: repeat-x;
    background-position: top left;
}

.expand_2 td {
    background-color: #f0f5fe;
}

.expandLink {
    text-decoration: none;
    color: #000000;
}

.list_small, .list_small b, .list_small em, .list_small span {
    font-size: 10px;
    text-align: center;
}

.no_bg_img {
    background-image: none !important;
}

/***************/

.list_border_top {
    border-top: 1px solid gray;
}

.list_border_bottom {
    border-bottom: 1px solid gray;
}

.list_border {
    border-bottom: 1px solid gray;
    border-top: 1px solid gray;
}

.list_head_first {
    border: 0px;
    font-weight: bold;
}

.list_head {
    border-left: 1px dashed #CCCCCC;
}

.list_head_last {
    border-left: 1px dashed #CCCCCC;
    font-weight: bold;
}

.list_first {
    border-top: 1px dashed #CCCCCC;
}

.list {
    border-top: 1px dashed #CCCCCC;
    border-left: 1px dashed #CCCCCC;
}

.list_last {
    border-top: 1px dashed #CCCCCC;
    border-left: 1px dashed #CCCCCC;
}

.list_new_first, .first_row .list_first {
    border-top: 1px solid gray;
}

.list_new, .first_row .list {
    border-top: 1px solid gray;
    border-left: 1px dashed #CCCCCC;
}

.list_new_last, .first_row .list_last {
    border-top: 1px solid gray;
    border-left: 1px dashed #CCCCCC
}

.new_row_first {
    border-right: 1px solid #000000;
    border-left: 1px solid #000000;
}

.new_row_last {
    border-right: 1px solid gray;
}

.new_row {
    border-right: 1px solid gray;
}

.new_first {
    border-top: 1px solid gray;
    border-right: 1px dashed #CCCCCC;
    border-left: 1px solid gray;
}

.new_last {
    border-top: 1px solid gray;
    border-right: 1px solid gray;
}

.new {
    border-top: 1px solid gray;
    border-right: 1px dashed #CCCCCC;
}

.more_first {
    border-top: 1px dashed #CCCCCC;
    border-right: 1px dashed #CCCCCC;
    border-left: 1px solid gray;
    /*    padding: -1;*/
}

.more_last {
    border-top: 1px dashed #CCCCCC;
    border-right: 1px solid gray;
    /*    padding: -1;*/
}

.more_main {
    border-top: 1px dashed #CCCCCC;
    border-right: 1px dashed #CCCCCC;
    /*    padding: -1;*/
}

.last_row {
    border-top: 1px solid gray;
    padding: 0px;
    margin: 0px;
    line-height: 1px;
}

#paginator {
    font-size: 12px;
    font-weight: bold;
}

    #paginator img {
        margin-top: 3px;
    }
/* Outside Shadow */
.mainarea a.button {
    text-decoration: none;
    color: #000000;
    background-color: #d4d0c8;
    padding: 2px 8px 2px 8px;
    border: 2px outset #cccccc;
}

    /* Outside Shadow */
    .mainarea a.button:hover {
        text-decoration: none;
        color: #666666;
        background-color: #d4d0c8;
        padding: 2px 8px 2px 8px;
        border: 2px inset #cccccc;
    }

/*********** RECEIPTS ***********/

#receipt_table td {
    vertical-align: top;
}

.receipt_header {
    /*border: 1px solid black;*/
    margin: 0px;
    text-align: center;
    font-weight: normal;
    text-transform: none;
}

.receipt_product_header {
    text-align: center;
    font-weight: bold;
}

.receipt_product_header_desc, .receipt_product_header_item {
    text-align: left;
    font-weight: bold;
}

.receipt_product_header_amount, .receipt_product_header_price {
    text-align: right;
    font-weight: bold;
}

.receipt_product {
    text-align: center;
}

.receipt_product_desc, .receipt_product_item {
    text-align: left;
}

.receipt_product_amount, .receipt_product_price {
    text-align: right;
}

input.tight {
    padding: 1px;
    margin: 1px;
    font-family: verdana, tahoma, arial, helvetica;
    font-size: 11px;
}

/*********** FLAGS ***********/

.tosbg {
    background-color: #FFFFCC !important;
}

.billauthbg {
    background-color: #CCDFEE !important;
}

.pastduebg {
    background-color: #FFAEB9 !important;
}

.haltedbg {
    background-color: #73BAF7 !important;
}

.delinquentbg {
    background-color: #FFCC66 !important;
}

.normalbg {
    background-color: white !important;
}

.bluebg {
    background-color: #F0F5FE !important;
}

.warningyellow {
    background-color: #FFFBB8 !important;
}

.greenbg {
    background-color: #AAFFAA !important;
}

.tosbg_border {
    border-top: 1px solid #ffffcc;
    background-color: #FFFFCC;
}

.billauthbg_border {
    border-top: 1px solid #ccdfee;
    background-color: #CCDFEE;
}

.pastduebg_border {
    border-top: 1px solid #ffaeb9;
    background-color: #FFAEB9;
}

.delinquentbg_border {
    border-top: 1px solid #ffcc66;
    background-color: #FFCC66;
}

/******* VT ********/

.legacy-level3table, .legacy-level3table td, .legacy-level3table tr, #invoicetable, #invoicetable td, #invoicetable tr {
    font-family: verdana, tahoma, arial, helvetica;
    text-align: center;
    font-size: 10px;
    padding: 0px;
    margin: 0px;
    /*//height: 16px;
    //line-height: 16px;*/
    vertical-align: middle;
}

    .legacy-level3table tr.odd td, .legacy-level3table tr.even td, #invoicetable tr.odd td, #invoicetable tr.even td {
        border-top: 0px;
        border-right: 0px;
        border-left: 1px solid gray;
        border-bottom: 1px solid gray;
        vertical-align: middle;
    }

    .legacy-level3table tr.level3Hidden, #invoicetable tr.invoiceHidden {
        display: none;
    }

    .legacy-level3table td.tableheader, #invoicetable td.tableheader {
        font-size: 12px;
        text-align: left;
        padding: 3px;
    }

    .legacy-level3table input, #invoicetable input {
        font-size: 1em;
        font-family: verdana, tahoma, arial, helvetica;
        text-align: left;
        border: 0px;
        padding: 0px;
        margin: 0px;
        /*//height: 16px;
    //line-height: 16px;*/
        width: 100%;
        color: #000;
        background-color: #fff;
        vertical-align: middle;
    }

    .legacy-level3table select, .legacy-level3table option, #invoicetable select, #invoicetable option {
        font-size: 9px;
        font-family: verdana, tahoma, arial, helvetica;
        text-align: left;
        border: 0px;
        padding: 0px;
        margin: 0px;
        color: #000;
        background-color: #fff;
    }

        .legacy-level3table input.able:hover, .legacy-level3table select.able:hover, #invoicetable input.able:hover, #invoicetable select.able:hover {
            background-color: #f4f4f4;
        }

        .legacy-level3table input.able:focus, .legacy-level3table select.able:focus, #invoicetable input.able:focus, #invoicetable select.able:focus {
            background-color: #eee;
        }

        .legacy-level3table input.disable, .legacy-level3table select.disable, #invoicetable input.disable, #invoicetable select.disable {
            color: #999;
            background-color: #ccc;
        }

            .legacy-level3table input.disable:hover, .legacy-level3table select.disable:hover, #invoicetable input.disable:hover, #invoicetable select.disable:hover {
                cursor: default;
            }

    .legacy-level3table tr.head td {
        border: 0px;
        border-bottom: 1px solid gray;
        background-color: #ccc;
        font-weight: bold;
        padding-top: 2px;
        padding-bottom: 2px;
    }

    .legacy-level3table a, #invoicetable a {
        padding: 2px;
    }

    .legacy-level3table td.tableheader a, #invoicetable td.tableheader a {
        font-size: 10px;
        color: #fff;
    }

        .legacy-level3table a:hover, .legacy-level3table td.tableheader a:hover, #invoicetable a:hover, #invoicetable td.tableheader a:hover {
            color: #000;
            background-color: #eee;
            text-decoration: none;
        }

    .legacy-level3table tr#level3totalrow a, #invoicetable tr#invoicetotalrow a {
        text-decoration: none;
        padding: 0px;
        color: #000;
    }

        .legacy-level3table tr#level3totalrow a span#level3total, #invoicetable tr#invoicetotalrow a span#invoicetotal {
            text-decoration: underline;
        }

        .legacy-level3table tr#level3totalrow a:hover span#level3total, #invoicetable tr#invoicetotalrow a:hover span#invoicetotal {
            text-decoration: none;
        }

    .legacy-level3table tr#level3totalrow span, .legacy-level3table em, #invoicetable tr#invoicetotalrow span, #invoicetable em {
        font-weight: normal;
    }

        .legacy-level3table tr#level3totalrow span#level3total, #invoicetable tr#invoicetotalrow span#invoicetotal {
            font-weight: bold;
        }

    .legacy-level3table abbr, #invoicetable abbr {
        border-bottom: 1px dotted gray;
        cursor: help;
    }


.modern-level3table, .modern-level3table td, .modern-level3table tr {
    text-align: center;
    padding: 0px !important; /* avoid being overwritten by bootstrap .table */
    margin: 0px;
    vertical-align: middle;
}

    .modern-level3table tr.odd td, .modern-level3table tr.even td {
        border-top: 0px;
        border-right: 0px;
        vertical-align: middle;
    }

    .modern-level3table tr.level3Hidden {
        display: none;
    }

    .modern-level3table td.tableheader {
        font-size: 12px;
        text-align: left;
        padding: 3px;
    }

    .modern-level3table input {
        text-align: left;
        border: 0px;
        padding: 0px;
        margin: 0px;
        width: 100%;
        background-color: #fff;
        vertical-align: middle;
    }

    .modern-level3table select, .modern-level3table option {
        text-align: left;
        border: 0px;
        padding: 0px;
        margin: 0px;
        background-color: #fff;
    }

        .modern-level3table input.able:hover, .modern-level3table select.able:hover {
            background-color: #f4f4f4;
        }

        .modern-level3table input.able:focus, .modern-level3table select.able:focus {
            background-color: #eee;
        }

        .modern-level3table input.disable, .modern-level3table select.disable, .modern-level3table td.disable {
            color: #999;
            background-color: #ccc;
        }

            .modern-level3table input.disable:hover, .modern-level3table select.disable:hover {
                cursor: default;
            }

    .modern-level3table tr.head td {
        border: 0px;
        border-bottom: 1px solid gray;
        background-color: #ccc;
        font-weight: bold;
        padding-top: 2px;
        padding-bottom: 2px;
    }

    .modern-level3table a {
        padding: 2px;
    }

    .modern-level3table td.tableheader a {
        font-size: 10px;
        color: #fff;
    }

        .modern-level3table a:hover, .modern-level3table td.tableheader a:hover {
            color: #000;
            background-color: #eee;
            text-decoration: none;
        }

    .modern-level3table tr#level3totalrow a {
        text-decoration: none;
        padding: 0px;
        color: #000;
    }

        .modern-level3table tr#level3totalrow a span#level3total {
            text-decoration: underline;
        }

        .modern-level3table tr#level3totalrow a:hover span#level3total {
            text-decoration: none;
        }

    .modern-level3table tr#level3totalrow span, .modern-level3table em {
        font-weight: normal;
    }

        .modern-level3table tr#level3totalrow span#level3total {
            font-weight: bold;
        }

    .modern-level3table abbr {
        border-bottom: 1px dotted gray;
        cursor: help;
    }

.liteRowEven {
    text-align: center;
}

    .liteRowEven div, .liteRowOdd div, .deactivated_device div, .liteRowEven form {
        margin: 0px;
        padding: 0px;
        vertical-align: middle;
    }

.liteRowOdd {
    text-align: center;
    background-color: #f0f5fe;
    margin: 0px;
    padding: 0px;
}

.deactivated_device {
    background-color: #a7a791;
    color: #000000;
    text-align: center;
}

.divTable {
    display: table;
}

.divTr {
    display: table-row;
}

.divTd {
    display: table-cell;
}

#loading_cover {
    visibility: hidden;
    background: #f0f5fe;
    z-index: 101;
    border: #777777 solid 1px;
    width: 320px;
    position: fixed;
    top: 50%;
    left: 50%;
    font-family: verdana, arial, helvetica, sans-serif;
    margin-top: -50px;
    margin-left: -150px;
}


#loading_text {
    padding: 3px;
    font-weight: bold;
    font-size: 13px;
    padding-top: 20px;
    text-align: center;
}

#loading_img_div {
    text-align: center;
    width: 320px;
    height: 90px;
    display: table-cell;
    vertical-align: middle;
}

/* Override table font to restore bootstrap styling */
body .content-container table {
    font-family: "Helvetica Neue",Helvetica,Arial,sans-serif;
    font-size: 14px;
}

.template {
    display: none;
}

.clearfix:after {
    display: block;
    content: "";
    clear: both;
}

/* When space is available, allow for a larger modal which doesn't cramp the product manager table */
@media (min-width:870px) {
    #float_OrderTemplatesPopUp .modal-dialog {
        width: 90%;
        max-width: 850px;
    }
}

/* Ensure the "quantity" field is never compressed so much that it becomes cut off */
#product_quantity_1 {
    min-width: 55px;
}

#product_quantity_101 {
    min-width: 55px;
}

.yellow-row td {
    background-color: #FFFFCC;
}


.l10n-translation-container {
    display: none;
}


.radioDetailsCell {
    vertical-align: top;
}

.radioDetailsBlurb {
    border: 2px solid black;
    padding: 5px;
    text-align: left;
    vertical-align: top;
}

.deferredReportingDownload {
    width: 100%;
    margin-top: 10px;
}

.deferredReportingDownload__imageContainer {
    width: 50px;
    float: left;
}

.deferredReportingDownload__image {
    width: 100%;
}

.deferredReportingDownload__text {
    float: left;
    margin-left: 20px;
}

.errorText {
    color: red;
    font-size: 15px;
    font-weight: 700;
}


.one-time-notification-popup a.otnCancel {
    cursor: pointer;
    margin: -5px;
    padding: 5px;
    color: white;
    font-size: 22px;
    font-weight: bold;
    font-family: Verdana, sans-serif;
}

    .one-time-notification-popup a.otnCancel:hover {
        text-decoration: none;
    }


.one-time-notification-popup .btn.btn--info {
    color: #fff;
    background: linear-gradient(#3E87EF, #136BE7);
}

.one-time-notification-popup .btn.btn--secondary {
    color: black;
    background-color: white;
    background-image: none;
}

.one-time-notification-popup-container .tid, .one-time-notification-popup-container .dismissed, .one-time-notification-popup-container .accepted {
    display: none;
}

.otnId {
    display: none;
}

.wrapEnforced {
    /* See https://css-tricks.com/snippets/css/prevent-long-urls-from-breaking-out-of-container/ for explanation */
    overflow-wrap: break-word;
    word-wrap: break-word;
    -ms-word-break: break-all;
    word-break: break-all;
    word-break: break-word;
    -ms-hyphens: auto;
    -moz-hyphens: auto;
    -webkit-hyphens: auto;
    hyphens: auto;
}

.legacy-panel {
    border: 1px solid #3E87EF;
    background-color: white;
    text-align: left;
    box-shadow: 0px 4px 15px 0px rgba(0, 0, 0, 0.32);
}

    .legacy-panel * {
        font-family: Verdana, sans-serif;
        font-size: 12px;
    }

.legacy-panel-heading {
    background-color: #3E87EF;
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 5px 10px;
}

    .legacy-panel-heading h3 {
        margin: 0;
        color: white;
        font-size: 16px;
        font-weight: 400;
    }

.legacy-panel-body {
    padding: 5px 10px 10px 10px;
}

.legacy-button {
    min-width: 200px;
    height: 35px;
    color: #FFFFFF;
    background-color: #36175F;
    font-size: 1.3em;
    padding: 15px;
    padding-top: 3px;
    margin-top: 10px;
    display: inline-block;
    text-align: center;
    box-shadow: 0 3px 4px 0 rgba(0,0,0,0.30);
    transition: 150ms;
    border: 0;
    line-height: 32px;
    text-decoration: none;
    margin: 2px;
    background-image: linear-gradient(#3E87EF, #136BE7);
}

    .legacy-button:hover {
        cursor: pointer;
    }

.legacy-panel-cancel {
    cursor: pointer;
}

.one-time-notification-popup-container {
    position: absolute;
    top: 50px;
    right: 10px;
    z-index: 200;
    overflow: hidden;
    width: 400px;
    display: flex;
    flex-flow: column wrap;
    max-width: 400px;
    z-index: 200;
}

.one-time-notification-popup {
    transition: opacity 0.4s ease-out;
    opacity: 1;
    box-shadow: 0px 3px 4px #00000030;
    margin-bottom: 10px;
}

    .one-time-notification-popup.hide-notification {
        opacity: 0;
    }

    .one-time-notification-popup .legacy-button.btn--secondary {
        color: black;
        min-width: 150px;
        background-color: white;
        background-image: none;
    }

    .one-time-notification-popup .legacy-button.btn--info {
        min-width: 150px;
    }

.otnSubmit {
    display: inline;
}

.caption {
    position: relative;
}

.pinnedRight {
    float: right;
    padding-left: 15px;
}

.boxForEqualPadding {
    width: 100px;
    display: inline-block;
    float: left;
    height: 21px;
    margin-right: 15px;
    box-sizing: border-box;
}

a.blockButton {
    text-decoration: none;
    color: #000000;
    background-color: #d4d0c8;
    padding: 2px 2px 2px 2px;
    border: 2px outset #cccccc;
    width: 100px;
    box-sizing: border-box;
    cursor: pointer;
    display: inline-block;
    margin-bottom: 5px;
}

.dropIcon {
    margin-right: 10px;
    float: left;
}

div.field-group-container {
    padding-left: 5px;
    padding-right: 5px;
}

.field-group {
    display: flex;
    align-items: flex-start;
    flex-direction: column;
    border: 1px solid rgb(232, 232, 232);
    padding: 10px;
    border-radius: 4px;
    margin-left: 3px;
    margin-right: 3px;
    margin-bottom: 6px;
}

    .field-group div:nth-last-child(2) {
        margin-left: 25px;
        margin-right: 25px;
        padding-left: 0;
        padding-right: 0;
        margin-bottom: 0;
    }

@keyframes flashYellow {
    0% {
        color: yellow;
    }

    50% {
        color: black;
    }

    100% {
        color: yellow;
    }
}

.criticalError {
    color: yellow;
    animation-name: flashYellow;
    animation-duration: 1s;
    animation-iteration-count: infinite;
}

a {
    text-decoration: none !important;
}