@import url('open.iconic/font/css/open-iconic-bootstrap.min.css');

html, body {
    font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;
}

html, body {
    height: 100%;
    overflow: hidden;
}
.inputFile {
    background-color:#e9ecef;
}
.scroll{
    overflow-y: auto;
}
.hidden {
    color: white;
}
.condiciones {
    width: 800px;
    height: 350px;
    padding: 2px;
    display: block;
    border-style: inset;
    overflow: auto;
    text-align: justify;
}
.botonesWizard{
    width: 800px;
}
.center-content{
    justify-content:center;
    display:flex;    
}
.footer {
    position: fixed;
    bottom:0;
    width:100%;
    padding:10px;
    background-color:black;
    color:white;
    text-align:center;
    z-index: 20;
}
.center-block{
    width:100%;
    justify-content:center;
    display:flex;
}
.drop-file-icon {
    background-size: contain;
    mask-repeat: no-repeat;
    -webkit-mask-repeat: no-repeat;
    background-position: center center;
    background-color: currentColor;
    width: 48px;
    height: 48px;
    -webkit-mask-image: url("../images/drop-file.svg");
    mask-image: url("../images/drop-file.svg");
}
.custom-drop-zone{
    padding: 0 !important;
    border-style: dashed !important;
    border-width: 2px !important;
    height: 230px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}
.mb-3 {
    margin-bottom:1rem !important
}
.header {
    background-color: #F05224;
}
.detallecuentacap{
    font-size:medium;
    padding:10px;
    text-align:left;
}
.iconocuenta{
    background-image: url("../images/cuentas.png");
    width:50px;
    height:50px;
}
.iconotransferencias{
    background-image: url("../images/transferencias.png");
    width:50px;
    height:50px;

}
.iconopagos{
    background-image: url("../images/pagos.png");
    width:50px;
    height:50px;

}
.iconogestiones{
    background-image: url("../images/gestiones.png");
    width:50px;
    height:50px;

}
.iconoconfiguracion{
    background-image: url("../images/configuracion.png");
    width:50px;
    height:50px;

}
.iconosalir{
    background-image: url("../images/salir.png");
    width:50px;
    height:50px;

}
.icononoticias{
    background-image: url("../images/noticias.png");
    width:50px;
    height:50px;

}
.iconohistoria{
    background-image: url("../images/iconohistoria.png");
    width:50px;
    height:50px;

}
.iconoestadocta{
    background-image: url("../images/iconoestadocta.png");
    width:50px;
    height:50px;

}
.saldo{        
    float: right;
    color: white;
    background-color: #013161;
    width: 200px;
    height: 50px;
    clear: right;
}
.detallecuentaval{
    font-size:medium;
    padding:10px;
    text-align:right;
}
.botondetalle{
    width:190px;
}
.centerall{
  width:100%;
  display: flex;
  justify-content: center;
}
.centerallscroll{
  width:100%;
  display: flex;
  min-height: 500px;
  height: 98%;
  justify-content: center;
  overflow-y: auto;
}
.b-100{
    color: white;
    width: 200px;
}
.tituloCuenta{
    float:left;
    clear:left;
    padding:15px;
    color:#013161;
    font-weight:bold;
    font-size: 14pt;
}
.grad{
    background-image: linear-gradient(to bottom, #013161, #0E56A8);
}
.header1{
    background-color: #013161;
    background-image: linear-gradient(to bottom, #013161, #0E56A8);
    width: 100%;
    height:80px;
    padding: 0px;
    color: white;
}
.header2{
    background-color:#013161;
    background-image: linear-gradient(to bottom, #013161, #0E56A8);
    width:100%;
    text-align:end;
    vertical-align:middle;
    height:80px;
    padding:10px;
    color:white;
    
}
.header3{
    background-color:#013161;
    background-image: linear-gradient(to bottom, #013161, #0E56A8);
    width:100%;
    text-align:end;
    vertical-align:middle;
    height:60px;
    padding:10px;
    color:white;
    
}
.valid.modified:not([type=checkbox]) {
    outline: 1px solid #26b050;
}

.invalid {
    outline: 1px solid red;
}

.validation-message {
    color: red;
}

#blazor-error-ui {
    background: lightyellow;
    bottom: 0;
    box-shadow: 0 -1px 2px rgba(0, 0, 0, 0.2);
    display: none;
    left: 0;
    padding: 0.6rem 1.25rem 0.7rem 1.25rem;
    position: fixed;
    width: 100%;
    z-index: 1000;
}

#blazor-error-ui .dismiss {
    cursor: pointer;
    position: absolute;
    right: 0.75rem;
    top: 0.5rem;
}
.w-90 {
    width: 100px;
}