﻿body {
    font-family: 'NunitoSans Regular', sans-serif !important;
    background-color: #FFFFFF !important;
}

body.modal-open {
    overflow: hidden;
    height: 100vh;
}

input::-ms-reveal,
input::-ms-clear {
    display: none;
}

.swal2-styled.swal2-confirm {
    background-color: #58DEB9;
}

.underline {
    text-decoration: underline;
}

.account-info-outline {
    content: url(../icon/hotel-building-outline.svg);
}

.manage-card-button {
    content: url(../icon/credit-cards-outline.svg);
    color: #FFF;
    width: 56px;
    height: 45px;
}

.reports-button {
    content: url(../icon/laptop-analysis-outline.svg);
    color: #FFF;
    width: 56px;
    height: 56px
}

h1 {
    font-family: "NunitoSans ExtraBold";
    font-size: 32px;
    padding-bottom: 10px;
    color: #333F48;
}

h2 {
    font-family: "NunitoSans ExtraBold";
    font-size: 16px;
    color: #58DEB9;
}

a {
    color: #58deb9;
}


.settings-button {
    content: url(../icon/profile-settings-outline.svg);
    color: #FFF;
    width: 56px;
    height: 56px
}

.help-centre-button {
    content: url(../icon/information-outline.svg);
    color: #FFF;
    width: 56px;
    height: 56px
}

.table-borderless td, .table-borderless th{
    border: none !important;
}

.font-size-11 {
    font-size: 11px;
    width: 100%;
}

.font-size-12 {
    font-size: 16px !important;
    text-decoration-color: black !important;
}

.btn-save-color{
    background: linear-gradient(90deg, rgba(93,137,212,1) 0%, rgba(88,222,185,1) 100%) !important;
}

.btn-cancel-color {
    background: linear-gradient(75deg, rgba(255,219,64,1) 0%, rgba(255,134,88,1) 100%) !important;
}

.btn-handle {
    border: none;
    border-radius: 2px;
    width: 80px;
    height: 40px;
    margin: 5px;
    font-size: 16px !important;
    color: white;
    float: right;
}

.bootstrap-datetimepicker-widget table td span.active {
    color: black !important;
}

.table-width-100-percentage {
    width: 100% !important;
}

.top_nav_btn {
    font-size: 15px !important;
    width: 110px;
    text-align: center;
}

.container-nav {
    height: 68px !important;
    font-size: 1em;
    font-weight: 400;
    line-height: 1.5;
    text-align: left;
}

