@import url('https://fonts.googleapis.com/css?family=Lato:300,400,700&display=swap');

html,body,h1,h2,h3,h4,h5,h6,p,span,i,b,div,input,button{font-family: 'Lato', sans-serif;}
body{background-color:rgba(231,229,223,.25);}

.redish{border:dashed 1px red}
.blueish{border:dashed 1px blue}
.nopadding{padding:0}
.mg-b-1{margin-bottom:1rem}
.btn-primary.btn-hf,.hf-table div.dataTables_wrapper .dt-buttons button{background:#006DB7;color:#fff;text-transform:uppercase;font-weight:400;font-size:1rem;border:solid 1px #006DB7;padding:0 1rem;line-height:2.2rem;border-radius:3px;transition:all .3s}
.btn-primary.btn-hf:hover,.btn-primary.btn-hf:focus,.btn-primary.btn-hf:not(:disabled):not(.disabled):active,.hf-table div.dataTables_wrapper .dt-buttons button:hover{transform:none;box-shadow:none;background:#FA941F;border-color:#FA941F}
.btn-primary.btn-outline-hf{background:#fff;color:#AFAFAF;text-transform:uppercase;font-weight:400;font-size:1rem;border:solid 1px #D3D0CB;padding:0 1rem;line-height:2.2rem;border-radius:3px;transition:all .3s;box-shadow:none}
.btn-primary.btn-outline-hf:hover,.btn-primary.btn-outline-hf:focus,.btn-primary.btn-outline-hf:not(:disabled):not(.disabled):active{transform:none;box-shadow:none;background:#FA941F;border-color:#FA941F;color:#fff}
.btn-link.btn-hf-link{color:#393E41;text-decoration:underline;font-size:1rem;}
.alert-block{margin:1rem 0;border-radius:.25rem;padding:.75rem 1.25rem;position:relative;background-color:#c6c8ca;border-color:#d6d8d9;color:#1b1e21;border:solid 1px}
.alert-block.danger{background-color:#f8d7da;border-color:#f5c6cb;color:#721c24}
.alert-block.success{background-color:#d4edda;border-color:#c3e6cb;color:#155724}
.alert-block.warning{color:#856404;background-color:#fff3cd;border-color:#ffeeba;}
.alert-block.info{color:#0c5460;background-color:#d1ecf1;border-color:#bee5eb;}
.hf-hidden{display:none!important}

/* login */
.bg-default-login .hero{background:url('../img/brand/blue_bg.png') no-repeat;background-size:cover;background-position:center;height:100vh;}
.bg-default-login.inst-sch .hero{background:url('../img/brand/orange_bg.png') no-repeat;background-size:cover;background-position:center;}
.bg-default-login .hero{position:relative;overflow:hidden;}
.bg-default-login .hero .logo-wrap{display:block;width:200px;height:80px;background:#fff url('../img/brand/logo.png') no-repeat;background-size:cover;background-position:center;background-size:85%;border-bottom-left-radius:40px;border-top-left-radius:40px;position:absolute;right:-2px;top:30%}
.bg-default-login .hero .logo-wrap::after{content:'';display:block;width:30px;height:135px;position:absolute;top:-25px;right:0;background:url(../img/brand/curve.png) no-repeat;background-size:contain;background-position:center right;}
.bg-default-login .hero .desc{text-align:center;position:absolute;bottom:50px;width:100%;left:0;}
.bg-default-login .hero .desc h2{color:#fff;background:#393E41;}
.bg-default-login .hero .desc p{color:#393E41;background:#fff;}
.bg-default-login .hero .desc h2,.bg-default-login .hero .desc p{display:inline-block;padding:5px 10px;font-weight:400;font-size:1rem;line-height:1.2;margin-bottom:15px;}
.bg-default-login .hero .desc span{color:#fff;display:block;margin-top:80px;font-size:1rem}
.bg-default-login .login-form{padding:28vh 100px 0}
.bg-default-login .login-form h2{font-weight:400;color:#006DB7;text-transform:uppercase;font-size:1.2rem;margin-bottom:2rem}
.bg-default-login .login-form p{margin-top:-1.5rem;margin-bottom:1.5rem;font-weight:700}
.bg-default-login .login-form span.lbl{color:#393E41;text-transform:capitalize;font-size:1rem;display:block;margin-bottom:.5rem}
.input-group-alternative .form-control, .input-group-alternative .input-group-text{border:solid 1px #D3D0CB;border-radius:3px;}
.input-group-alternative{box-shadow:none}
.full-btn button{width:100%}
.full-btn.w60 button{width:60%}
.bg-default-login .login-form .btn-hf{margin:2rem 0}
.custom-control-label span{color:#393E41;top:0}
.custom-control-input ~ .custom-control-label::before{font-family:'hfont';content:"\e92d";font-size:1rem;top:2px;padding:0 0 2px 2px;color:rgba(255,255,255,0);line-height:1.2;}
.custom-control-input:checked ~ .custom-control-label::before{color:#fff;line-height:1.2;background-color:#FA941F;border-color:#FA941F}
.custom-control-input,.custom-control-label{cursor:pointer}
.custom-control-label{padding-left:30px}
.custom-control-label::before{left:0}

/* header */
.main-content .navbar-top#navbar-main{background:#fff;position:relative;border-bottom:solid 1px #E7E5DF;color:#393E41;}
.navbar-dark .navbar-nav .nav-link{color:#393E41}
.navbar-top ul li{margin-left:1rem}
.navbar-top ul li a{display:block}
.navbar-top ul li.nav-item.title{margin:0 2rem 0 0}
.navbar-top ul li.nav-item.title span{line-height:2rem}
.navbar-top ul li.nav-item.title span[class*="hf-"]{font-size:2rem;float:left;margin-right:.5rem}
.navbar-top ul li.nav-item.dropdown{margin-left:0}
.dropdown-menu .dropdown-item{font-size:1rem;color:#393E41}
.navbar.navbar-top .logo-wrap{width:100px;height:2rem;position:relative;}
.navbar.navbar-top .logo{width:120px;height:50px;background:#fff url(../img/brand/logo.png) no-repeat;background-size:cover;background-position:center;display:block;position:absolute;top:-11px;left:0;}
.navbar-brand-wrap{color:#fff;height:54px;border-bottom:solid 1px rgba(255,255,255,.4);display:grid;justify-content:center;align-content:center;font-size:1rem;text-transform:uppercase}
.navbar-brand-wrap:hover,.navbar-brand-wrap:active,.navbar-brand-wrap:focus{color:#fff}
.navbar#sidenav-main{z-index:1000;background:url('../img/brand/blue_bg.png') no-repeat;background-size:cover;background-position:center;height:100vh;color:#fff}
.navbar#sidenav-main.inst-sch{background:url('../img/brand/orange_bg.png') no-repeat;background-size:cover;background-position:center;}
.navbar#sidenav-main.inst-sch::before{content:'';display:block;position:absolute;height:100%;width:100%;background:rgba(0,0,0,.08);top:0;left:0;z-index:1;}
.navbar#sidenav-main .container-fluid{z-index:500;position:relative;}
.navbar#sidenav-main .footer{z-index:200;}

/* sidenav */
.navbar-light .navbar-nav .nav-link,.navbar-light .navbar-nav .active > .nav-link{color:#fff;}
.navbar-vertical .navbar-nav .nav-link[data-toggle='collapse']:after{color:#fff}
#sidenav-main ul.navbar-nav li.nav-item{background:rgba(255,255,255,0);border-radius:4px;margin:0 1.5rem .2rem;overflow:hidden;}
#sidenav-main ul.navbar-nav li.nav-item:hover,#sidenav-main ul.navbar-nav li.nav-item.active{background:rgba(255,255,255,.25)}
#sidenav-main ul.navbar-nav li.nav-item a[aria-expanded="true"],#sidenav-main ul.navbar-nav li.nav-item div.collapse.show,#sidenav-main ul.navbar-nav li.nav-item:hover div.collapsing{background:rgba(255,255,255,.25)}
#sidenav-main ul.navbar-nav li.nav-item:hover a[aria-expanded="true"],#sidenav-main ul.navbar-nav li.nav-item:hover div.collapse.show,#sidenav-main ul.navbar-nav li.nav-item:hover div.collapsing{background:rgba(255,255,255,0)}
.navbar-light .navbar-nav .nav-link:hover, .navbar-light .navbar-nav .nav-link:focus{color:#fff}
#sidenav-main ul.navbar-nav li.nav-item li.nav-item{background:none;margin:0}
.navbar-vertical.navbar-expand-md .navbar-nav .nav-link{padding:.6rem}
.navbar-vertical.navbar-expand-md .navbar-nav .nav .nav-link{padding:0.5rem 0 0.5rem 3rem}
.navbar-vertical.navbar-expand-md .navbar-nav .nav .nav-link::before{content:'';display:inline-block;background:rgba(255,255,255,.25);height:10px;width:10px;border-radius:3px;margin-right:.5rem;}
.navbar-vertical.navbar-expand-md .navbar-nav .nav .nav-link:hover::before{background:#fff}
.navbar-vertical.navbar-expand-md .navbar-nav .nav .nav-link:hover{text-decoration:underline}
#sidenav-main ul.navbar-nav li.nav-item div.collapse.show{padding-bottom:.5rem}
#sidenav-main ul.navbar-nav li.nav-item span[class*="hf-"]{font-size:1.8rem;margin-right:.5rem;}
.dropdown-item.active, .dropdown-item:active{background-color:#FA941F;color:#fff}
.footer.mobile{display:none}
.footer{padding:.5rem;position:absolute;left:0;bottom:0;width:100%;background:none;color:#fff}
.footer a{color:#fff}
.footer .copyright::before{content:'';display:block;width:100%;height:1px;background:rgba(255,255,255,.4);position:absolute;top:-15px;left:0}
.page-wrap{padding-top:1rem;padding-bottom:1rem}
.card{border-radius:4px;padding:1.25rem 1.5rem;margin-bottom:1.5rem}
.card.shadow{box-shadow:0 3px 6px rgba(0,0,0,.16)!important}
.page-wrap h2{color:#393E41;margin-top:1rem}
.page-wrap .card h3{color:#0088B3;font-weight:400}
.page-wrap .form-control{line-height:2.4rem;height:unset;padding:0 1rem;border:solid 1px #D3D0CB;border-radius:3px;box-shadow:none;color:#393E41}
.page-wrap select.form-control{padding:.6rem 1rem}

/* tables */
.hf-table .dataTables_length,.hf-table .dataTables_filter{display:block;position:relative;}
.hf-table .dataTables_length{width:30%;float:right;}
.hf-table .dataTables_filter{width:70%;float:left;}
.hf-table div.dataTables_wrapper div.dataTables_length label,.hf-table div.dataTables_wrapper div.dataTables_filter label{display:block;padding-left:1rem;font-size:0;}
.hf-table div.dataTables_wrapper .dt-buttons::before,.hf-table div.dataTables_wrapper div.dataTables_length::before,.hf-table div.dataTables_wrapper div.dataTables_filter label::before{content:'No of entries to show';padding-left:1rem;font-weight:600;color:#525f7f;font-size:.875rem;display:block;margin-bottom:.5rem}
.hf-table div.dataTables_wrapper div.dataTables_filter label{padding-left:0}
.hf-table div.dataTables_wrapper div.dataTables_filter label::before{content:'Search';padding-left:0;}
.hf-table div.dataTables_wrapper div.dataTables_length select,div.dataTables_wrapper div.dataTables_filter input{line-height:2.4rem;height:2.4rem;padding:0 1rem;border:solid 1px #D3D0CB;border-radius:3px;color:#393E41;font-size:.875rem;display:block;width:100%;margin:0}
.hf-table div.dataTables_wrapper .dt-buttons{display:block;width:100%;margin-bottom:1rem;text-align:right}
.hf-table div.dataTables_wrapper .dt-buttons::before{content:'Download transactions report';padding:0}
.hf-table.stmt div.dataTables_wrapper .dt-buttons::before{content:'Download statements';}
.hf-table table.dataTable thead th, .hf-table table.dataTable thead td{border:none;padding:.8rem 1rem;color:#393E41;font-weight:700;background:#E7E5DF;font-size:.9rem}
.hf-table table.dataTable thead .sorting:after, .hf-table table.dataTable thead .sorting_asc:after, .hf-table table.dataTable thead .sorting_desc:after, .hf-table table.dataTable thead .sorting_asc_disabled:after, .hf-table table.dataTable thead .sorting_desc_disabled:after{font-family:'hfont'!important;content:"\e92e";bottom:.5rem;right:.5rem}
.hf-table table.dataTable thead .sorting:before, .hf-table table.dataTable thead .sorting_asc:before, .hf-table table.dataTable thead .sorting_desc:before, .hf-table table.dataTable thead .sorting_asc_disabled:before, .hf-table table.dataTable thead .sorting_desc_disabled:before{font-family:'hfont'!important;content:"\e931";top:.5rem;right:.5rem}
.hf-table table.dataTable{padding-top:1rem;padding-bottom:1rem;border:none}
.ht-table table.dataTable.stripe tbody tr.odd, .ht-table table.dataTable.display tbody tr.odd,.hf-table table.dataTable.display tbody tr.odd>.sorting_1, .hf-table table.dataTable.order-column.stripe tbody tr.odd>.sorting_1,.hf-table table.dataTable.stripe tbody tr.odd, .hf-table table.dataTable.display tbody tr.odd{background-color:#fff}
.hf-table table.dataTable tbody tr,.hf-table table.dataTable.display tbody tr.even>.sorting_1, .hf-table table.dataTable.order-column.stripe tbody tr.even>.sorting_1{background-color:#E7E5DF}
.hf-table table.dataTable.hover tbody tr:hover, .hf-table table.dataTable.display tbody tr:hover{background-color:#E7E5DF}
.hf-table table.dataTable.hover tbody tr.odd:hover, .hf-table table.dataTable.display tbody tr.odd:hover{background-color:#fff}
.hf-table table.dataTable tbody tr:hover{opacity:.7}
.hf-table table.dataTable tbody th, table.dataTable tbody td{padding:.8rem 1rem}
.hf-table table.dataTable.row-border tbody th, .hf-table table.dataTable.row-border tbody td, .hf-table table.dataTable.display tbody th, .hf-table table.dataTable.display tbody td,.hf-table div.dataTables_wrapper div.dataTables_info{border:none;font-size:.9rem;color:#393E41}
.hf-table .dataTables_wrapper .dataTables_paginate .paginate_button{color:#AFAFAF!important;text-transform:uppercase;font-weight:400;font-size:.9rem;border:solid 1px rgba(0,0,0,0);padding:0 1rem;line-height:2.2rem;border-radius:3px;}
.hf-table .dataTables_wrapper .dataTables_paginate .paginate_button.current, .hf-table .dataTables_wrapper .dataTables_paginate .paginate_button.current:hover{background:#fff;color:#AFAFAF!important;border:solid 1px #D3D0CB;}
.hf-table .dataTables_wrapper .dataTables_paginate .paginate_button.disabled, .hf-table .dataTables_wrapper .dataTables_paginate .paginate_button.disabled:hover, .hf-table .dataTables_wrapper .dataTables_paginate .paginate_button.disabled:active{color:#AFAFAF!important}
.hf-table .dataTables_wrapper .dataTables_paginate .paginate_button:hover{background:none;border:solid 1px #D3D0CB;}
.hf-table div.dataTables_wrapper div.dataTables_paginate{overflow:auto}
.hf-table.has-actions table thead tr th:last-child::after,.hf-table.has-actions table thead tr th:last-child::before{display:none}
.hf-table.has-actions table thead tr th:last-child,.hf-table.has-actions table tr td:last-child{text-align:right;padding-right:1rem}
.hf-table.hf-table.has-actions td a.btn-primary.btn-outline-hf{padding:.2rem .5rem;color:#AFAFAF;}
.hf-table.hf-table.has-actions td a.btn-primary.btn-outline-hf:hover{color:#fff;cursor:pointer;}
.hf-table.hf-table.has-card table.dataTable tbody td:hover{cursor:pointer;}
.hf-table table.dataTable.display tbody tr.stmt_C td:first-child{color:#11b719}
.hf-table table.dataTable.display tbody tr.stmt_D td:first-child{color:#ef728b;}
/* .hf-table table.dataTable.display tbody tr.stmt_D td:first-child::before{content:'-'} */
.hf-table table.dataTable.display tbody td.hidden,.hf-table table.dataTable thead th.hidden{display:none}
.card.with-tab-wrap .desc{position:relative;padding-left:2.8rem;padding-top:.4rem}
.card.with-tab-wrap .desc::before{content:"\ea21";font-family:'hfont'!important;position:absolute;left:0;top:0;font-size:2rem}
.card.with-tab-wrap .desc span{display:block;line-height:1.2;font-size:.9rem}
.card.with-tab-wrap .desc span b{font-weight:700;min-width:120px;display:inline-block}
.with-tab-wrap{position:relative;padding-bottom:4rem;border-bottom:solid 4px #006DB7;border-bottom-left-radius:0;border-bottom-right-radius:0}
.tab-wrap{position:absolute;left:0;bottom:0;padding:0 1.25rem;width:100%}
.tab-wrap a{display:inline-block;line-height:2.5rem;min-width:25%;padding:0 1rem;background-image:linear-gradient(#fff, rgba(211,208,203,.3));font-weight:700;font-size:.9rem;text-align:center;color:#393E41}
.tab-wrap a:hover{background:#FA941F;color:#fff}
.tab-wrap a.active{background:#006DB7;color:#fff}
.tab-wrap a.active:hover{color:#fff;cursor: pointer;}

/* forms */
.form-msg{margin-top:-1rem;display:block;font-size:.8rem;font-weight:400;}
.form-group.options .block{display:block;width:100%}
.form-group.options input,.form-group.options label{cursor:pointer;}
.stack-form-group .form-group{margin-bottom:0}
.stack-form-group .form-check-input{margin-left:0}
.stack-form-group .form-check-label{padding-left:1.2rem}

/* institutions */
.grid-cols div[class^="col-"]{display:grid;margin-bottom:.5rem;word-break:break-word}
.grid-cols div[class^="col-"] b{font-size:.8rem}
.grid-cols [class^="hf-"]{font-size:1.4rem}
.grid-cols .hf-close{color:#FF3B4F}
.grid-cols .hf-check{color:#00D238}
.inline-block-btns [class^="btn-"]{display:inline-block;margin-left:.5rem;cursor:pointer;color:#AFAFAF!important}
.inline-block-btns [class^="btn-"]:hover{color:#fff!important}
.payment-types{border:solid 1px #D3D0CB;border-radius:3px;margin-bottom:1rem;padding:1rem}
.payment-types h3{font-size:1rem;margin-top:.5rem}
.payment-types .hf-table table.dataTable{margin-top:0;padding-top:0}
.hf-table table.dataTable.display tbody td.grid-cols{text-align:center;font-size:0}
.hf-table table.dataTable.display tbody td.grid-cols [class^="hf-"]{font-size:1.4rem}

/* payment-type */
.payment-type{border:solid 1px #D3D0CB;border-radius:3px;margin-top:1rem;margin-bottom:1rem;padding:1rem}
.payment-type-fields{margin-bottom:1rem}
.payment-type-fields::after{content:'';display:block;bottom:0;left:0;width:100%;height:1px;background:#D3D0CB;}
.payment-type-fields-wrap .payment-type-fields:last-child::after{display:none}
.payment-type-fields-wrap{padding-top:1rem}
.remove-elem{display:block;position:absolute;right:0;top:0;z-index:100;font-size:1rem;line-height:1rem;color:#c7c7c7;}
.remove-elem.fld{right:1rem}
.remove-elem:hover{cursor:pointer;color:#FF3B4F}
.remove-elem::after{font-family:'hfont';content:"\ea11";}
.mod-changed{color:#856404;background-color:#fff3cd;border-color:#ffeeba;border-radius:4px;position:relative;margin-top:.5rem;}
.mod-changed::before{content:'Changed to:';display:block;background:#fff3cd;position:absolute;top:-.5rem;left:0;font-size:.6rem;border-top-left-radius:4px;border-top-right-radius:4px;}

.hf-table table.dataTable.display tbody tr.odd.success td,.hf-table table.dataTable.display tbody tr.even.success td{background:#d4edda;color:#155724;border-top:solid 1px #fff;border-bottom:solid 1px #fff}
.hf-table table.dataTable.display tbody tr.odd.danger td,.hf-table table.dataTable.display tbody tr.even.danger td{background:#f8d7da;color:#721c24;border-top:solid 1px #fff;border-bottom:solid 1px #fff}

@media (min-width: 576px) { }
/* // Medium devices (tablets, 768px and up) */
@media (min-width: 768px) { 
    .align-btn{padding-top:2rem}
 }
/* // Large devices (desktops, 992px and up) */
@media (min-width: 992px) { }
/* // Extra large devices (large desktops, 1200px and up) */
@media (min-width: 1200px) { }

/* // Extra small devices (portrait phones, less than 576px) */
@media (max-width: 575.98px) { }

/* // Small devices (landscape phones, 576px and up) */
@media (max-width: 767.98px) {
.nopadding-xs{padding:0}
.bg-default-login .hero .logo-wrap{top:15px;transform-origin:right;transform:scale(.8)}
.bg-default-login .hero{height:40vh}
.bg-default-login .hero .desc{bottom:1rem;transform:scale(.95)}
.bg-default-login .hero .desc span{margin-top:0;}
.bg-default-login .login-form{padding:15px 30px}
.bg-default-login .login-form h2{margin-bottom:1rem}
.full-btn.w60.col-12{padding:0}
.full-btn.w60 button{width:100%}
.bg-default-login .login-form p{margin-top:-.8rem;line-height:1.2}
.navbar#sidenav-main{height:unset;padding:0}
.navbar-light .navbar-toggler .navbar-toggler-icon{background:none;cursor:pointer;display:grid;align-content:center}
.navbar-light .navbar-toggler .navbar-toggler-icon::after{color:#fff;content:"\e998";font-family:'hfont';font-size:1.5rem}
.navbar-brand-wrap{border-bottom:none}
.nav-link{color:#fff;font-size:1.5rem;}
.navbar.navbar-top.navbar-expand-md.navbar-dark{display:none}
.collapse-brand .logo-wrap .logo{display:block;height:40px;width:100%;background:#fff url('../img/brand/logo.png') no-repeat;background-size:contain;background-position:center;}
.footer{display:none}
.footer.mobile{display:block}
.footer a,.footer .text-center{color:#172b4d}
.navbar-collapse.collapsing, .navbar-collapse.show{padding-bottom:2.5rem}
#sidenav-main ul.navbar-nav li.nav-item:hover, #sidenav-main ul.navbar-nav li.nav-item.active{background:rgba(23,43,77,0.1)}
.hf-table{overflow-x:scroll}

}

/* // Medium devices (tablets, 768px and up) */
@media (min-width: 768px) and (max-width: 991.98px) { }

/* // Large devices (desktops, 992px and up) */
@media (min-width: 992px) and (max-width: 1199.98px) { }

/* // Extra large devices (large desktops, 1200px and up) */
@media (min-width: 1200px) { }