﻿
.contOpcion .saldoinversor .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 .saldoinversor .principal .tab {
    grid-area: tab;
}
.contOpcion .saldoinversor .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;
    grid-template-areas:
        "et1    et1   et1"
        "et2    et2   et2"
        "et3    et4   et4"
        "et5    et6   et6b"
        "et7    et8   et8";
}
.contOpcion .saldoinversor .principal .agregarSaldo .et1 {
    grid-area: et1;
}
.contOpcion .saldoinversor .principal .agregarSaldo .et2 {
    grid-area: et2;
}
.contOpcion .saldoinversor .principal  .agregarSaldo .et3  {
    grid-area: et3;
}
.contOpcion .saldoinversor .principal  .agregarSaldo .et4  {
    grid-area: et4;
}
.contOpcion .saldoinversor .principal  .agregarSaldo .et5  {
    grid-area: et5;
}
.contOpcion .saldoinversor .principal  .agregarSaldo .et6  {
    grid-area: et6;
}
.contOpcion .saldoinversor .principal  .agregarSaldo .et6b  {
    grid-area: et6b;
}
.contOpcion .saldoinversor .principal  .agregarSaldo .et7  {
    grid-area: et7;
}
.contOpcion .saldoinversor .principal  .agregarSaldo .et8 {
    grid-area: et8;
}
.contOpcion .saldoinversor .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 .saldoinversor .principal .retirarSaldo .et2 {
    grid-area: et2;
}
.contOpcion .saldoinversor .principal  .retirarSaldo .et3  {
    grid-area: et3;
    margin-left:10px;
}
.contOpcion .saldoinversor .principal  .retirarSaldo .et4  {
    grid-area: et4;
}
    .contOpcion .saldoinversor .principal .retirarSaldo .et5 {
        grid-area: et5;
        margin-left: 10px;
    }
.contOpcion .saldoinversor .principal  .retirarSaldo .btn1  {
    grid-area: btn1;
}
.contOpcion .saldoinversor .principal .retirarSaldo .btn2 {
    grid-area: btn2;
    text-align: center;
}
.contOpcion .saldoinversor .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 .saldoinversor .principal .nuevoSaldo .et1 {
    grid-area: et1;
}
.contOpcion .saldoinversor .principal .nuevoSaldo .et2 {
    grid-area: et2;
}
.contOpcion .saldoinversor .principal  .nuevoSaldo .et3  {
    grid-area: et3;
    margin-left:10px;
}
.contOpcion .saldoinversor .principal  .nuevoSaldo .et4  {
    grid-area: et4;
}
.contOpcion .saldoinversor .principal .nuevoSaldo .et5 {
    grid-area: et5;
    margin-left: 10px;
}
.contOpcion .saldoinversor .principal .nuevoSaldo .btn1 {
    grid-area: btn1;
}
.contOpcion .saldoinversor .principal .nuevoSaldo .btn2 {
    grid-area: btn2;
    text-align: center;
}
.contOpcion .saldoinversor .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";
}
.contOpcion .saldoinversor .principal .pagos .et1 {
    grid-area: et1;
}
.contOpcion .saldoinversor .principal .pagos .et2 {
    grid-area: et2;
}
.contOpcion .saldoinversor .principal  .pagos .et3  {
    grid-area: et3;
}
.contOpcion .saldoinversor .principal  .pagos .et4  {
    grid-area: et4;
}
.contOpcion .saldoinversor .principal  .pagos .et5  {
    grid-area: et5;
}
.contOpcion .saldoinversor .principal  .pagos .et6  {
    grid-area: et6;
}
.contOpcion .saldoinversor .principal  .pagos .et7  {
    grid-area: et7;
}
.contOpcion .saldoinversor .principal  .pagos .et8 {
    grid-area: et8;
}
.contOpcion .saldoinversor .principal  .pagos .et9  {
    grid-area: et9;
}
.contOpcion .saldoinversor .principal  .pagos .et10 {
    grid-area: et10;
}