/*
 * Smitty (2015/03/11 - 2015/08/13)
 *  Made extensive changes to conform to CashPro style requirements
 *
 * Smitty (2016/06/23 - 2017/01/25)
 *  Made 3.10.0 upgrade changes for RDSO 
 *
 * Smitty (2018/03/28 - 2018/07/14)
 *  Made 3.14.1 upgrade changes for RDSO
 *
 * Smitty (2020/05/01 - 2021/01/08)
 *  Made CashPro mandated branding changes
 *
 * Shalaka & Smitty (2023/06/01 - 2024/??/??)
 *  Made changes to support 3.19 upgrade. This includes adding a masthead and Confirm
 *  dialog to the admin portal as a part of moving the Admin portal to a separate tab,
 *  like what was done earlier for the Customer portal.
 *
 * NOTES:
 *
 * + Use the following escapes in place of the associated character for any #id
 *   selectors to ensure they will be properly recognized in all browsers.
 *
 *       Char  Escape
 *       ----  -------
 *        :    \:
 *        .    \00002e
 *
 * + Use versioning for any images referenced by adding '?v=n' to the end of
 *   the URL reference to force browsers to download the latest images.
 *
 *       background-image: url("../images/icon_edit_hover.svg?v=4");
 *
 *   If an image gets updated add 1 to n whenever the image is modified to
 *   ensure the new image is downloaded.
 *
 * +++++++ IMPORTANT ++++++++ IMPORTANT ++++++++ IMPORTANT ++++++++ IMPORTANT ++++++++
 *
 *   The pages served from the web server have been modified to use the same style
 *   sheets as the main app. Therefore, make sure to copy this file to the
 *   /unavailable/css directory to ensure the latest styles are applied. In addition,
 *   make sure any required font files are also copied there. Finally, image files
 *   are located in /unavailable/images. Make sure any images that are updated are
 *   also copied there if needed.
 */

/* Main Navigation Styles */

.StartOn,
.EndOn,
.StartOff, 
.EndOff {
 display: none;
}

/* Top Navigation Styles */

#Nav ul {
 list-style-type: none;
 margin: 0;
 padding: 0;
 height: 3.5rem;
}
#Nav li {
 display: table-cell;
 padding-left: 0.6rem;
 padding-right: 0.6rem;
 position: relative;
}
#Nav a:hover {
 text-decoration: none;
}
#Nav .NavOn,
#Nav .NavOff {
 border-radius: 0.4rem 0.4rem 0 0;
 display: inline-block;
 height: 3.5rem;
 line-height: 3.3rem;
 padding-left: 1rem;
 padding-right: 1rem;
 position: relative;
 white-space: nowrap;
}
#Nav .NavOn {
 color: #000a23;
 text-decoration: none;
 border-left: solid 0.1rem #cccccc;
 border-top: solid 0.1rem #cccccc;
 border-right: solid 0.1rem #cccccc;
 border-bottom: solid 0.2rem #ffffff;
 padding-left: 0.9rem;
 padding-right: 0.9rem;
}
#Nav .NavOn::before {
 background-color: #e31837;
 border-radius: 0.3rem 0.3rem 0 0;
 content: "";
 height: 0.4rem;
 position: absolute;
 top: 0;
 right: 0;
 width: 100%;
}
#Nav .NavOff:hover {
 color: #0052c2;
 border-left: solid 0.1rem #cccccc;
 border-top: solid 0.1rem #cccccc;
 border-right: solid 0.1rem #cccccc;
 padding-left: 0.9rem;
 padding-right: 0.9rem;
}
#Nav .NavOff:hover::before {
 background-color: #012169;
 border-radius: 0.3rem 0.3rem 0 0;
 content: "";
 height: 0.4rem;
 position: absolute;
 top: 0;
 right: 0;
 width: 100%;
}

/* Side Navigation Styles */

