.contOpcion .pagos .principal {
    display: grid;
    align-items: center;
    margin-top: 20px;
    grid-gap: 10px;
    grid-template-columns: 1fr;
    grid-template-rows: 1fr;
    grid-template-areas: "tab";
}
.contOpcion .pagos .principal .tab {
    grid-area: tab;
}
    .contOpcion .pagos .principal .agregarSaldo {
        display: grid;
        align-items: center;
        margin-top: 5px;
        grid-gap: 5px;
        grid-template-columns: 380px 280px 1fr;
        grid-template-rows: 40px 30px 30px 30px 30px 30px 30px;
        grid-template-areas:
            "et1    et1   et1"
            "et2    et2   et2"
            "et3    et4   et4"
            "et5    et6   et6b"
            "et7    et8   et8"
            "et9    et10  et10"
            "et11   et12  et12"
            "et13   et14  et14";
    }
.contOpcion .pagos .principal .agregarSaldo .et1 {
    grid-area: et1;
}
.contOpcion .pagos .principal .agregarSaldo .et2 {
    grid-area: et2;
}
.contOpcion .pagos .principal  .agregarSaldo .et3  {
    grid-area: et3;
}
.contOpcion .pagos .principal  .agregarSaldo .et4  {
    grid-area: et4;
}
.contOpcion .pagos .principal  .agregarSaldo .et5  {
    grid-area: et5;
}
.contOpcion .pagos .principal  .agregarSaldo .et6  {
    grid-area: et6;
}
.contOpcion .pagos .principal .agregarSaldo .et6b {
    grid-area: et6b;
}
.contOpcion .pagos .principal  .agregarSaldo .et7  {
    grid-area: et7;
}
.contOpcion .pagos .principal  .agregarSaldo .et8 {
    grid-area: et8;
}
.contOpcion .pagos .principal  .agregarSaldo .et9  {
    grid-area: et9;
}
.contOpcion .pagos .principal  .agregarSaldo .et10 {
    grid-area: et10;
}
.contOpcion .pagos .principal  .agregarSaldo .et11  {
    grid-area: et11;
}
.contOpcion .pagos .principal  .agregarSaldo .et12 {
    grid-area: et12;
}
.contOpcion .pagos .principal .agregarSaldo .et13 {
    grid-area: et13;
}
.contOpcion .pagos .principal .agregarSaldo .et14 {
    grid-area: et14;
}

.contOpcion .pagos .principal .retirarSaldo {
    display: grid;
    align-items: center;
    margin-top: 5px;
    grid-gap: 10px;
     column-gap:10px;
    grid-template-columns: 170px 200px 1fr;
    grid-template-rows:  40px 40px 60px;
    grid-template-areas:
        "et2    et3 esp"
        "et4    et5 esp"
        "btn1   btn2 esp";
}

.contOpcion .pagos .principal .retirarSaldo .et2 {
    grid-area: et2;
}
.contOpcion .pagos .principal  .retirarSaldo .et3  {
    grid-area: et3;
    margin-left:10px;
}
.contOpcion .pagos .principal  .retirarSaldo .et4  {
    grid-area: et4;
}
    .contOpcion .pagos .principal .retirarSaldo .et5 {
        grid-area: et5;
        margin-left: 10px;
    }
.contOpcion .pagos .principal  .retirarSaldo .btn1  {
    grid-area: btn1;
}
.contOpcion .pagos .principal .retirarSaldo .btn2 {
    grid-area: btn2;
    text-align: center;
}
.contOpcion .pagos .principal .nuevoSaldo {
    display: grid;
    align-items: center;
    margin-top: 5px;
    grid-gap: 10px;
     column-gap:10px;
    grid-template-columns: 170px 200px 1fr;
    grid-template-rows: 40px 40px 40px 60px;
    grid-template-areas:
        "et1    et1 et1"
        "et2    et3 esp"
        "et4    et5 esp"
        "btn1   btn2 esp";
}
.contOpcion .pagos .principal .nuevoSaldo .et1 {
    grid-area: et1;
}
.contOpcion .pagos .principal .nuevoSaldo .et2 {
    grid-area: et2;
}
.contOpcion .pagos .principal  .nuevoSaldo .et3  {
    grid-area: et3;
    margin-left:10px;
}
.contOpcion .pagos .principal  .nuevoSaldo .et4  {
    grid-area: et4;
}
.contOpcion .pagos .principal .nuevoSaldo .et5 {
    grid-area: et5;
    margin-left: 10px;
}
.contOpcion .pagos .principal .nuevoSaldo .btn1 {
    grid-area: btn1;
}
.contOpcion .pagos .principal .nuevoSaldo .btn2 {
    grid-area: btn2;
    text-align: center;
}
.contOpcion .pagos .principal .pagos {
    display: grid;
    align-items: center;
    margin-top: 5px;
    grid-gap: 5px;
    grid-template-columns: 200px 1fr;
    grid-template-rows: 40px 30px 30px 30px 30px 30px;
    grid-template-areas:
        "et1    et1"
        "et2    et2"
        "et3    et4"
        "et5    et6"
        "et7    et8"
        "et9    et10"
        "et11   et12";
}
.contOpcion .pagos .principal .pagos .et1 {
    grid-area: et1;
}
.contOpcion .pagos .principal .pagos .et2 {
    grid-area: et2;
}
.contOpcion .pagos .principal  .pagos .et3  {
    grid-area: et3;
}
.contOpcion .pagos .principal  .pagos .et4  {
    grid-area: et4;
}
.contOpcion .pagos .principal  .pagos .et5  {
    grid-area: et5;
}
.contOpcion .pagos .principal  .pagos .et6  {
    grid-area: et6;
}
.contOpcion .pagos .principal  .pagos .et7  {
    grid-area: et7;
}
.contOpcion .pagos .principal  .pagos .et8 {
    grid-area: et8;
}
.contOpcion .pagos .principal  .pagos .et9  {
    grid-area: et9;
}
.contOpcion .pagos .principal  .pagos .et10 {
    grid-area: et10;
}
.contOpcion .pagos .principal .pagos .et11 {
    grid-area: et11;
}

.contOpcion .pagos .principal .pagos .et12 {
    grid-area: et12;
}