.text-overflow td {
    max-width: 150px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.disabled {
    position: relative;
    background-color: #eeeeee;
}

.width-110px {
    width: 110px !important;
}
.width-190px {
    width: 190px !important;
}

.width-80px {
    width: 80px !important;
}

.text-uppercase {
    text-transform: uppercase !important;
}

.padding-left-10px {
    padding-left: 10px !important;
}

.padding-right-10px {
    padding-right: 10px !important;
}

.align-row-add-form {
    margin-left: 10px;
    margin-right: 10px;
    margin-top: 10px !important;
}

.no-scroll-dialog {
    overflow-y: auto !important;
}

button[disabled], html input[disabled], select[disabled] {
    cursor: default;
    background-color: #eeeeee !important;
}

.edit-button {
    font-size: 20px !important;
    color: #15b789;
}

::placeholder {
    color: black;
    opacity: 0.2;
}

:-ms-input-placeholder { /* Internet Explorer 10-11 */
    color: black;
    opacity: 0.2;
}

::-ms-input-placeholder { /* Microsoft Edge */
    color: black;
    opacity: 0.2;
}

.btn_logout {
    font-family: 'Montserrat', sans-serif !important;
    font-size: 0.7em !important;
    color: #CCC;
    font-weight: 500;
    padding-left: 15px;
    padding-right: 15px;
    vertical-align: middle;
    text-align: center;
    cursor: pointer;
    background-color: #304434;
    height: 32px;
    letter-spacing: normal !important;
    border-right: 1px solid #243327;
    border: none !important;
}

.btn_logout:hover {
    background-color: #2c5634;
    color: #FFF;
}

.top_sml_btns_blue {
    background-color: #565555;
}

.top_sml_btns_blue:hover {
    background-color: #048ABB;
    cursor: pointer;
}

.top_sms_indicator {
    background-color: #304434;
    padding-top: 7px;
    height: 32px;
    padding-left: 15px;
    padding-right: 15px;
    border-right: 1px solid #243327;
}
/* Firefox old*/
@-moz-keyframes blink {
    0% {
        opacity: 1;
    }

    50% {
        opacity: 0;
    }

    100% {
        opacity: 1;
    }
}

@-webkit-keyframes blink {
    0% {
        opacity: 1;
    }

    50% {
        opacity: 0;
    }

    100% {
        opacity: 1;
    }
}
/* IE */
@-ms-keyframes blink {
    0% {
        opacity: 1;
    }

    50% {
        opacity: 0;
    }

    100% {
        opacity: 1;
    }
}
/* Opera and prob css3 final iteration */
@keyframes blink {
    0% {
        opacity: 1;
    }

    50% {
        opacity: 0;
    }

    100% {
        opacity: 1;
    }
}

.blink-image {
    -moz-animation: blink normal 1s infinite ease-in-out; /* Firefox */
    -webkit-animation: blink normal 1s infinite ease-in-out; /* Webkit */
    -ms-animation: blink normal 1s infinite ease-in-out; /* IE */
    animation: blink normal 1s infinite ease-in-out; /* Opera and prob css3 final iteration */
}

.user-name {
    text-align: right;
    color: wheat;
    padding-bottom: 6px;
    padding-right: 10px;
}

.display-inline-block {
    display: inline-block;
}

.logout-width {
    max-width: 33px;
}

.header-bar {
    font-family: "Helvetica Neue",Helvetica,Arial,sans-serif;
    font-size: 14px;
}

table thead tr td {
    padding-left: 18px !important;
    background-position-x: left !important;
    background-position-y: bottom !important;
}

table thead tr td.sorting_disabled {
    padding-left: 9px !important;
}

.display-none {
    display: none;
}

.btn_close {
    font-family: 'Montserrat', sans-serif !important;
    font-size: 0.7em !important;
    color: #CCC;
    font-weight: 500;
    padding-left: 15px;
    padding-right: 15px;
    vertical-align: middle;
    text-align: center;
    cursor: pointer;
    background-color: #304434;
    height: 32px;
    letter-spacing: normal !important;
}

.btn_close:hover {
    background-color: #2c5634;
    color: #FFF;
}

.cursor-pointer {
    cursor: pointer;
}

.background-color-white {
    background-color: white !important;
}

.padding-left-200px {
    padding-left: 200px;
}

.padding-left-260px {
    padding-left: 260px;
}

.margin-bottom-0px{
    margin-bottom: 0px !important;
}

.margin-top-0px{
    margin-top: 0px !important;
}

.padding-top-15px{
    padding-top: 15px !important;
}

.height-224 {
    height: 224px !important;
}

.icon-common-24px {
    width: 24px;
    height: 24px;
    cursor: pointer;
}

.w-90 {
    width: 90% !important;
}

.m-auto {
    margin: auto
}

.w-100 {
    width: 100% !important;
}

.filter-120 {
    filter: saturate(0%) brightness(120%);
}

.filter-170 {
    filter: saturate(0%) brightness(170%);
}

.filter-opacity-04 {
    filter: opacity(0.4);
}

.width-50-percentage{
    width: 50% !important;
}

.btn-close {
    border: none !important;
    border-radius: 4px !important;
    width: 80px;
    height: 40px;
    font-size: 16px !important;
    color: white !important;
    background: linear-gradient(75deg, rgb(255, 102, 102) 0%, rgb(255, 179, 128) 100%, aliceblue) !important;
}

.text-align-right {
    text-align: right;
}

.color-black {
    color: black !important;
}

.margin-right-41-percent {
    margin-right: 41% !important;
}

.transaction-body {
    background-color: #FFFFFF;
    color: black;
    padding: 15px;
    padding-top: 0px !important;
    margin: 15px;
}

.transaction-body .trans-details-header {
    width: 50%;
    margin-left: 10px;
}

.transaction-body .trans-details-header span {
    font-size: 10px;
    font-family: "NunitoSans Bold";
    color: #8A9399;
}

.trans-details-header .col-1 {
    margin-right: 10px;
}

.title-main-section {
    text-align: center;
    text-transform: uppercase;
    background-color: #e3e8e5;
    color: black !important;
    text-align: center;
}

.title-main-section label {
    position: relative;
    left: 2px;
    top: 3px;
}

.ui-dialog .ui-dialog-buttonpane {
    text-align: center;
}

.ui-dialog .ui-dialog-buttonpane .ui-dialog-buttonset {
    float: none !important;
}

.no-margin-padding {
    margin: 0 !important;
    padding: 0 !important;
}

.margin-top-10px-negative{
    margin-top: -10px !important;
}

label.error {
    color: red !important;
    font-size: 12px !important;
    margin: 2px;
    line-height: 12px;
}

.text-align-center {
    text-align: center;
}

.padding-left-10px {
    padding-left: 10px !important;
}

.left-145px {
    left: -145px;
}

.margin-top-10px {
    margin-top: 10px !important;
}

.account-info-table-td-padding-none {
    padding-bottom: 0px !important;
    padding-top: 0px !important;
}

.padding-top-10px {
    padding-top: 10px !important;
}

.margin-top-40px{
    margin-top: 40px !important;
}

.padding-top-40px{
    padding-top: 40px !important;
}

.padding-10px{
    padding: 10px !important;
}

.padding-40px {
    padding: 40px !important;
}

.width-100-percent{
    width: 100% !important;
}

.margin-top-20px {
    margin-top: 20px !important;
}

.swal2-styled.swal2-confirm, .swal2-cancel.swal2-styled {
    font-size: 15px;
    font-family: "NunitoSans Regular" !important;
}

.swal2-styled:focus {
    box-shadow: none;
}

.swal2-popup {
    width: 450px;
    padding: 3.25em;
}

.swal2-content {
    font-size: 15px;
}

.padding-40px{
    padding: 40px !important;
}

.margin-10px {
    margin: 10px
}

.btn-no-border {
    border: none !important;
}

.btn-vascopay-primary {
    font-family: "NunitoSans Bold";
    border: none;
    cursor: pointer;
    display: inline-block;
    font-size: 14px !important;
    height: 48px;
    background: #58DEB9;
    color: #333F48;
    letter-spacing: 1.4px;
    border-radius: 4px;
    white-space: nowrap;
}

.btn-vascopay-primary:hover {
    background: #58DEB9;
    background: linear-gradient(90deg, rgba(97,242,202,1) 0%, rgba(104,152,233,1) 100%);
    cursor: pointer;
    color: #FFF !important;
}

.btn-vascopay-primary-link {
    font-family: "NunitoSans Bold";
    border: none;
    outline: transparent none 0;
    cursor: pointer;
    display: inline-block;
    text-align: center;
    font-size: 14px !important;
    padding-top: 12px;
    padding-bottom: 12px;
    padding-left: 20px;
    padding-right: 20px;
    height: 48px;
    background: transparent;
    color: #58DEB9;
    letter-spacing: 0.8px;
}

.btn-vascopay-primary-link:focus {
    box-shadow: none;
}

.btn-vascopay-primary-link:hover {
    background: linear-gradient(75deg, rgba(255,219,64,1) 0%, rgba(255,134,88,1) 100%) !important;
    -webkit-background-clip: text !important;
    -webkit-text-fill-color: transparent;
    cursor: pointer;
}

.vascopay-heading-label {
    font-family: "NunitoSans ExtraBold";
    text-align: center;
    font-size: 40px;
    color: #333F48;
    padding-top: 40px !important;
    padding-bottom: 10px !important;
}

.vascopay-label {
    font-family: "NunitoSans Bold";
    font-size: 16px !important;
    padding-bottom: 10px;
    color: #333F48;
}

.top-buffer {
    margin-top: 20px;
}

.account-info-block {
    -ms-flex-pack: end;
    justify-content: flex-end;
    display: -ms-flexbox;
    display: flex;
}

.account-info-th {
    padding-top: 10px;
    padding-right: 10px;
    padding-left: 10px;
}

.account-info-td {
    padding-left: 10px;
    padding-right: 10px;
}

.account-info-table {
    background: #F8F8F8;
    width: 375px;
    text-wrap: none;
}
@media (max-width: 950px){
    .account-info-table {
        width: auto;
    }
}

@media (max-width: 768px) {
    .account-info-block {
        -ms-flex-pack: start;
        justify-content: flex-start;
    }

    .account-info-block .account-info-table {
        width: 100%;
    }
}

.account-info-table td, .account-info-table th{
    padding: 0.5rem;
}

/* Search bar*/
.ui-menu {
    background-color: #ffffff !important;
    border: 1px solid #CBC9C9;
    border-top: 0;
    max-height: 50%;
    overflow-x: hidden;
    overflow-y: auto;
}

.ui-menu .ui-menu-item {
    border-bottom: 1px solid #CBC9C9;
    display: -ms-flexbox !important;
    display: flex !important;
    -ms-flex-align: center !important;
    align-items: center !important;
    color: #333F48;
    min-height: 38px;
}

.ui-menu .ui-menu-item:hover {
    background-color: #007fff;
    color: #FFFFFF;
}

.ui-menu .ui-state-active {
    border: 0;
    border-color: unset;
    background-color: unset;
    color: unset;
}

.info-details {
    margin-bottom: 24px;
}

.form-group {
    margin-bottom: 16px;
}

.form-group > label ,
.form-group > div > label {
    font-family: "NunitoSans Bold";
    font-size: 16px;
    margin-bottom: 4px;
}

.form-group > input ,
.form-group > select ,
.form-group > div > input ,
.form-group > textarea {
    border-radius: 4px;
    width: 100%;
    border: 1px solid #CBC9C9;
}

.form-group > input ,
.form-group > div > input {
    height: 40px;
}

.form-group > input::-webkit-input-placeholder,
.form-group > input::-ms-input-placeholder,
.form-group > input::placeholder,
.form-group > textarea::-webkit-input-placeholder,
.form-group > textarea::-ms-input-placeholder,
.form-group > textarea::placeholder,
.form-group > div > input::placeholder,
.form-group > div > input::-webkit-input-placeholder,
.form-group > div > input::-ms-input-placeholder{

    color: #979797;
    font-size: 16px;
    font-family: "NunitoSans Regular";
}

.w-s-pre-line {
    white-space: pre-line;
}

.input-group > .form-control:not(:last-child),
.input-group > .custom-select:not(:last-child) {
    border-right: 0;
}

.input-group > .form-control:not(:last-child):focus,
.input-group > .custom-select:not(:last-child):focus {
    clip-path: inset(-0.2rem 0.036rem -0.2rem -0.2rem);
    border-right-color: transparent;
}

.append-right-btn {
    border-radius: 0 4px 4px 0;
    border: 1px solid #CBC9C9;
    border-left: 0;
    background-color: transparent;
    padding-right: 16px;
    width: 48px;
}

.input-group-btn > .append-right-btn:not(:last-child) {
    border-right: 0;
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
    width: 40px;
    padding-right: 8px;
}

.hidden-input-file {
    display: none;
}

.input-file button.clear-btn {
    display: none;
}

.input-file input:not(:placeholder-shown) ~ .input-group-append.input-group-btn > button.clear-btn {
    display: inline-block;
}

.calendar-btn {
    background: url("../icon/calendar.svg") no-repeat right 16px center;
}

.clear-btn {
    background: url("../icon/close.svg") no-repeat right 16px center;
}

.add-btn {
    background: url("../icon/expand-icon.svg") no-repeat right 16px center;
}

.content-section-splitter {
    margin-bottom: 40px;
    margin-top: 40px;
    border: 1px solid #CBC9C9;
}

.gray-form{
    background-color: #f8f8f8;
    margin-left: 0px;
    margin-right: 0px;
    padding-top: 30px;
    padding-right: 24px;
    padding-left: 24px;
}

.bootstrap-select {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    border: 1px solid #CBC9C9 !important;
    border-radius: 4px !important;
    height: 40px !important;
}

.bootstrap-select > button {
    height: 100%;
    width: 100%;
}

.bootstrap-select > button {
    background: transparent url("../icon/arrow-down.svg") no-repeat right 8px center;
}

.bootstrap-select > button[aria-expanded="true"] {
    background: transparent url("../icon/arrow-up.svg") no-repeat right 8px center;
}

.bootstrap-select > button[aria-disabled="true"] {
    background: transparent url("../icon/arrow-down-disabled.svg") no-repeat right 8px center;
}

.bootstrap-select > .dropdown-menu {
    width: 100%;
}

.bootstrap-select .dropdown-toggle .filter-option-inner-inner {
    text-overflow: ellipsis;
    max-width: 90%;
}

.bootstrap-select .dropdown-menu li a > span.text {
    width: 93%;
    word-wrap: break-word !important;
    white-space: normal;
}

.bootstrap-select .dropdown-menu.inner {
    max-height: 150px;
}

.dropdown-toggle::after {
    display: none !important;
}

.input-group-append{
    background-color: #FFFFFF;
}

.form-group {
    margin-bottom: 5px;
}

.form-group .form-control {
    margin-bottom: 22px;
}

.form-group .bootstrap-select {
    display: block;
}

.errorMessage {
    margin-top: -20px !important;
    float: left !important;
}

.show-password:before {
    content: url(../icon/show-password.svg);
    height: 16px;
    width: 24px;
}

.hide-password:before {
    content: url(../icon/hide-password.svg);
}

.input-password-field {
    position: relative
}

.input-password-field i{
    position: absolute;
    width: 24px;
    height: 24px;
    right: 16px;
    top: 8px;
}

.input-password-field input {
    padding-right: 56px;
    padding-top: 0;
    padding-bottom: 0;
}

.text-security-password {
    -webkit-text-security: disc;
    text-security: disc;
}

.height-32 {
    height:32px;
}

@media (max-width: 576px) {
    .gray-form{
        padding-right: 10px;
        padding-left: 10px;
    }
}

@media (max-width: 575px) {
    .ver-cent-xs {
        display: -ms-flexbox !important;
        display: flex !important;
        -ms-flex-align: center !important;
        align-items: center !important;
    }

    .modal-body-section, .modal-title {
        padding-left: 1rem !important;
        padding-right: 1rem !important;
    }
}