#SideNav {
 min-width: 17rem;
}
#SideNav ul {
 width: 100%;
 list-style-type: none;
 margin: 0;
 padding-left: 0;
}
#SideNav li {
 padding-top: 0.6rem;
 padding-bottom: 0.6rem;
}
#SideNav span {
 display: inline-block;
}
#SideNav .NavOn,
#SideNav .NavOff {
 width: 17rem;
 display: table-cell;
 border-radius: 0.4rem 0 0 0.4rem;
 vertical-align: middle;
 line-height: 1.6rem;
 padding-left: 0.8rem;
 padding-top: 1rem;
 padding-bottom: 1rem;
 position: relative;
}
#SideNav .NavOn {
 border-top: solid 0.1rem #cccccc;
 border-right: solid 0.2rem #ffffff;
 border-bottom: solid 0.1rem #cccccc;
 border-left: solid 0.1rem #cccccc;
 color: #000a23;
 padding-left: 0.7rem;
 padding-top: 0.9rem;
 padding-bottom: 0.9rem;
}
#SideNav .NavOn::before {
 background-color: #e31837;
 height: 100%;
 width: 0.4rem;
 content: "";
 position: absolute;
 left: 0;
 top: 0;
 border-radius: 0.3rem 0 0 0.3rem;
}
#SideNav .NavOff:hover {
 border-left: solid 0.1rem #cccccc;
 border-top: solid 0.1rem #cccccc;
 border-bottom: solid 0.1rem #cccccc;
 padding-left: 0.7rem;
 padding-top: 0.9rem;
 padding-bottom: 0.9rem;
}
#SideNav .NavOff:hover::before {
 content: "";
 height: 100%;
 width: 0.4rem;
 background: #012169;
 display: inline-block;
 position: absolute;
 top: 0;
 left: 0;
 border-radius: 0.3rem 0 0 0.3rem;
}
#SideNav span img {
 float: left;
 padding-right: 0.8rem;
}
#SideNav span #Last {
 background-repeat: no-repeat;
}

/* FILTER STYLES */

.FilterBoxHide {
 display: none;
}
.FilterBoxShow {
 z-index: 5;
 border: solid 0.2rem #d5d5d5;
 background-color: #ffffff;
 padding-bottom: 0.8rem;
 min-width: 28rem;
}
.FilterBoxShow p {
 margin: 0;
 padding-left: 1.6rem;
 padding-right: 1.6rem;
}
.FilterBoxShow p:last-child {
 margin-top: 2.4rem;
 border-top: solid 0.1rem #cccccc;
 padding-top: 0.8rem;
}
p.FilterInputs,
.FilterBoxShow p:last-child {
 text-align: center;
}
.FilterButton[id$="FilterSubmit"] {
 margin-right: 1.6rem;
}
p.FilterTitle {
 font-size: 2rem;
 line-height: 2rem;
 text-align: left;
 font-weight: normal;
 color: #012169;
 font-family: Connections;
 height: 4.7rem;
 padding-right: 6rem;
 padding-top: 1.6rem;
 border-bottom: solid 0.1rem #cccccc;
 margin-bottom: 2.4rem;
}
p.FilterFormat {
 font-weight: normal;
 color: #646464;
 margin-top: 0.8rem;
}
.FilterInfo {
 font-weight: normal;
 color: #696969;
}
.FilterInfo p {
 margin: 0;
 padding-top: 0.4rem;
}
.FilterSeparator {
 padding-left: 0.5rem;
 padding-right: 0.5rem;
 font-weight: normal;
}
.FilterBoxShow[id$='Date'] .FilterSeparator {
 display: block;
 width: 14.4rem;
 margin-top: 0.5rem;
 margin-bottom: 0.5rem;
}
.FilterBoxShow[id$='Date'] input[id$='Value1Input'],
.FilterBoxShow[id$='Date'] input[id$='Value2Input'],
.FilterBoxShow[id$='ExpiryTime'] input[id$='Value1Input'],
.FilterBoxShow[id$='ExpiryTime'] input[id$='Value2Input'] {
 width: calc(50% - 3.1rem) !important;
}
.FilterBoxShow[id$='Date'] input[id$='Value1'],
.FilterBoxShow[id$='Date'] input[id$='Value2'],
.FilterBoxShow[id$='ExpiryTime'] input[id$='Value1'],
.FilterBoxShow[id$='ExpiryTime'] input[id$='Value2'] {
 margin-left: 0.8rem;
 vertical-align: middle !important;
 height: 1.8rem;
 width: 1.6rem !important;
}
.FilterBoxShow[id$='Date'] .FilterFormat span,
.FilterBoxShow[id$='ExpiryTime'] .FilterFormat span {
 display: inline-block;
 width: calc(50% + 0.8rem);
}
.FilterBoxShow[id$='Date'] .FilterFormat::after,
.FilterBoxShow[id$='ExpiryTime'] .FilterFormat::after {
 content: "(mm/dd/yyyy)";
 display: inline-block;
}
.FilterInputs input[src*='icon_calendar.png'] {
 margin-left: 0.8rem;
 vertical-align: middle;
 height: 1.8rem;
 width: 1.6rem;
 background-image: url('../images/icon_calendar.svg?v=3');
 background-size: 1.6rem 1.8rem;
}
.FilterInputs input[src*='icon_calendar.png']:disabled {
 background-image: url('../images/icon_calendar_inactive.svg?v=3');
}
#FilterBoxRecognitionError p:last-child {
 margin-top: 0;
 border-top: none;
}
#FilterBoxRecognitionError p.FilterTitle {
 margin-bottom: 0;
}
#Form\:FilterBoxRecognitionError\:FilterNo,
#Form\:FilterBoxRecognitionError\:FilterYes {
 margin-right: 1.6rem;
}

