﻿
.contOpcion .usuarios .divfiltro .filtros {
    display: grid;
    align-items: center;
    margin: 10px;
    grid-gap: 10px;
    grid-template-columns: 60px 1fr 60px 180px 170px;
    grid-template-areas:
        "et1   input1    et2  input2   btn1";
}
.contOpcion .usuarios .divfiltro .filtros .et1 {
    grid-area: et1;
}
.contOpcion .usuarios .divfiltro .filtros .input1 {
    grid-area: input1;
}
.contOpcion .usuarios .divfiltro .filtros .et2 {
    grid-area: et2;
}
.contOpcion .usuarios .divfiltro .filtros .input2 {
    grid-area: input2;
}
.contOpcion .usuarios .divfiltro .filtros .btn1 {
    grid-area: btn1;
}
.contOpcion .usuarios .principal {
    display: grid;
    align-items: center;
    margin-top: -1px;
    grid-gap: 10px;
    grid-template-columns: 1fr;
    grid-template-rows: 1fr;
    grid-template-areas: "tb1";
}
.contOpcion .usuarios .principal .tb1 {
    grid-area: tb1;
}
.contOpcion .usuarios .gvOpciones {
    margin-top: -4px;
    border-radius: 0px 0px 10px 10px;
    overflow: hidden;
    box-shadow: 0px 10px 15px rgba(0, 0, 0, 0.377);
}
.contOpcion .usuarios .gvOpciones2 {
    margin-top: -4px;
    overflow: hidden;
}
.contOpcion .usuarios .acciones {
    display: grid;
    align-items: center;
    margin-top: 20px;
    margin-bottom: 40px;
    grid-gap: 20px;
    grid-row-gap: 10px;
    grid-template-columns: 1fr 1fr 1fr;
    grid-template-areas:
        "esp1    btn1 	esp2";
}
.contOpcion .usuarios .acciones .btn1 {
    grid-area: btn1;
}
.contOpcion .usuarios .acciones2 {
    display: grid;
    align-items: center;
    margin-top: 20px;
    margin-bottom: 40px;
    grid-gap: 20px;
    grid-row-gap: 10px;
    grid-template-columns: repeat(1fr,5);
    grid-template-areas:
        "esp1    btn1  esp2 btn2	esp3";
}
.contOpcion .usuarios .acciones2 .btn1 {
    grid-area: btn1;
    display:flex;
    justify-content:center;
}
.contOpcion .usuarios .acciones2 .btn2 {
    grid-area: btn2;
    display:flex;
    justify-content:center;
}
.contOpcion .usuarios .dvDetalle {
    width: 100%;
    display: inline-block;
    border: 2px solid #1e1343;
    color: rgb(255, 255, 255);
    border-radius: 10px 10px 10px 10px;
    overflow: hidden;
    align-items: center;
    justify-content: center;
    margin: 0px;
}
.contOpcion .usuarios .dvDetalle .card-headerDetalle {
    background-color: #1e1343; /*Solido*/
    justify-content: center;
    align-items: center;
    height: 50px;
    margin-top: -10px;
}
.contOpcion .usuarios .dvDetalle .card-headerDetalle-2col {
    display: grid;
    justify-content: center;
    align-items: center;
    text-align: left;
    grid-template-columns: 4fr 50px;
    grid-template-rows: 20px;
    padding-top: 23px;
    font-size: 5px;
    margin-left: 20px;
}
.contOpcion .usuarios .dvDetalle .Detalle {
    display: grid;
    align-items: center;
    margin: 10px;
    grid-gap: 5px;
    grid-row-gap:10px;
    grid-template-columns: 120px 1fr 10px 120px 1fr 10px 100px 50px 10px;
    grid-template-areas:
        "esp1-1       esp1-2      esp1-2     esp1-2     esp1-2   esp1-3   esp1-4   esp1-5   esp1-5"
        "esp2-1       esp2-2      esp2-2     esp2-2     esp2-2   esp2-2   esp2-2   esp2-2   esp2-3"
        "esp3-1       esp3-2      esp3-3     esp3-4     esp3-5   esp3-5   esp3-5   esp3-5   esp3-6"
        "esp4-1       esp4-2      esp4-3     esp4-4     esp4-5   esp4-5   esp4-5   esp4-5   esp4-6";
}
.contOpcion .usuarios .dvDetalle .Detalle .esp1-1 {
    grid-area: esp1-1;
}
.contOpcion .usuarios .dvDetalle .Detalle .esp1-2 {
    grid-area: esp1-2;
}
.contOpcion .usuarios .dvDetalle .Detalle .esp1-3 {
    grid-area: esp1-3;
}
.contOpcion .usuarios .dvDetalle .Detalle .esp1-4 {
    grid-area: esp1-4;
}
.contOpcion .usuarios .dvDetalle .Detalle .esp1-5 {
    grid-area: esp1-5;
}
.contOpcion .usuarios .dvDetalle .Detalle .esp2-1 {
    grid-area: esp2-1;
}
.contOpcion .usuarios .dvDetalle .Detalle .esp2-2 {
    grid-area: esp2-2;
}
.contOpcion .usuarios .dvDetalle .Detalle .esp2-3 {
    grid-area: esp2-3;
}
.contOpcion .usuarios .dvDetalle .Detalle .esp3-1 {
    grid-area: esp3-1;
}
.contOpcion .usuarios .dvDetalle .Detalle .esp3-2 {
    grid-area: esp3-2;
}
.contOpcion .usuarios .dvDetalle .Detalle .esp3-3 {
    grid-area: esp3-3;
}
.contOpcion .usuarios .dvDetalle .Detalle .esp3-4 {
    grid-area: esp3-4;
}
.contOpcion .usuarios .dvDetalle .Detalle .esp3-5 {
    grid-area: esp3-5;
}
.contOpcion .usuarios .dvDetalle .Detalle .esp3-6 {
    grid-area: esp3-6;
}
.contOpcion .usuarios .dvDetalle .Detalle .esp4-1 {
    grid-area: esp4-1;
}
.contOpcion .usuarios .dvDetalle .Detalle .esp4-2 {
    grid-area: esp4-2;
}
.contOpcion .usuarios .dvDetalle .Detalle .esp4-3 {
    grid-area: esp4-3;
}
.contOpcion .usuarios .dvDetalle .Detalle .esp4-4 {
    grid-area: esp4-4;
}
.contOpcion .usuarios .dvDetalle .Detalle .esp4-5 {
    grid-area: esp4-5;
}
.contOpcion .usuarios .dvDetalle .Detalle .esp4-6 {
    grid-area: esp4-6;
}
.contOpcion .usuarios .dvDetalle .Detalle2 {
    display: grid;
    align-items: center;
    margin: 10px;
    grid-gap: 5px;
    grid-row-gap: 10px;
    grid-template-columns: 120px 1fr 10px 120px 1fr 10px 100px 50px 10px;
}
.contOpcion .usuarios .dvDetalle .datosbancarios {
    display: grid;
    align-items: center;
    margin: 0px 10px 10px 10px;
    grid-gap: 5px;
    grid-row-gap: 10px;
    grid-template-columns: 1fr 20px 1fr 20px 1fr 20px;
    grid-template-rows: 30px 30px 30px;
    grid-template-areas:
        "tit1     tit1    tit1    tit1     tit1      tit1"
        "et1      esp1    et2     esp2     et3       esp3"
        "input1   val1    input2  val2     input3    val3";
}
.contOpcion .usuarios .dvDetalle .datosbancarios .tit1 {
    grid-area: tit1;
    margin-top: 10px;
    text-align: center;
}
.contOpcion .usuarios .dvDetalle .datosbancarios .et1 {
    grid-area: et1;
    margin-top: 10px;
}
.contOpcion .usuarios .dvDetalle .datosbancarios .et2 {
    grid-area: et2;
    margin-top: 10px;
}
.contOpcion .usuarios .dvDetalle .datosbancarios .et3 {
    grid-area: et3;
    margin-top: 10px;
}
.contOpcion .usuarios .dvDetalle .datosbancarios .esp1 {
    grid-area: esp1;
}
.contOpcion .usuarios .dvDetalle .datosbancarios .esp2 {
    grid-area: esp2;
}
.contOpcion .usuarios .dvDetalle .datosbancarios .esp3 {
    grid-area: esp3;
}
.contOpcion .usuarios .dvDetalle .datosbancarios .input1 {
    grid-area: input1;
}
.contOpcion .usuarios .dvDetalle .datosbancarios .input2 {
    grid-area: input2;
}
.contOpcion .usuarios .dvDetalle .datosbancarios .input3 {
    grid-area: input3;
}
.contOpcion .usuarios .dvDetalle .datosbancarios .val1 {
    grid-area: val1;
}
.contOpcion .usuarios .dvDetalle .datosbancarios .val2 {
    grid-area: val2;
}
.contOpcion .usuarios .dvDetalle .datosbancarios .val3 {
    grid-area: val3;
}