/* List Pagination Styles */

#PaginationContent {
 cursor: default;
 padding-top: 0.8rem;
 display: flex;
 flex-flow: row wrap;
 justify-content: end;
}
.ShowImageQuality #PaginationContent,
.Reports #PaginationContent {
 display: none;
}
#Pagination {
 white-space: nowrap;
 order: 2;
 text-align: center;
 line-height: 4rem;
 flex: 0 0 auto;
}
.TextTDPagination {
 height: 4rem;
 min-width: 2.4rem;
 display: inline-block;
 font-size: 1.6rem;
 font-family: HelveticaNeue, Helvetica, Arial, sans-serif;
 text-align: center;
 line-height: 4rem;
 background-color: #ffffff;
 color: #0052c2;
 padding-left: 0.4rem;
 padding-right: 0.4rem;
 font-weight: bold;
 margin: 0 0.2rem;
}
.TextTDPaginationSelected {
 display: inline-block;
 height: 4rem;
 min-width: 2.4rem;
 text-align: center;
 line-height: 4rem;
 font-size: 1.6rem;
 font-family: HelveticaNeue, Helvetica, Arial, sans-serif;
 color: #000a23;
 font-weight: bold;
 text-decoration: underline;
 text-underline-offset: 0.4rem;
 text-decoration-thickness: 0.2rem;
}
a.TextTDPagination:hover {
 background-color: #ccebf8;
 text-decoration: underline;
 text-underline-offset: 0.4rem;
 text-decoration-thickness: 0.2rem;
}
.TextTDPagination:active {
 background-color: #012169;
 color: #ffffff;
}
#Form:transactionItems #Pagination font:not(.TextTDPagination) {
 height: 4rem;
 min-width: 2.4rem;
 display: inline-block;
 line-height: 4rem;
 text-align: center;
 font-size: 1.6rem;
 font-family: HelveticaNeue, Helvetica, Arial, sans-serif;
 color: #c4c4c4;
}
font.TextTDPagination:not(:first-child):not(:last-child) {
 display: inline-block;
 color: transparent;
 background-image: url("../images/rdso-ellipsis.svg?v=3");
 background-repeat: no-repeat;
 background-position: center center;
 background-size: 1.8rem;
}
font.TextTDPagination:first-child {
 color: transparent;
 vertical-align: middle;
 padding: 0;
 background-image: url("../images/rdso-page-previous-inactive.svg?v=3");
 background-repeat: no-repeat;
 background-position: center center;
 background-size: auto 1.6rem;
}
font.TextTDPagination:last-child {
 display: inline-block;
 color: transparent;
 vertical-align: middle;
 padding: 0;
 background-image: url("../images/rdso-page-next-inactive.svg?v=3");
 background-repeat: no-repeat;
 background-position: center center;
 background-size: auto 1.6rem;
}
a.TextTDPagination:first-child {
 display: inline-block;
 color: transparent;
 vertical-align: middle;
 padding: 0;
 background-image: url("../images/rdso-page-previous.svg?v=3");
 background-repeat: no-repeat;
 background-position: center center;
 background-size: auto 1.6rem;
}
a.TextTDPagination:last-child {
 display: inline-block;
 color: transparent;
 vertical-align: middle;
 padding: 0;
 background-image: url("../images/rdso-page-next.svg?v=3");
 background-repeat: no-repeat;
 background-position: center center;
 background-size: auto 1.6rem;
}
#PageSizeSelector {
 text-align: right;
 order: 3;
 flex: 1 1 auto;
 line-height: 4rem;
}
#PageSizeSelector a {
 display: inline-block;
 height: 4rem;
 padding: 0 0.4rem;
 color: #0049ac;
 font-family: HelveticaNeue, Helvetica, Arial, sans-serif;
 line-height: 4rem;
 text-align: center;
 font-weight: bold;
}
#PageSizeSelector a:hover {
 background-color: #ccebf8;
 text-underline-offset: 0.4rem;
 text-decoration-thickness: 0.2rem;
}
#PageSizeSelector a:active {
 background-color: #012169;
 color: #ffffff;
}
#PageSizeSelector font {
 color: #000a23;
 height: 4rem;
 padding: 0 0.4rem;
 display: inline-block;
 line-height: 4rem;
 font-family: HelveticaNeue, Helvetica, Arial, sans-serif;
 text-align: center;
 font-weight: bold;
 text-decoration: underline;
 text-underline-offset: 0.4rem;
 text-decoration-thickness: 0.2rem;
}
#PageSizeSelector font:last-child {
 margin-right: 0;
}
#PageSizeSelector::before {
 content: "Items per page";
 padding-right: 0.8rem;
}
.RoleSearch #PageSizeSelector::before {
 content: "Roles per page";
}
.AccountList #PageSizeSelector::before,
.CustomerDetails #PageSizeSelector::before,
.UserAccountExclusion #PageSizeSelector::before {
 content: "Accounts per page";
}
.BankUserSearch #PageSizeSelector::before,
.UserSearch #PageSizeSelector::before {
 content: "Users per page";
}
.CustomerSelection #PageSizeSelector::before,
.CustomerSearch #PageSizeSelector::before {
 content: "Customers per page";
}
.DepositList #PageSizeSelector::before {
 content: "Deposits per page";
}
.MessageList #PageSizeSelector::before {
 content: "Messages per page";
}
.VirtualEndorsements #PageSizeSelector::before {
 content: "Endorsement fields per page";
}
.DepositLocationSelect #PageSizeSelector::before,
.LocationSearch #PageSizeSelector::before {
 content: "Account groups per page";
}
.DepositConstraintProfileSearch #PageSizeSelector::before {
 content: "Profiles per page";
}
.WBI #PageSizeSelector::before {
 content: "Requests per page";
}
.FieldList #PageSizeSelector::before {
 content: "Custom fields per page";
}
.RuleList #PageSizeSelector::before {
 content: "Rules per page";
}
.CouponRuleList #PageSizeSelector::before {
 content: "Coupon rules per page";
}
#Form\:paginationInfo {
 display: block;
}
.paginationInfo {
 white-space: nowrap;
 line-height: 4rem;
 order: 1;
 flex: 1 1 auto;
}
.paginationInfo::after {
 content: " items";
}
.RoleSearch .paginationInfo::after {
 content: " roles";
}
.AccountList .paginationInfo::after,
.CustomerDetails .paginationInfo::after,
.UserAccountExclusion .paginationInfo::after {
 content: " accounts";
}
.BankUserSearch .paginationInfo::after,
.UserSearch .paginationInfo::after {
 content: " users";
}
.CustomerSelection .paginationInfo::after,
.CustomerSearch .paginationInfo::after {
 content: " customers";
}
.DepositList .paginationInfo::after {
 content: " deposits";
}
.DepositLocationSelect .paginationInfo::after,
.LocationSearch .paginationInfo::after {
 content: " account groups";
}
.MessageList .paginationInfo::after {
 content: " messages";
}
.VirtualEndorsements .paginationInfo::after {
 content: " endorsement fields";
}
.DepositConstraintProfileSearch .paginationInfo::after {
 content: " profiles";
}
.WBI .paginationInfo::after {
 content: " requests";
}
.FieldList .paginationInfo::after {
 content: " custom fields";
}
.RuleList .paginationInfo::after {
 content: " rules";
}
.CouponRuleList .paginationInfo::after {
 content: " coupon rules";
}

/* AJAX Check Updater */
#itemUpdater {
 width: 25rem;
 position: absolute;
 background: #f0f0f0;
 border-left-style: solid;
 border-left-width: 0.1rem;
 border-left-color: #333333;
 border-right-style: solid;
 border-right-width: 0.1rem;
 border-right-color: #333333;
 border-bottom-style: solid;
 border-bottom-width: 0.1rem;
 border-bottom-color: #333333;
 border-top-style: solid;
 border-top-width: 0.1rem;
 border-top-color: #333333;
 padding: 0;
 text-align:center;
 color: #333333;
 z-index: 100;
}
.itemUpdaterHide {
 visibility: hidden;
 position: absolute;
 bottom: 30rem;
}
.itemUpdaterShow { }
#updaterHeader {
 width: 100%;
 height: 1.5rem;
 background: #cccccc;
 line-height: 1.5rem;
 border-bottom-style: solid;
 border-bottom-width: 0.1rem;
 border-bottom-color: #999999;
}
#updaterHeader .updaterTitle {
 float: left;
 color: #333333;
 font-weight:bold;
 margin-left:0.5rem;
}
#updaterHeader .updaterClose {
 filter:alpha(opacity=60);
 -moz-opacity: 0.6;
 float:right;
}
#updaterHeader img {
 border-bottom-style: solid;
 border-bottom-width: 0.1rem;
 border-bottom-color: #999999;
 border-left-style: solid;
 border-left-width: 0.1rem;
 border-left-color: #999999;
}
#legend {
 width: 100%;
 margin-top: 0.5rem;
 margin-bottom: 0.5rem;
}
.legendSent,
.legendReady {
 width: 1rem;
 height: 1.5rem;
 line-height:1.2rem;
 margin-left: 1rem;
 margin-right: 1rem;
}
.legendSent {
 background: #99aacc;
}
.legendReady {
 background: #aaccbb;
}
.itemsFailedShow,
.jammedStringShow,
#progressBar {
 width: 100%;
 height: 1.5rem;
 border-bottom-style: solid;
 border-bottom-width: 0.1rem;
 border-bottom-color: #666666;
 border-top-style: solid;
 border-top-width: 0.1rem;
 border-top-color: #666666;
 line-height: 1rem;
 text-align: center;
}
#progressSent {
 width: 50%;
 background: #99aacc;
}
#progressReady {
 width: 50%;
 background: #aaccbb;
} 
.itemsFailedHide {
 visibility: hidden;
 position: absolute;
 bottom: 100rem;
}
.itemsFailedShow {
 background: #cc6666;
 vertical-align: middle;
 color: #333333;
 border-top: 0;
}
.jammedStringHide {
 visibility: hidden;
 position: absolute;
 bottom: 100rem;
}
.jammedStringShow {
 background: #ffff99;
 vertical-align: middle;
 color: #cc0033;
 border-top: 0;
}
#itemUpdater p {
 margin: 0.5rem;
 padding: 0;
}
.WatermarkButton {
 width: 7rem;
 font-weight: normal;
}
.SortImage {
 margin-right: 0.5rem;
 height: 1.4rem;
 vertical-align: top;
}
.FilterSetImage,
.FilterSetErrorImage,
.FilterClearImage {
 height: 1.4rem;
 width: 1.4rem;
 background-color: #ffffff;
}