<div class="content" id="content"> 
    <div class="table">
        <div class="tableRow" style="height: 10%">
            <div class="tableCell">
                 
                 <p class="titlePage"> Monitoreo </p>
                 
            </div>
        </div>
        
        <div class="tableRow">
            <div class="tableCell">
                
                    <div class=centeredImage style="height: 100%">
                        <div class="headerFilter">
                            <div class="subTitlePage">
                                <p> Sesiones </p>
                            </div>
                            
                            <div class="inputsContainer">
                               <div class="inputContainer">
                                   <label for="search" class="ordered"> Buscar </label>
                                    <input class="inputElement searching" type="text" id="search" name="search" style="border: none"> 
                                    <div class="iconContainerSearch">
                                        <i class="fas fa-search" id="iconSearch"></i>
                                    </div>
                                </div>
                                
                                <div class="inputContainer tabtext">
                                   <label for="orderBy" class="ordered"> Ordenar por </label>
                                    <select class="inputElement selectOrderBy" id="orderBy" name="orderBy" placeholder="Nombre" style="border: none"> 
                                        <option value="4" selected> Más reciente </option>
                                        <option value="3" > Estatus </option>
                                        <option value="1" > Nombre </option>
                                        <option value="2" > Nivel </option>
                                    </select>
                                    <div class="iconContainerArrow">
                                        <i class="fas fa-caret-down" id="arrowOrderBy"></i>
                                    </div>
                                </div>
                                <div class="inputContainer tabtext">
                                    <select class="inputElement selectOrderBy" id="orderDirect" name="orderBy" placeholder="Nombre" style="border:none;width:70px" > 
                                        <option value="asc"> Asc </option>
                                        <option value="desc" selected> Desc </option>
                                    </select>
                                    <div class="iconContainerArrow" style="width: 15px;text-align: center;">
                                        <i class="fas fa-caret-down" style="width:auto" id="arrowOrderDir"></i>
                                    </div>
                                </div>
                            </div>
                        </div>
                        
                        <div class="tableContainer">
                            <div class="rowContainer" style="height: 100%">
                                <div class="cellCnt" style="width:100%">
                                    <div class="tableCurrencies">
                                        
                                        <div class="headerTableCurrencies tabtext two">
                                            <div class="cell0 selectorbox">
                                                <div class="inputContainer" style="padding-left: 0px">
                                                    <select class="inputElement selectOrderBy" id="rangeFilter" style="border: none; width: 100%"> 
                                                        <option value='' selected style="font-size: 13px"> Rango de Fechas </option>
                                                        <option value="1" style="font-size: 13px"> Hoy </option>
                                                        <option value="2" style="font-size: 13px"> Últimos 7 días </option>
                                                        <option value="3" style="font-size: 13px"> Últimos 30 días </option>
                                                    </select>
                                                    <div class="iconContainerArrow">
                                                        <i class="fas fa-caret-down" id="arrowRangeFilter"></i>
                                                    </div>
                                                </div>
                                            </div>
                                            <div class="cell0 selectorbox">
                                                <div class="inputContainer">
                                                    <select class="inputElement selectOrderBy" id="levelFilter" style="border: none; width: 100%"> 
                                                        <option value='' selected style="font-size: 13px"> Seleccionar Nivel </option>
                                                    </select>
                                                    <div class="iconContainerArrow">
                                                        <i class="fas fa-caret-down" id="arrowLevelFilter"></i>
                                                    </div>
                                                </div>
                                            </div>
                                            <div class="cell0 selectorbox">
                                                <div class="inputContainer">
                                                    <select class="inputElement selectOrderBy" id="statusFilter" style="border: none; width: 100%"> 
                                                        <option value='' selected style="font-size: 13px"> Seleccionar Estatus </option>
                                                        <option value="1" style="font-size: 13px"> Activo </option>
                                                        <option value="0" style="font-size: 13px"> Inactivo </option>
                                                        <option value="2" style="font-size: 13px"> Requiere Revisión </option>
                                                    </select>
                                                    <div class="iconContainerArrow">
                                                        <i class="fas fa-caret-down" id="arrowStatusFilter"></i>
                                                    </div>
                                                </div>
                                            </div>
                                            <div class="cell0 selectorbox">
                                                <div class="inputContainer">
                                                    <select class="inputElement selectOrderBy" id="registerFilter" style="border: none; width: 100%"> 
                                                        <option value='10' selected style="font-size: 13px"> Ver 10 Registros </option>
                                                        <option value='25' style="font-size: 13px"> Ver 25 Registros </option>
                                                        <option value="50" style="font-size: 13px"> Ver 50 Registros </option>
                                                        <option value="100" style="font-size: 13px"> Ver 100 Registros </option>
                                                    </select>
                                                    <div class="iconContainerArrow">
                                                        <i class="fas fa-caret-down" id="arrowRegisterFilter"></i>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>

                                        <div class="headerTableCurrencies" style="border: none; padding-top: 0px">
                                            <div class="inputContainer">
                                                <p style="font-size: 70%"> </p>
                                            </div>
                                            
                                            <div class="inputContainer">
                                               <p id="msgErrorLevelFilter" class="msgError" style="font-size: 70%; display: none"> Error al cargar los niveles </p>
                                            </div>
                                            
                                            
                                            <div class="inputContainer">
                                                <p style="font-size: 70%">  </p>
                                            </div>
                                        </div>
                                        
                                        
                                        
                                        <!-- <div class="headerTableCurrencies" style="border: none">
                                            <span> Usuario </span>
                                            
                                            <span style="padding-left: 67px;"> Último Acceso </span>
                                                
                                            <span> Nivel </span>
                                            
                                            <span> Estatus </span>
                                            
                                            <span>  </span>
                                        </div> -->
                                        
                                        <div class="rowCurrencie headtop">
                                            <div class="cell0">
                                                <span class="colHead"> Usuario </span>
                                            </div>
                                            
                                            <div class="cell1">
                                                <span class="colHead"> Nombre </span>
                                            </div>
                                                
                                            <div class="cell2">
                                                <span class="colHead" > Último Acceso </span>    <!--style="padding-left: 67px;" -->
                                            </div>
                                            
                                            <div class="cell3">
                                                <span class="colHead"> Nivel </span>    
                                            </div>
                                                
                                            <div class="cell4" style="padding:0">
                                                <span class="colHead"> Estatus </span>    
                                            </div>
                                            
                                            <div class="cell5">
                                                <span></span>    
                                            </div>
                                            
                                            
                                        </div>
                                        
                                        <p id="messageApi" ></p>
                                        <div class="bodyTableCurrencies" id="bodyTableCurrencies">
                                            <!--<div class="rowCurrencie" id="liCurrencie" style="display: none">
                                                 <input disabled="true" class="inputRowCurrencie">
                                                
                                                <input disabled="true" class="inputRowCurrencie">
                                                
                                                <input disabled="true" class="inputRowCurrencie">
                                                
                                                <p style='display: inherit;'>
                                                    <i class='fas fa-edit editCurrencie'></i>
                                                    <i class='fas fa-trash-alt deleteCurrencie'></i>
                                                </p> 
                                            </div>-->
                                            
                                            <div class="rowCurrencieNoDefine rowImpar" style="display: none" id="noCurrencieDefine">
                                                <p id="msgInTable"> msg Error </p>
                                            </div>
                                        </div>
                                        
                                    </div>
                                </div>
                                
                                <div class="cellContainer">
                                    <div class=contentSectionAdd id="addCurrencie">
                                        <div class="triangle-left"></div>
                                        <div class="contentAdd">
                                            <div class="divTitleAdd">
                                                <p class="titleAdd"> Agregar Moneda </p>
                        
                                                <span id="closeSectionAdd">&times;</span>
                                            </div>
                                        </div>
                                        
                                    </div>
                                    
                                </div>
                            </div>
                            
                            <div class="rowContainer" style="height: 20%;">
                                <div class="cellContainer"  >
                                    <div class="rowContainer paginator" id="paginator">
                                        <div class="pageCntBox" align="center">
                                            <!--
                                            <p>
                                                <i class='fas fa-angle-left editCurrencie'></i>
                                            </p>-->
                                            
                                            <p>
                                                <i class='fas fa-angle-left editCurrencie'></i>
                                            </p>
                                            
                                            <div arrowsEvent="false" id="numbersPaginator">
                                                   
                                            </div>
                                            
                                            
                                            <p>
                                                <i class='fas fa-angle-right editCurrencie'></i>
                                            </p>
                                            <!--
                                            <p>
                                                <i class='fas fa-angle-right editCurrencie'></i>
                                            </p>-->
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                
            </div>
        </div>
    
        
        <div class="tableRowFooter" style="height: 10%">
            <div class="tableCell">
                <div class="copyright">
                    <p style="margin-top: 20px; margin-bottom: 20px">&copy; 2020. Totalsoftware de Venezuela - Todos los derechos reservados </p>
                </div>
            </div>
        </div>
    </div>
</div>
    
<!------------------------------------------------------- Modal image ---------------------------------------------------------------------->
<div id="modalImage" class="modal modalImage" style="z-index: 106;">

  <!-- Modal content -->
  <div class="modal-content tablePop">
    <div class="bodyModal bodyModalCell">
        <div id="imageSupport" class="imageCnt"></div>
        <div class="footerModal" align="center">
            <button id="buttonCloseModalImage" class="buttonModal" align="center" style="width: 200px;"> REGRESAR </button>
        </div>
    </div>
    
    
  </div>

</div>

<!------------------------------------------------------- Modal Details Natural Person -------------------------------------------------------------------->
<div id="modalDetailNatural" class="modal">
    <div class="modalCellAlign">
        <!-- Modal content -->
        <div class="modal-content-detail" style="width: 900px;">
            <div style="display:none" class="headerModal" > 
                <span></span>
                <span class="closeModal" id="closeModalDetailNatural">&times;</span>
                
            </div>
            
            <div class="bodyModal" style="padding: 0px">
                
                <p class="titleModalDetail" > Detalle <span id="nameUserDetail">  </span> </p>
                
                <div class="tab">
                    <div>
                        <button class="tablinksNatural" data-name="status-natural"> Estatus </button> 
                    </div>
                    
                    <div>
                        <button class="tablinksNatural" data-name="basic-data" >Datos Básicos</button>      
                    </div>
                    
                    <div>
                        <button class="tablinksNatural" data-name="residence-data"> Datos de Residencia </button>      
                    </div>
                    
                    <div>
                        <button class="tablinksNatural" data-name="professional-info"> Información Profesional </button>      
                    </div>
        
                    <div>
                        <button class="tablinksNatural" data-name="support-images" > Soporte de información </button>      
                    </div>
                    
                    <div>
                        <button class="tablinksNatural" data-name="transaction-data" > Datos Transaccionales </button>      
                    </div>
                    
                    <div>
                        <button class="tablinksNatural" data-name="retirement-accounts" > Cuentas de Retiro </button>    
                    </div>
                  
                    <div>
                        <button class="tablinksNatural" data-name="declaration-natural" > Declaración Jurada </button>
                    </div>
                </div>
                
                <!-- Status -->      
                    <div id="status-natural" class="tabcontent tabcontentNatural">
                        
                        <div class="scrollBox" style="width:90%;margin-left:auto;margin-right:auto;height: 270px;">
                            <div class="row-tabCnt">
                            <div class="cell-tabcnt1">
                                <div style="display: flex; flex-direction: row; justify-content: flex:start; align-items: center; padding: 10px 0px">
                                    <p style="padding-right: 10px;" class="fontStatusSection"> Estatus </p> 
                                    <div class="">
                                        <div class="switchCont">
                                            <div class="switch active" id="swichtStatusNatural">
                                                <div class="switchBal balActive"></div>
                                            </div>
                                        </div>
                                    </div>
                                  </div>
                            </div>
                        </div>
                            <div class="row-tabCnt">
                                <div style="display: flex; flex-direction: row; align-items: center; justify-content: start; text-align: left">
                                    <div style="padding-right: 10px">
                                        <label for="level" class="fontStatusSection"> Nivel </label>
                                        <div class="inputContainer" style="padding-left: 0">
                                            <select class="inputElement selectOrderBy" id="levelNatural" name="level" title="Nivel" style="border: none; width: 220px;"> 
                                                
                                            </select>
                                            <div class="iconContainerArrow" style="right: 10px">
                                                <i class="fas fa-caret-down" id="arrowOrderBy"></i>
                                            </div>
                                        </div>
                                        <p class="msgError" style="display: none" id="errorLevelNat"> Error al cargar niveles </p>
                                    </div>
                                    
                                    <div>
                                        <label for="riskLevel" class="fontStatusSection"> Nivel de Riesgo </label>
                                        <div class="inputContainer" style="padding-left: 0">
                                            <select class="inputElement selectOrderBy" id="riskLevelNatural" name="riskLevel" title="Nivel de Riesgo" style="border: none; width: 220px;"> 
                                                <option value="0">Bajo</option>
                                                <option value="1">Moderado</option>
                                                <option value="2">Alto</option>
                                            </select>
                                            <div class="iconContainerArrow" style="right: 10px">
                                                <i class="fas fa-caret-down" id="arrowOrderBy"></i>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            
                            <div class="row-tabCnt">
                                <div class="cell-tabcnt2" style="width: 90%;">
                                    <div class="contenCell">
                                        <label class="fontStatusSection"> Atributos Adicionales </label>
                                        <div class="groupAdd groupTagNatural" id="groupTagNatural"> 
                                            <input id="tagNatural" type="tags" style="outline: none; border: none"> 
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                <!-- /Status -->
                
                <!-- Basic Data -->   
                    <div id="basic-data" class="tabcontent tabcontentNatural" style="width: 100%;">
                        <div class="tblSect">
                            <div class="tabcntCell">
                                <div class="row-tabCnt rowCurrencie" >
                                  <div style="width: 20%; display: table-cell">
                                      <p style="font-weight: bold; font-size: 93%">Estatus</p>
                                  </div>
                                  
                                  <div style="width: 40%; display: table-cell; text-align: left">
                                      <p style="font-weight: bold; font-size: 93%" >Campo</p>
                                  </div>
                                  
                                  <div style="width: 40%; display: table-cell; text-align: left">
                                      <p style="font-weight: bold; font-size: 93%" >Información</p>
                                  </div>
                                </div>
                            </div>
                            <div class="tabcntCell cellLevels">
                                <div class="row-tabCntX rowCurrencie" >
                                    <div style="width: 33.3333%; display: table-cell;text-align:center">
                                        <p style="font-weight: bold; font-size: 93%">N1</p>
                                    </div>
                                     
                                    <div style="width: 33.3333%; display: table-cell; text-align: center">
                                        <p style="font-weight: bold; font-size: 93%" >N2</p>
                                    </div>
                                      
                                    <div style="width: 33.3333%; display: table-cell; text-align: center">
                                        <p style="font-weight: bold; font-size: 93%" >N3</p>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="scrollBox">
                            <div class="tblSect">
                                <div class="tabcntCell">
                                    <div class="">
                                          <!-- Venezuelan -->
                                          <div class="row-tabCnt">
                                              <div class="validCol">
                                                  <i class='far fa-check-circle' id="venezuelanNatValid"></i>
                                                  <i class='far fa-pause-circle' id="venezuelanNatPending"></i>
                                                  <i class='far fa-times-circle' id="venezuelanNatRejected"></i>
                                              </div>
                                              
                                              <div class="fieldCol">
                                                  <p>¿Es Venezolano?</p>
                                              </div>
                                              
                                              <div class="infoCol">
                                                  <p id="venezuelanNat">  </p>
                                              </div>
                                          </div>
                                          
                                          <!-- American -->
                                          <div class="row-tabCnt">
                                              <div class="validCol">
                                                  <i class='far fa-check-circle' id="americanNatValid"></i>
                                                  <i class='far fa-pause-circle' id="americanNatPending"></i>
                                                  <i class='far fa-times-circle' id="americanNatRejected"></i>
                                              </div>
                                              
                                              <div class="fieldCol">
                                                  <p>¿Es Ciudadano Americano?</p>
                                              </div>
                                              
                                              <div class="infoCol">
                                                  <p id="americanNat">  </p>
                                              </div>
                                          </div>
                                          
                                          <!-- fisrt name -->
                                          <div class="row-tabCnt" >
                                              <div class="validCol">
                                                  <i class='far fa-check-circle' id="firstNameValid"></i>
                                                  <i class='far fa-pause-circle' id="firstNamePending"></i>
                                                  <i class='far fa-times-circle' id="firstNameRejected"></i>
                                              </div>
                                              
                                              <div class="fieldCol">
                                                  <p>Primer Nombre</p>
                                              </div>
                                              
                                              <div class="infoCol">
                                                  <p id="firstName">  </p>
                                              </div>
                                          </div>
                                          
                                          <!-- second name -->
                                          <div class="row-tabCnt">
                                              <div class="validCol">
                                                  <i class='far fa-check-circle' id="secondNameValid"></i>
                                                  <i class='far fa-pause-circle' id="secondNamePending"></i>
                                                  <i class='far fa-times-circle' id="secondNameRejected"></i>
                                              </div>
                                              
                                              <div class="fieldCol">
                                                  <p>Segundo Nombre</p>
                                              </div>
                                              
                                              <div class="infoCol">
                                                  <p id="secondName">  </p>
                                              </div>
                                          </div>
                                          
                                          <!-- fisrt last name -->
                                          <div class="row-tabCnt" >
                                              <div class="validCol">
                                                  <i class='far fa-check-circle' id="firstLastNameValid"></i>
                                                  <i class='far fa-pause-circle' id="firstLastNamePending"></i>
                                                  <i class='far fa-times-circle' id="firstLastNameRejected"></i>
                                              </div>
                                              
                                              <div class="fieldCol">
                                                  <p> Primer Apellido </p>
                                              </div>
                                              
                                              <div class="infoCol">
                                                  <p id="firstLastName">  </p>
                                              </div>
                                          </div>
                                          
                                          <!-- second last name -->
                                          <div class="row-tabCnt">
                                              <div class="validCol">
                                                  <i class='far fa-check-circle' id="secondLastNameValid"></i>
                                                  <i class='far fa-pause-circle' id="secondLastNamePending"></i>
                                                  <i class='far fa-times-circle' id="secondLastNameRejected"></i>
                                              </div>
                                              
                                              <div class="fieldCol">
                                                  <p>Segundo Apellido</p>
                                              </div>
                                              
                                              <div class="infoCol">
                                                  <p id="secondLastName">  </p>
                                              </div>
                                          </div>
                                          
                                          <!-- identification -->
                                          <div class="row-tabCnt">
                                              <div class="validCol">
                                                  <i class='far fa-check-circle' id="identificationNatValid"></i>
                                                  <i class='far fa-pause-circle' id="identificationNatPending"></i>
                                                  <i class='far fa-times-circle' id="identificationNatRejected"></i>
                                              </div>
                                              
                                              <div class="fieldCol">
                                                  <p>Tipo de Identificación</p>
                                              </div>
                                              
                                              <div class="infoCol">
                                                  <p id="identificationNat">  </p>
                                              </div>
                                          </div>
                                          
                                          <!-- number -->
                                          <div class="row-tabCnt ">
                                              <div class="validCol">
                                                  <i class='far fa-check-circle' id="numberNatValid"></i>
                                                  <i class='far fa-pause-circle' id="numberNatPending"></i>
                                                  <i class='far fa-times-circle' id="numberNatRejected"></i>
                                              </div>
                                              
                                              <div class="fieldCol">
                                                  <p>Número de Identificación</p>
                                              </div>
                                              
                                              <div class="infoCol">
                                                  <p id="numberNat">  </p>
                                              </div>
                                          </div>
                                          
                                          <!-- country emition document -->
                                          <div class="row-tabCnt">
                                              <div class="validCol">
                                                  <i class='far fa-check-circle' id="countryEmitionDocValid"></i>
                                                  <i class='far fa-pause-circle' id="countryEmitionDocPending"></i>
                                                  <i class='far fa-times-circle' id="countryEmitionDocRejected"></i>
                                              </div>
                                              
                                              <div class="fieldCol">
                                                  <p>País Emisión del Documento</p>
                                              </div>
                                              
                                              <div class="infoCol">
                                                  <p id="countryEmitionDoc">  </p>
                                              </div>
                                          </div>
                                          
                                          <!-- date Emition -->
                                          <div class="row-tabCnt">
                                              <div class="validCol">
                                                  <i class='far fa-check-circle' id="dateEmitionValid"></i>
                                                  <i class='far fa-pause-circle' id="dateEmitionPending"></i>
                                                  <i class='far fa-times-circle' id="dateEmitionRejected"></i>
                                              </div>
                                              
                                              <div class="fieldCol">
                                                  <p>Fecha de Emisión</p>
                                              </div>
                                              
                                              <div class="infoCol">
                                                  <p id="dateEmition">  </p>
                                              </div>
                                          </div>
                                          
                                          <!-- date exp -->
                                          <div class="row-tabCnt">
                                              <div class="validCol">
                                                  <i class='far fa-check-circle' id="dateExpValid"></i>
                                                  <i class='far fa-pause-circle' id="dateExpPending"></i>
                                                  <i class='far fa-times-circle' id="dateExpRejected"></i>
                                              </div>
                                              
                                              <div class="fieldCol">
                                                  <p>Fecha de Expiración</p>
                                              </div>
                                              
                                              <div class="infoCol">
                                                  <p id="dateExp">  </p>
                                              </div>
                                          </div>
                                          
                                          <!-- sex -->
                                          <div class="row-tabCnt">
                                              <div class="validCol">
                                                  <i class='far fa-check-circle' id="sexValid"></i>
                                                  <i class='far fa-pause-circle' id="sexPending"></i>
                                                  <i class='far fa-times-circle' id="sexRejected"></i>
                                              </div>
                                              
                                              <div class="fieldCol">
                                                  <p>Sexo</p>
                                              </div>
                                              
                                              <div class="infoCol">
                                                  <p id="sex">  </p>
                                              </div>
                                          </div>
                                          
                                          <!-- date born -->
                                          <div class="row-tabCnt">
                                              <div class="validCol">
                                                  <i class='far fa-check-circle' id="dateBornValid"></i>
                                                  <i class='far fa-pause-circle' id="dateBornPending"></i>
                                                  <i class='far fa-times-circle' id="dateBornRejected"></i>
                                              </div>
                                              
                                              <div class="fieldCol">
                                                  <p>Fecha de Nacimiento</p>
                                              </div>
                                              
                                              <div class="infoCol">
                                                  <p id="dateBorn">  </p>
                                              </div>
                                          </div>
                                          
                                          <!-- state civil -->
                                          <div class="row-tabCnt">
                                              <div class="validCol">
                                                  <i class='far fa-check-circle' id="stateCivilValid"></i>
                                                  <i class='far fa-pause-circle' id="stateCivilPending"></i>
                                                  <i class='far fa-times-circle' id="stateCivilRejected"></i>
                                              </div>
                                              
                                              <div class="fieldCol">
                                                  <p>Estado Civil</p>
                                              </div>
                                              
                                              <div class="infoCol">
                                                  <p id="stateCivil">  </p>
                                              </div>
                                          </div>
                                          
                                          <!-- number phone -->
                                          <div class="row-tabCnt">
                                              <div class="validCol">
                                                  <i class='far fa-check-circle' id="phoneNatValid"></i>
                                                  <i class='far fa-pause-circle' id="phoneNatPending"></i>
                                                  <i class='far fa-times-circle' id="phoneNatRejected"></i>
                                              </div>
                                              
                                              <div class="fieldCol">
                                                  <p>Teléfono</p>
                                              </div>
                                              
                                              <div class="infoCol">
                                                  <p id="phoneNat">  </p>
                                              </div>
                                          </div>
                                          
                                          <!-- country born -->
                                          <div class="row-tabCnt">
                                              <div class="validCol">
                                                  <i class='far fa-check-circle' id="countryBornValid"></i>
                                                  <i class='far fa-pause-circle' id="countryBornPending"></i>
                                                  <i class='far fa-times-circle' id="countryBornRejected"></i>
                                              </div>
                                              
                                              <div class="fieldCol">
                                                  <p>País de Nacimiento</p>
                                              </div>
                                              
                                              <div class="infoCol">
                                                  <p id="countryBorn">  </p>
                                              </div>
                                          </div>
                                    </div>
                                </div>
                                <div class="tabcntCell cellLevels">
                                    <div class="drawLevelLines">
                                            
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                <!-- /Basic Data --> 
                
                <!-- Residence Data -->
                    <div id="residence-data" class="tabcontent tabcontentNatural" style="width: 100%;">
                        <div class="tblSect">
                            <div class="tabcntCell">
                                <div class="row-tabCnt rowCurrencie" >
                                  <div style="width: 20%; display: table-cell">
                                      <p style="font-weight: bold; font-size: 93%">Estatus</p>
                                  </div>
                                  
                                  <div style="width: 40%; display: table-cell; text-align: left">
                                      <p style="font-weight: bold; font-size: 93%" >Campo</p>
                                  </div>
                                  
                                  <div style="width: 40%; display: table-cell; text-align: left">
                                      <p style="font-weight: bold; font-size: 93%" >Información</p>
                                  </div>
                                </div>
                            </div>
                            <div class="tabcntCell cellLevels">
                                <div class="row-tabCntX rowCurrencie" >
                                    <div style="width: 33.3333%; display: table-cell;text-align:center">
                                        <p style="font-weight: bold; font-size: 93%">N1</p>
                                    </div>
                                     
                                    <div style="width: 33.3333%; display: table-cell; text-align: center">
                                        <p style="font-weight: bold; font-size: 93%" >N2</p>
                                    </div>
                                      
                                    <div style="width: 33.3333%; display: table-cell; text-align: center">
                                        <p style="font-weight: bold; font-size: 93%" >N3</p>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="scrollBox">
                            <div class="tblSect">
                                <div class="tabcntCell">
                                    <div class="">
                                      <!-- Country Residence -->
                                      <div class="row-tabCnt">
                                          <div class="validCol">
                                              <i class='far fa-check-circle' id="countryResidenceNatValid"></i>
                                              <i class='far fa-pause-circle' id="countryResidenceNatPending"></i>
                                              <i class='far fa-times-circle' id="countryResidenceNatRejected"></i>
                                          </div>
                                          
                                          <div class="fieldCol">
                                              <p>País de Residencia</p>
                                          </div>
                                          
                                          <div class="infoCol">
                                              <p id="countryResidenceNat">  </p>
                                          </div>
                                      </div>
                                      
                                      <!-- State Residence-->
                                      <div class="row-tabCnt" >
                                          <div class="validCol">
                                              <i class='far fa-check-circle' id="stateResidenceNatValid"></i>
                                              <i class='far fa-pause-circle' id="stateResidenceNatPending"></i>
                                              <i class='far fa-times-circle' id="stateResidenceNatRejected"></i>
                                          </div>
                                          
                                          <div class="fieldCol">
                                              <p>Estado</p>
                                          </div>
                                          
                                          <div class="infoCol">
                                              <p id="stateResidenceNat">  </p>
                                          </div>
                                      </div>
                                      
                                      <!-- City Residence-->
                                      <div class="row-tabCnt">
                                          <div class="validCol">
                                              <i class='far fa-check-circle' id="cityResidenceNatValid"></i>
                                              <i class='far fa-pause-circle' id="cityResidenceNatPending"></i>
                                              <i class='far fa-times-circle' id="cityResidenceNatRejected"></i>
                                          </div>
                                          
                                          <div class="fieldCol">
                                              <p>Ciudad</p>
                                          </div>
                                          
                                          <div class="infoCol">
                                              <p id="cityResidenceNat">  </p>
                                          </div>
                                      </div>
                                      
                                      <!-- direction Residence -->
                                      <div class="row-tabCnt" >
                                          <div class="validCol">
                                              <i class='far fa-check-circle' id="directionResidenceValid"></i>
                                              <i class='far fa-pause-circle' id="directionResidencePending"></i>
                                              <i class='far fa-times-circle' id="directionResidenceRejected"></i>
                                          </div>
                                          
                                          <div class="fieldCol">
                                              <p> Dirección </p>
                                          </div>
                                          
                                          <div class="infoCol">
                                              <p id="directionResidence">  </p>
                                          </div>
                                      </div>
                                      
                                      <!-- Number house -->
                                      <div class="row-tabCnt">
                                          <div class="validCol">
                                              <i class='far fa-check-circle' id="houseNumberNatValid"></i>
                                              <i class='far fa-pause-circle' id="houseNumberNatPending"></i>
                                              <i class='far fa-times-circle' id="houseNumberNatRejected"></i>
                                          </div>
                                          
                                          <div class="fieldCol">
                                              <p>Casa/Apartamento Nro.</p>
                                          </div>
                                          
                                          <div class="infoCol">
                                              <p id="houseNumberNat">  </p>
                                          </div>
                                      </div>
                                      
                                      <!-- branch office -->
                                      <div class="row-tabCnt">
                                          <div class="validCol">
                                              <i class='far fa-check-circle' id="codePostalNatValid"></i>
                                              <i class='far fa-pause-circle' id="codePostalNatPending"></i>
                                              <i class='far fa-times-circle' id="codePostalNatRejected"></i>
                                          </div>
                                          
                                          <div class="fieldCol">
                                              <p>Código Postal</p>
                                          </div>
                                          
                                          <div class="infoCol">
                                              <p id="codePostalNat">  </p>
                                          </div>
                                      </div>
                                </div>   
                                </div>
                                <div class="tabcntCell cellLevels">
                                    <div class="drawLevelLines">
                                            
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                <!-- /Residence Data -->  
                
                <!-- Professional Data -->
                    <div id="professional-info" class="tabcontent tabcontentNatural">
                        <div class="tblSect">
                            <div class="tabcntCell">
                                <div class="row-tabCnt rowCurrencie" >
                                  <div style="width: 20%; display: table-cell">
                                      <p style="font-weight: bold; font-size: 93%">Estatus</p>
                                  </div>
                                  
                                  <div style="width: 40%; display: table-cell; text-align: left">
                                      <p style="font-weight: bold; font-size: 93%" >Campo</p>
                                  </div>
                                  
                                  <div style="width: 40%; display: table-cell; text-align: left">
                                      <p style="font-weight: bold; font-size: 93%" >Información</p>
                                  </div>
                                </div>
                            </div>
                            <div class="tabcntCell cellLevels">
                                <div class="row-tabCntX rowCurrencie" >
                                    <div style="width: 33.3333%; display: table-cell;text-align:center">
                                        <p style="font-weight: bold; font-size: 93%">N1</p>
                                    </div>
                                     
                                    <div style="width: 33.3333%; display: table-cell; text-align: center">
                                        <p style="font-weight: bold; font-size: 93%" >N2</p>
                                    </div>
                                      
                                    <div style="width: 33.3333%; display: table-cell; text-align: center">
                                        <p style="font-weight: bold; font-size: 93%" >N3</p>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="scrollBox">
                            <div class="tblSect">
                                <div class="tabcntCell">
                                    <div class="">
                                          <!-- Prfession -->
                                          <div class="row-tabCnt">
                                              <div class="validCol">
                                                  <i class='far fa-check-circle' id="professionValid"></i>
                                                  <i class='far fa-pause-circle' id="professionPending"></i>
                                                  <i class='far fa-times-circle' id="professionRejected"></i>
                                              </div>
                                              
                                              <div class="fieldCol">
                                                  <p>Profesión</p>
                                              </div>
                                              
                                              <div class="infoCol">
                                                  <p id="profession">  </p>
                                              </div>
                                          </div>
                                          
                                          <!-- Economic Activity -->
                                          <div class="row-tabCnt ">
                                              <div class="validCol">
                                                  <i class='far fa-check-circle' id="economicActNatValid"></i>
                                                  <i class='far fa-pause-circle' id="economicActNatPending"></i>
                                                  <i class='far fa-times-circle' id="economicActNatRejected"></i>
                                              </div>
                                              
                                              <div class="fieldCol">
                                                  <p>Actividad Económica</p>
                                              </div>
                                              
                                              <div class="infoCol">
                                                  <p id="economicActNat">
                                                            
                                                  </p>
                                                  <select disabled id="economic" name="economic" style="display:none">
                                                        <option value="" class="poppins-medium" selected></option>
                                                        <option class="poppins-medium" value="1">Banca, Finanzas y Seguros</option>
                                                        <option class="poppins-medium" value="2">Comercio</option>
                                                        <option class="poppins-medium" value="3">Construcción / Inmobiliario / Bienes Raices</option>
                                                        <option class="poppins-medium" value="4">Diversión y Esparcimiento</option>
                                                        <option class="poppins-medium" value="5">Educación / Instrucción</option>
                                                        <option class="poppins-medium" value="6">Electrico / Gas / Agua</option>
                                                        <option class="poppins-medium" value="7">Estado / Gobierno / Publico</option>
                                                        <option class="poppins-medium" value="8">Hotel y Turismo</option>
                                                        <option class="poppins-medium" value="9">Industrias Manufactureras (Excluye Petroleo)</option>
                                                        <option class="poppins-medium" value="10">Medios de Comunicaciones / Telecomunicaciones</option>
                                                        <option class="poppins-medium" value="11">Mineria / Petroleo</option>
                                                        <option class="poppins-medium" value="12">Salud / Servicios Medicos y Hospitalarios</option>
                                                        <option class="poppins-medium" value="13">Servicios Comunales / Sociales</option>
                                                        <option class="poppins-medium" value="14">Servicios de Asesorias / Consultorias</option>
                                                        <option class="poppins-medium" value="15">Servicios Personales / Servicios del Hogar</option>
                                                        <option class="poppins-medium" value="16">Transporte y Almacenamiento</option>
                                                    </select>  
                                              </div>
                                          </div>
                                          
                                          <!-- Dealer Independent -->
                                          <div class="row-tabCnt" >
                                              <div class="validCol">
                                                  <i class='far fa-check-circle' id="dealerIndValid"></i>
                                                  <i class='far fa-pause-circle' id="dealerIndPending"></i>
                                                  <i class='far fa-times-circle' id="dealerIndRejected"></i>
                                              </div>
                                              
                                              <div class="fieldCol">
                                                  <p>Comerciante Independiente</p>
                                              </div>
                                              
                                              <div class="infoCol">
                                                  <p id="dealerInd">  </p>
                                              </div>
                                          </div>
                                          
                                          <!-- Ocupation -->
                                          <div class="row-tabCnt ">
                                              <div class="validCol">
                                                  <i class='far fa-check-circle' id="ocupationNatValid"></i>
                                                  <i class='far fa-pause-circle' id="ocupationNatPending"></i>
                                                  <i class='far fa-times-circle' id="ocupationNatRejected"></i>
                                              </div>
                                              
                                              <div class="fieldCol">
                                                  <p>Ocupación</p>
                                              </div>
                                              
                                              <div class="infoCol">
                                                  <p id="ocupationNat">  </p>
                                              </div>
                                          </div>
                                          
                                          <!-- Company -->
                                          <div class="row-tabCnt" >
                                              <div class="validCol">
                                                  <i class='far fa-check-circle' id="companyNatValid"></i>
                                                  <i class='far fa-pause-circle' id="companyNatPending"></i>
                                                  <i class='far fa-times-circle' id="companyNatRejected"></i>
                                              </div>
                                              
                                              <div class="fieldCol">
                                                  <p>Empresa</p>
                                              </div>
                                              
                                              <div class="infoCol">
                                                  <p id="companyNat">  </p>
                                              </div>
                                          </div>
                                          
                                          <!-- Anual Income -->
                                          <div class="row-tabCnt" >
                                              <div class="validCol">
                                                  <i class='far fa-check-circle' id="anualIncomeNatValid"></i>
                                                  <i class='far fa-pause-circle' id="anualIncomeNatPending"></i>
                                                  <i class='far fa-times-circle' id="anualIncomeNatRejected"></i>
                                              </div>
                                              
                                              <div class="fieldCol">
                                                  <p>Ingreso Anual ($)</p>
                                              </div>
                                              
                                              <div class="infoCol">
                                                  <p id="anualIncomeNat">  </p>
                                              </div>
                                          </div>
                                          
                                          <!-- Worth -->
                                          <div class="row-tabCnt">
                                              <div class="validCol">
                                                  <i class='far fa-check-circle' id="worthNatValid"></i>
                                                  <i class='far fa-pause-circle' id="worthNatPending"></i>
                                                  <i class='far fa-times-circle' id="worthNatRejected"></i>
                                              </div>
                                              
                                              <div class="fieldCol">
                                                  <p>Patrimonio ($)</p>
                                              </div>
                                              
                                              <div class="infoCol">
                                                  <p id="worthNat">  </p>
                                              </div>
                                          </div>
                                          
                                          <!-- Politically Exposed Person  -->
                                          <div class="row-tabCnt" >
                                              <div class="validCol">
                                                  <i class='fas fa-check-circle' id="personExposedNatValid"></i>
                                                  <i class='far fa-pause-circle' id="personExposedNatPending"></i>
                                                  <i class='far fa-times-circle' id="personExposedNatRejected"></i>
                                              </div>
                                              
                                              <div class="fieldCol">
                                                  <p>Persona Políticamente Expuesta</p>
                                              </div>
                                              
                                              <div class="infoCol">
                                                  <p id="personExposedNat">  </p>
                                              </div>
                                          </div>
                                          
                                          <!-- Name of the affiliation entity -->
                                          <div class="row-tabCnt personExposedNat">
                                              <div class="validCol">
                                                  <i class='fas fa-check-circle' id="nameEntityNatValid"></i>
                                                  <i class='far fa-pause-circle' id="nameEntityNatPending"></i>
                                                  <i class='far fa-times-circle' id="nameEntityNatRejected"></i>
                                              </div>
                                              
                                              <div class="fieldCol">
                                                  <p>Nombre del ente de adscripción</p>
                                              </div>
                                              
                                              <div class="infoCol">
                                                  <p id="nameEntityNat">  </p>
                                              </div>
                                          </div>
                                          
                                          <!-- Job that performs  -->
                                          <div class="row-tabCnt personExposedNat" >
                                              <div class="validCol">
                                                  <i class='fas fa-check-circle' id="jobPerformsNatValid"></i>
                                                  <i class='far fa-pause-circle' id="jobPerformsNatPending"></i>
                                                  <i class='far fa-times-circle' id="jobPerformsNatRejected"></i>
                                              </div>
                                              
                                              <div class="fieldCol">
                                                  <p>Cargo que desempeña</p>
                                              </div>
                                              
                                              <div class="infoCol">
                                                  <p id="jobPerformsNat">  </p>
                                              </div>
                                          </div>
                                          
                                          <!-- Country -->
                                          <div class="row-tabCnt personExposedNat">
                                              <div class="validCol">
                                                  <i class='fas fa-check-circle' id="countryPersonExposedNatValid"></i>
                                                  <i class='far fa-pause-circle' id="countryPersonExposedNatPending"></i>
                                                  <i class='far fa-times-circle' id="countryPersonExposedNatRejected"></i>
                                              </div>
                                              
                                              <div class="fieldCol">
                                                  <p>País</p>
                                              </div>
                                              
                                              <div class="infoCol">
                                                  <p id="countryPersonExposedNat">  </p>
                                              </div>
                                          </div>
                                          
                                          <!-- Identification of the related  -->
                                          <div class="row-tabCnt personExposedNat" >
                                              <div class="validCol">
                                                  <i class='fas fa-check-circle' id="identificationPersonExposedNatValid"></i>
                                                  <i class='far fa-pause-circle' id="identificationPersonExposedNatPending"></i>
                                                  <i class='far fa-times-circle' id="identificationPersonExposedNatRejected"></i>
                                              </div>
                                              
                                              <div class="fieldCol">
                                                  <p>Identificación del relacionado</p>
                                              </div>
                                              
                                              <div class="infoCol">
                                                  <p id="identificationPersonExposedNat">  </p>
                                              </div>
                                          </div>
                                    </div>
                                </div>
                                <div class="tabcntCell cellLevels">
                                    <div class="drawLevelLines">
                                            
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                <!-- /Profesional Data -->  
                
                <!-- Support Image -->
                    <div id="support-images" class="tabcontent tabcontentNatural" style="width: 100%">
                        <div class="tblSect">
                            <div class="row-tabCnt rowCurrencie">
                                  <div style="width: 20%; display: table-cell">
                                      <p style="font-weight: bold; font-size: 93%">Estatus</p>
                                  </div>
                                  
                                  <div style="width: 70%; display: table-cell; text-align: left">
                                      <p style="font-weight: bold; font-size: 93%" >Documento</p>
                                  </div>
                                  
                                  <div style="width: 10%; display: table-cell">
                                      
                                  </div>
                              </div>
                            <div class="tabcntCell cellLevels">
                                <div class="row-tabCntX rowCurrencie" >
                                    <div style="width: 33.3333%; display: table-cell;text-align:center">
                                        <p style="font-weight: bold; font-size: 93%">N1</p>
                                    </div>
                                     
                                    <div style="width: 33.3333%; display: table-cell; text-align: center">
                                        <p style="font-weight: bold; font-size: 93%" >N2</p>
                                    </div>
                                      
                                    <div style="width: 33.3333%; display: table-cell; text-align: center">
                                        <p style="font-weight: bold; font-size: 93%" >N3</p>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="scrollBox">
                            <div class="tblSect">
                                <div class="tabcntCell">
                                    <div class=""></div>
                                </div>
                                <div class="tabcntCell cellLevels">
                                    <div class="drawLevelLines">
                                            
                                    </div>
                                </div>
                            </div>
                        </div>
                        
                    </div>
                <!-- /Support Image -->    
                
                <!-- Transaction Data -->
                    <div id="transaction-data" class="tabcontent tabcontentNatural">
                        <div class="tblSect">
                            <div class="tabcntCell">
                                <div class="row-tabCnt rowCurrencie" >
                                  <div style="width: 20%; display: table-cell">
                                      <p style="font-weight: bold; font-size: 93%">Estatus</p>
                                  </div>
                                  
                                  <div style="width: 40%; display: table-cell; text-align: left">
                                      <p style="font-weight: bold; font-size: 93%" >Campo</p>
                                  </div>
                                  
                                  <div style="width: 40%; display: table-cell; text-align: left">
                                      <p style="font-weight: bold; font-size: 93%" >Información</p>
                                  </div>
                                </div>
                            </div>
                            <div class="tabcntCell cellLevels">
                                <div class="row-tabCntX rowCurrencie" >
                                    <div style="width: 33.3333%; display: table-cell;text-align:center">
                                        <p style="font-weight: bold; font-size: 93%">N1</p>
                                    </div>
                                     
                                    <div style="width: 33.3333%; display: table-cell; text-align: center">
                                        <p style="font-weight: bold; font-size: 93%" >N2</p>
                                    </div>
                                      
                                    <div style="width: 33.3333%; display: table-cell; text-align: center">
                                        <p style="font-weight: bold; font-size: 93%" >N3</p>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="scrollBox">
                            <div class="tblSect">
                                <div class="tabcntCell">
                                    <div class="">
                                        <!-- Operations Average by month -->
                                        <div class="row-tabCnt">
                                              <div class="validCol">
                                                  <i class='far fa-check-circle' id="averageMonthActNatValid"></i>
                                                  <i class='far fa-pause-circle' id="averageMonthActNatPending"></i>
                                                  <i class='far fa-times-circle' id="averageMonthActNatRejected"></i>
                                              </div>
                                              
                                              <div class="fieldCol">
                                                  <p>Cantidad de transacciones promedio mensual de depósitos y retiros</p>
                                              </div>
                                              
                                              <div class="infoCol">
                                                  <p id="averageMonthActNat">  </p>
                                              </div>
                                          </div>
                                        <!-- Mount $ of operations -->
                                        <div class="row-tabCnt rowImpar" >
                                              <div class="validCol">
                                                  <i class='far fa-check-circle' id="mountOpNatValid"></i>
                                                  <i class='far fa-pause-circle' id="mountOpNatPending"></i>
                                                  <i class='far fa-times-circle' id="mountOpNatRejected"></i>
                                              </div>
                                              
                                              <div class="fieldCol">
                                                  <p>Volumen promedio mensual en US$</p>
                                              </div>
                                              
                                              <div class="infoCol">
                                                  <p id="mountOpNat">  </p>
                                              </div>
                                          </div>
                                        <!-- type operations -->
                                        <div class="row-tabCnt">
                                              <div class="validCol">
                                                  <i class='far fa-check-circle' id="typeOpNatValid"></i>
                                                  <i class='far fa-pause-circle' id="typeOpNatPending"></i>
                                                  <i class='far fa-times-circle' id="typeOpNatRejected"></i>
                                              </div>
                                              
                                              <div class="fieldCol">
                                                  <p> Tipo de Operación que estima realizar </p>
                                              </div>
                                              
                                              <div class="infoCol">
                                                  <p id="typeOpNat">  </p>
                                              </div>
                                          </div>
                                        <!-- Relationship with economic group -->
                                        <div class="row-tabCnt rowImpar">
                                              <div class="validCol">
                                                  <i class='far fa-check-circle' id="relationGruopNatValid"></i>
                                                  <i class='far fa-pause-circle' id="relationGruopNatPending"></i>
                                                  <i class='far fa-times-circle' id="relationGruopNatRejected"></i>
                                              </div>
                                              
                                              <div class="fieldCol">
                                                  <p> ¿Posee relación con algún grupo económico? </p>
                                              </div>
                                              
                                              <div class="infoCol">
                                                  <p id="relationGruopNat">  </p>
                                              </div>
                                          </div>
                                    </div>
                                </div>
                                <div class="tabcntCell cellLevels">
                                    <div class="drawLevelLines">
                                    </div>
                                </div>
                            </div>
                        </div>
    
                    </div>
                <!-- /Transaction Data-->
                
                <!-- Retirement Accounts -->
                    <div id="retirement-accounts" class="tabcontent tabcontentNatural">
                        <div class="tabcntCell">
                            <div class="row-tabCnt rowCurrencie" >
                                  <div style="width: 20%; display: table-cell">
                                      <p style="font-weight: bold; font-size: 93%">Estatus</p>
                                  </div>
                                  
                                  <div style="width: 30%; display: table-cell; text-align: left">
                                      <p style="font-weight: bold; font-size: 93%" >Cuenta</p>
                                  </div>
                                  
                                  <div style="width: 20%; display: table-cell; text-align: left">
                                      <p style="font-weight: bold; font-size: 93%" >Detalles</p>
                                  </div>
                                  
                                  <div style="width: 30%; display: table-cell; text-align: left">
                                      <p style="font-weight: bold; font-size: 93%" >Información</p>
                                  </div>
                              </div>
                            <div class="scrollBox"></div>
                        </div>
                    </div>
                <!-- /Retirement Accounts--> 
                
                <!-- Declaration -->
                    <div id="declaration-natural" class="tabcontent tabcontentNatural">
                            <div class="tblSect">
                                <div class="tabcntCell">
                                    <div class="row-tabCnt rowCurrencie" >
                                      <div style="width: 20%; display: table-cell">
                                          <p style="font-weight: bold; font-size: 93%">Estatus</p>
                                      </div>
                                      
                                      <div style="width: 40%; display: table-cell; text-align: left">
                                          <p style="font-weight: bold; font-size: 93%" >Campo</p>
                                      </div>
                                      
                                      <div style="width: 40%; display: table-cell; text-align: left">
                                          <p style="font-weight: bold; font-size: 93%" >Información</p>
                                      </div>
                                  </div>
                                </div>
                                <div class="tabcntCell cellLevels">
                                    <div class="row-tabCntX rowCurrencie" >
                                        <div style="width: 33.3333%; display: table-cell;text-align:center">
                                            <p style="font-weight: bold; font-size: 93%">N1</p>
                                        </div>
                                         
                                        <div style="width: 33.3333%; display: table-cell; text-align: center">
                                            <p style="font-weight: bold; font-size: 93%" >N2</p>
                                        </div>
                                          
                                        <div style="width: 33.3333%; display: table-cell; text-align: center">
                                            <p style="font-weight: bold; font-size: 93%" >N3</p>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="tblSect">
                                <div class="tabcntCell">
                                    <div class="scrollBox">
                                   <div class="row-tabCnt">
                                      <div class="validColX">
                                          <i class='far fa-check-circle' id="declarationNatValid"></i>
                                          <i class='fas fa-pause-circle' id="declarationNatPending"></i>
                                          <i class='far fa-times-circle' id="declarationNatRejected"></i>
                                      </div>
                                      
                                      <div class="fieldCol">
                                          <p>Declaración Jurada</p>
                                      </div>
                                      
                                      <div class="infoCol">
                                          <p id="declarationNat">   </p>
                                      </div>
                                  </div>
                                  <div class="row-tabCnt">
                                      <div class="validColX">
                                          <i class='far fa-check-circle' id="termsNatValid"></i>
                                          <i class='fas fa-pause-circle' id="termsNatPending"></i>
                                          <i class='far fa-times-circle' id="termsNatRejected"></i>
                                      </div>
                                      
                                      <div class="fieldCol">
                                          <p>Términos y Condiciones</p>
                                      </div>
                                      
                                      <div class="infoCol">
                                          <p id="termsNat">   </p>
                                      </div>
                                  </div>
                                </div>
                                </div>
                                <div class="tabcntCell cellLevels">
                                    <div class="drawLevelLines">
                                            
                                    </div>
                                </div>
                            </div>
                            
                        </div>
                      
                    </div>
                <!--/Declaración Jurada --> 
            
            <div class="footerModal" align="center">
                <button class="buttonModal" id="buttonAceptModalNatural" align="center"> GUARDAR </button>
            </div>
        </div>
    </div>
</div>

<!------------------------------------------------------- Modal Details Legal Person ---------------------------------------------------------------------->
<div id="modalDetailLegal" class="modal">
    <div class="modalCellAlign">
        
        <!-- Modal content -->
        <div class="modal-content-detail" style="width: 900px;">
        <div style="display:none" class="headerModal" > 
            <span></span>
            <span class="closeModal" id="closeModalDetailLegal">&times;</span>
            
        </div>
        
        <div class="bodyModal" style="padding: 0px">
            
            <p class="titleModalDetail" > Detalle <span id="nameCompanyDetail">  </span> </p>
            
            <div class="tab">
                <div>
                    <button class="tablinksLegal" data-name="status-legal"> Estatus </button> 
                </div>
                
                <div>
                    <button class="tablinksLegal" data-name="basic-data-legal" >Datos Básicos</button>      
                </div>
                
                <div>
                    <button class="tablinksLegal" data-name="partner-data"> Datos de Socios </button>      
                </div>
                
                <div>
                    <button class="tablinksLegal" data-name="direction-company"> Dirección de Empresa </button>      
                </div>
    
                <div>
                    <button class="tablinksLegal" data-name="professional-info-legal" > Información Profesional </button>      
                </div>
                
                <div>
                    <button class="tablinksLegal" data-name="images-data-legal" > Imágenes de Datos </button>      
                </div>
                
                <div>
                    <button class="tablinksLegal" data-name="transaction-data-legal" > Datos Transaccionales </button>    
                </div>
                
                <div>
                    <button class="tablinksLegal" data-name="accounts-legal"> Cuentas </button> 
                </div>
              
                <div>
                    <button class="tablinksLegal" data-name="declaration" > Declaración Jurada </button>
                </div>
            </div>
            <!-- Status -->      
                <div id="status-legal" class="tabcontent tabcontentLegal">
                    <div class="scrollBox" style="width:90%;margin-left:auto;margin-right:auto;height: 270px;">
                        <div class="row-tabCnt">
                            <div class="cell-tabcnt1">
                                <div style="display: flex; flex-direction: row; justify-content: flex:start; align-items: center; padding: 10px 0px">
                                    <p style="padding-right: 10px;" class="fontStatusSection"> Estatus </p> 
                                    <div class="">
                                        <div class="switchCont">
                                            <div class="switch active" id="swichtStatusLegal">
                                                <div class="switchBal balActive"></div>
                                            </div>
                                        </div>
                                    </div>
                                  </div>
                            </div>
                        </div>
                        
                        <div class="row-tabCnt">
                            <div style="display: flex; flex-direction: row; align-items: center; justify-content: start; text-align: left">
                                <div style="padding-right: 10px">
                                    <label for="level" class="fontStatusSection"> Nivel </label>
                                    <div class="inputContainer" style="padding-left: 0">
                                        <select class="inputElement selectOrderBy" id="levelLegal" name="level" title="Nivel" style="border: none; width: 220px;"> 
                                            
                                        </select>
                                        <div class="iconContainerArrow" style="right: 10px">
                                            <i class="fas fa-caret-down" id="arrowOrderBy"></i>
                                        </div>
                                    </div>
                                    <p class="msgError" style="display: none" id="errorLevelLegal"> Error al cargar niveles </p>
                                </div>
                                
                                <div>
                                    <label for="riskLevel" class="fontStatusSection"> Nivel de Riesgo </label>
                                    <div class="inputContainer" style="padding-left: 0">
                                        <select class="inputElement selectOrderBy" id="riskLevelLegal" name="riskLevel" title="Nivel de Riesgo" style="border: none; width: 220px;"> 
                                            <option value="0">Bajo</option>
                                            <option value="1">Moderado</option>
                                            <option value="2">Alto</option>
                                        </select>
                                        <div class="iconContainerArrow" style="right: 10px">
                                            <i class="fas fa-caret-down" id="arrowOrderBy"></i>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                        
                        <div class="row-tabCnt">
                            <div class="cell-tabcnt2" style="width: 90%;">
                                <div class="contenCell">
                                    <label class="fontStatusSection"> Atributos Adicionales </label>
                                    <div class="groupAdd groupTagLegal" id="groupTagLegal">
                                        <input id="tagLegal" type="tags" style="outline: none; border: none"> 
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                        
                </div>
            <!-- /Status -->
            
            <!-- Basic Data -->   
                <div id="basic-data-legal" class="tabcontent tabcontentLegal" style="width: 100%;">
                        <div class="tblSect">
                            <div class="tabcntCell">
                                <div class="row-tabCnt rowCurrencie" >
                                  <div style="width: 20%; display: table-cell">
                                      <p style="font-weight: bold; font-size: 93%">Estatus</p>
                                  </div>
                                  
                                  <div style="width: 40%; display: table-cell; text-align: left">
                                      <p style="font-weight: bold; font-size: 93%" >Campo</p>
                                  </div>
                                  
                                  <div style="width: 40%; display: table-cell; text-align: left">
                                      <p style="font-weight: bold; font-size: 93%" >Información</p>
                                  </div>
                                </div>
                            </div>
                            <div class="tabcntCell cellLevels">
                                <div class="row-tabCntX rowCurrencie" >
                                    <div style="width: 33.3333%; display: table-cell;text-align:center">
                                        <p style="font-weight: bold; font-size: 93%">N1</p>
                                    </div>
                                     
                                    <div style="width: 33.3333%; display: table-cell; text-align: center">
                                        <p style="font-weight: bold; font-size: 93%" >N2</p>
                                    </div>
                                      
                                    <div style="width: 33.3333%; display: table-cell; text-align: center">
                                        <p style="font-weight: bold; font-size: 93%" >N3</p>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="scrollBox">
                            <div class="tblSect">
                                <div class="tabcntCell">
                                    <div class="">
                                      <!-- Venezuelan -->
                                      <div class="row-tabCnt">
                                          <div class="validCol">
                                              <i class='far fa-check-circle' id="venezuelanLegalValid"></i>
                                              <i class='far fa-pause-circle' id="venezuelanLegalPending"></i>
                                              <i class='far fa-times-circle' id="venezuelanLegalRejected"></i>
                                          </div>
                                          
                                          <div class="fieldCol">
                                              <p>¿Es Venezolano?</p>
                                          </div>
                                          
                                          <div class="infoCol">
                                              <p id="venezuelanLegal">  </p>
                                          </div>
                                      </div>
                                      <!-- type company -->
                                      <div class="row-tabCnt rowImpar" >
                                          <div class="validCol">
                                              <i class='far fa-check-circle' id="typeCompanyValid"></i>
                                              <i class='far fa-pause-circle' id="typeCompanyPending"></i>
                                              <i class='far fa-times-circle' id="typeCompanyRejected"></i>
                                          </div>
                                          
                                          <div class="fieldCol">
                                              <p>Tipo de Compañía</p>
                                          </div>
                                          
                                          <div class="infoCol">
                                              <p id="typeCompany">  </p>
                                          </div>
                                      </div>
                                      <!-- number id -->
                                      <div class="row-tabCnt">
                                          <div class="validCol">
                                              <i class='far fa-check-circle' id="identificationLegalValid"></i>
                                              <i class='far fa-pause-circle' id="identificationLegalPending"></i>
                                              <i class='far fa-times-circle' id="identificationLegalRejected"></i>
                                          </div>
                                          
                                          <div class="fieldCol">
                                              <p>Número de Identificación</p>
                                          </div>
                                          
                                          <div class="infoCol">
                                              <p id="identificationLegal">  </p>
                                          </div>
                                      </div>
                                      <!-- reason social -->
                                      <div class="row-tabCnt rowImpar" >
                                          <div class="validCol">
                                              <i class='far fa-check-circle' id="reasonSocialValid"></i>
                                              <i class='far fa-pause-circle' id="reasonSocialPending"></i>
                                              <i class='far fa-times-circle' id="reasonSocialRejected"></i>
                                          </div>
                                          
                                          <div class="fieldCol">
                                              <p> Razón Social </p>
                                          </div>
                                          
                                          <div class="infoCol">
                                              <p id="reasonSocial">  </p>
                                          </div>
                                      </div>
                                      <!-- initiales or name comapny -->
                                      <div class="row-tabCnt">
                                          <div class="validCol">
                                              <i class='far fa-check-circle' id="comercialNameValid"></i>
                                              <i class='far fa-pause-circle' id="comercialNamePending"></i>
                                              <i class='far fa-times-circle' id="comercialNameRejected"></i>
                                          </div>
                                          
                                          <div class="fieldCol">
                                              <p>Siglas/Nombre Comercial</p>
                                          </div>
                                          
                                          <div class="infoCol">
                                              <p id="comercialName">  </p>
                                          </div>
                                      </div>
                                      <!-- date create dateCreateCompany-->
                                      <div class="row-tabCnt rowImpar">
                                          <div class="validCol">
                                              <i class='far fa-check-circle' id="dateCreateCompanyValid"></i>
                                              <i class='far fa-pause-circle' id="dateCreateCompanyPending"></i>
                                              <i class='far fa-times-circle' id="dateCreateCompanyRejected"></i>
                                          </div>
                                          
                                          <div class="fieldCol">
                                              <p>Fecha de Creación</p>
                                          </div>
                                          
                                          <div class="infoCol">
                                              <p id="dateCreateCompany">  </p>
                                          </div>
                                      </div>
                                      <!-- country -->
                                      <div class="row-tabCnt">
                                          <div class="validCol">
                                              <i class='far fa-check-circle' id="countryCompanyValid"></i>
                                              <i class='far fa-pause-circle' id="countryCompanyPending"></i>
                                              <i class='far fa-times-circle' id="countryCompanyRejected"></i>
                                          </div>
                                          
                                          <div class="fieldCol">
                                              <p>País de Registro</p>
                                          </div>
                                          
                                          <div class="infoCol">
                                              <p id="countryCompany">  </p>
                                          </div>
                                      </div>
                                      <!-- state -->
                                      <div class="row-tabCnt rowImpar">
                                          <div class="validCol">
                                              <i class='far fa-check-circle' id="stateCompanyValid"></i>
                                              <i class='far fa-pause-circle' id="stateCompanyPending"></i>
                                              <i class='far fa-times-circle' id="stateCompanyRejected"></i>
                                          </div>
                                          
                                          <div class="fieldCol">
                                              <p>Estado de Registro</p>
                                          </div>
                                          
                                          <div class="infoCol">
                                              <p id="stateCompany">  </p>
                                          </div>
                                      </div>
                                      <!-- city -->
                                      <div class="row-tabCnt">
                                          <div class="validCol">
                                              <i class='far fa-check-circle' id="cityCompanyValid"></i>
                                              <i class='far fa-pause-circle' id="cityCompanyPending"></i>
                                              <i class='far fa-times-circle' id="cityCompanyRejected"></i>
                                          </div>
                                          
                                          <div class="fieldCol">
                                              <p>Ciudad de Registro</p>
                                          </div>
                                          
                                          <div class="infoCol">
                                              <p id="cityCompany">  </p>
                                          </div>
                                      </div>
                                      <!-- cod postal -->
                                      <div class="row-tabCnt rowImpar">
                                          <div class="validCol">
                                              <i class='far fa-check-circle' id="codePostalValid"></i>
                                              <i class='far fa-pause-circle' id="codePostalPending"></i>
                                              <i class='far fa-times-circle' id="codePostalRejected"></i>
                                          </div>
                                          
                                          <div class="fieldCol">
                                              <p>Código Postal</p>
                                          </div>
                                          
                                          <div class="infoCol">
                                              <p id="codePostal">  </p>
                                          </div>
                                      </div>
                                      <!-- number phone -->
                                      <div class="row-tabCnt">
                                          <div class="validCol">
                                              <i class='far fa-check-circle' id="phoneLegalValid"></i>
                                              <i class='far fa-pause-circle' id="phoneLegalPending"></i>
                                              <i class='far fa-times-circle' id="phoneLegalRejected"></i>
                                          </div>
                                          
                                          <div class="fieldCol">
                                              <p>Teléfono</p>
                                          </div>
                                          
                                          <div class="infoCol">
                                              <p id="phoneLegal">  </p>
                                          </div>
                                      </div>
                                      <!-- url web -->
                                      <div class="row-tabCnt rowImpar">
                                          <div class="validCol">
                                              <i class='far fa-check-circle' id="webSiteValid"></i>
                                              <i class='far fa-pause-circle' id="webSitePending"></i>
                                              <i class='far fa-times-circle' id="webSiteRejected"></i>
                                          </div>
                                          
                                          <div class="fieldCol">
                                              <p>Sitio Web</p>
                                          </div>
                                          
                                          <div class="infoCol">
                                              <p id="webSite">  </p>
                                          </div>
                                      </div>
                                      <!-- number partners -->
                                      <div class="row-tabCnt">
                                          <div class="validCol">
                                              <i class='far fa-check-circle' id="numberPartnersValid"></i>
                                              <i class='far fa-pause-circle' id="numberPartnersPending"></i>
                                              <i class='far fa-times-circle' id="numberPartnersRejected"></i>
                                          </div>
                                          
                                          <div class="fieldCol">
                                              <p>Número de Socios</p>
                                          </div>
                                          
                                          <div class="infoCol">
                                              <p id="numberPartners">  </p>
                                          </div>
                                      </div>
                                </div>
                                </div>
                                <div class="tabcntCell cellLevels">
                                    <div class="drawLevelLines">
                                            
                                    </div>
                                </div>
                            </div>
                        </div>
                </div>
            <!-- /Basic Data -->   
            
            <!-- Partner Data -->
                <div id="partner-data" class="tabcontent tabcontentLegal">
                    <div class="tblSect">
                        <div class="row-tabCnt rowCurrencie">
                            <div style="width: 20%; display: table-cell">
                                <p style="font-weight: bold; font-size: 93%">Estatus</p>
                            </div>
                                  
                            <div style="width: 40%; display: table-cell; text-align: left">
                                <p style="font-weight: bold; font-size: 93%" >Campo</p>
                            </div>
                                  
                            <div style="width: 40%; display: table-cell;text-align: left">
                                <p style="font-weight: bold; font-size: 93%">Información</p>
                            </div>
                        </div>
                        <div class="tabcntCell cellLevels">
                            <div class="row-tabCntX rowCurrencie" >
                                    <div style="width: 33.3333%; display: table-cell;text-align:center">
                                        <p style="font-weight: bold; font-size: 93%">N1</p>
                                    </div>
                                     
                                    <div style="width: 33.3333%; display: table-cell; text-align: center">
                                        <p style="font-weight: bold; font-size: 93%" >N2</p>
                                    </div>
                                      
                                    <div style="width: 33.3333%; display: table-cell; text-align: center">
                                        <p style="font-weight: bold; font-size: 93%" >N3</p>
                                    </div>
                            </div>
                        </div>
                    </div>
                    <div class="scrollBox">
                        <div class="tblSect">
                                <div class="tabcntCell">
                                    <div class=""></div>
                                </div>
                                <div class="tabcntCell cellLevels">
                                    <div class="drawLevelLines">
                                            
                                    </div>
                                </div>
                            </div>
                    </div>
                  <!-- Name representative legal 
                  
                    <div class="tabcntCell">
                        <div class="row-tabCnt rowCurrencie" >
                            <div style="width: 20%; display: table-cell">
                              <p style="font-weight: bold; font-size: 93%">Estatus</p>
                            </div>
                            
                            <div style="width: 30%; display: table-cell; text-align: left">
                              <p style="font-weight: bold; font-size: 93%" >Campo</p>
                            </div>
                            
                            <div style="width: 50%; display: table-cell; text-align: left">
                              <p style="font-weight: bold; font-size: 93%" >Información</p>
                            </div>
                        </div>
                        <div class="scrollBox"></div>
                    </div>
                  <div class="row-tabCnt">
                      <div class="validCol">
                          <i class='fas fa-check-circle' id="legalRepresentativeValid"></i>
                          <i class='far fa-pause-circle' id="legalRepresentativePending"></i>
                          <i class='far fa-times-circle' id="legalRepresentativeRejected"></i>
                      </div>
                      
                      <div class="fieldCol">
                          <p>Nombre Representante Legal</p>
                      </div>
                      
                      <div class="infoCol">
                          <p id="legalRepresentative">  </p>
                      </div>
                  </div>
                  
                  <!-- identification representative legal --
                  <div class="row-tabCnt rowImpar" >
                      <div class="validCol">
                          <i class='fas fa-check-circle' id="identificationRepresentativeValid"></i>
                          <i class='far fa-pause-circle' id="identificationRepresentativePending"></i>
                          <i class='far fa-times-circle' id="identificationRepresentativeRejected"></i>
                      </div>
                      
                      <div class="fieldCol">
                          <p>Cédula Representante Legal</p>
                      </div>
                      
                      <div class="infoCol">
                          <p id="identificationRepresentative">  </p>
                      </div>
                  </div>
                  
                  <!-- Phone representative legal --
                  <div class="row-tabCnt">
                      <div class="validCol">
                          <i class='fas fa-check-circle' id="phoneRepresentativeValid"></i>
                          <i class='far fa-pause-circle' id="phoneRepresentativePending"></i>
                          <i class='far fa-times-circle' id="phoneRepresentativeRejected"></i>
                      </div>
                      
                      <div class="fieldCol">
                          <p>Teléfono Representante Legal</p>
                      </div>
                      
                      <div class="infoCol">
                          <p id="phoneRepresentative">  </p>
                      </div>
                  </div>
                  
                  <!-- Politically Exposed Person  --
                  <div class="row-tabCnt rowImpar" >
                      <div class="validCol">
                          <i class='fas fa-check-circle' id="personExposedValid"></i>
                          <i class='far fa-pause-circle' id="personExposedPending"></i>
                          <i class='far fa-times-circle' id="personExposedRejected"></i>
                      </div>
                      
                      <div class="fieldCol">
                          <p>Persona Politicamente Expuesta</p>
                      </div>
                      
                      <div class="infoCol">
                          <p id="personExposed">  </p>
                      </div>
                  </div>
                  
                  <!-- Name of the affiliation entity --
                  <div class="row-tabCnt repesentativeExposed">
                      <div class="validCol">
                          <i class='fas fa-check-circle' id="nameEntityValid"></i>
                          <i class='far fa-pause-circle' id="nameEntityPending"></i>
                          <i class='far fa-times-circle' id="nameEntityRejected"></i>
                      </div>
                      
                      <div class="fieldCol">
                          <p>Nombre del ente de adscripción</p>
                      </div>
                      
                      <div class="infoCol">
                          <p id="nameEntity">  </p>
                      </div>
                  </div>
                  
                  <!-- Job that performs  --
                  <div class="row-tabCnt rowImpar repesentativeExposed" >
                      <div class="validCol">
                          <i class='fas fa-check-circle' id="jobPerformsValid"></i>
                          <i class='far fa-pause-circle' id="jobPerformsPending"></i>
                          <i class='far fa-times-circle' id="jobPerformsRejected"></i>
                      </div>
                      
                      <div class="fieldCol">
                          <p>Cargo que desempeña</p>
                      </div>
                      
                      <div class="infoCol">
                          <p id="jobPerforms">  </p>
                      </div>
                  </div>
                  
                  <!-- Country --
                  <div class="row-tabCnt repesentativeExposed">
                      <div class="validCol">
                          <i class='fas fa-check-circle' id="countryPersonExposedValid"></i>
                          <i class='far fa-pause-circle' id="countryPersonExposedPending"></i>
                          <i class='far fa-times-circle' id="countryPersonExposedRejected"></i>
                      </div>
                      
                      <div class="fieldCol">
                          <p>País</p>
                      </div>
                      
                      <div class="infoCol">
                          <p id="countryPersonExposed">  </p>
                      </div>
                  </div>
                  
                  <!-- Identification of the related  --
                  <div class="row-tabCnt rowImpar repesentativeExposed" >
                      <div class="validCol">
                          <i class='fas fa-check-circle' id="identificationPersonExposedValid"></i>
                          <i class='far fa-pause-circle' id="identificationPersonExposedPending"></i>
                          <i class='far fa-times-circle' id="identificationPersonExposedRejected"></i>
                      </div>
                      
                      <div class="fieldCol">
                          <p>Identificación del relacionado</p>
                      </div>
                      
                      <div class="infoCol">
                          <p id="identificationPersonExposed">  </p>
                      </div>
                  </div>
                  -->
                </div>
            <!-- /Partner Data --> 
            
            <!-- Direction Company -->
                <div id="direction-company" class="tabcontent tabcontentLegal" style="width: 100%;">
                        <div class="tblSect">
                            <div class="tabcntCell">
                                <div class="row-tabCnt rowCurrencie" >
                                  <div style="width: 20%; display: table-cell">
                                      <p style="font-weight: bold; font-size: 93%">Estatus</p>
                                  </div>
                                  
                                  <div style="width: 40%; display: table-cell; text-align: left">
                                      <p style="font-weight: bold; font-size: 93%" >Campo</p>
                                  </div>
                                  
                                  <div style="width: 40%; display: table-cell; text-align: left">
                                      <p style="font-weight: bold; font-size: 93%" >Información</p>
                                  </div>
                                </div>
                            </div>
                            <div class="tabcntCell cellLevels">
                                <div class="row-tabCntX rowCurrencie" >
                                    <div style="width: 33.3333%; display: table-cell;text-align:center">
                                        <p style="font-weight: bold; font-size: 93%">N1</p>
                                    </div>
                                     
                                    <div style="width: 33.3333%; display: table-cell; text-align: center">
                                        <p style="font-weight: bold; font-size: 93%" >N2</p>
                                    </div>
                                      
                                    <div style="width: 33.3333%; display: table-cell; text-align: center">
                                        <p style="font-weight: bold; font-size: 93%" >N3</p>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="scrollBox">
                            <div class="tblSect">
                                <div class="tabcntCell">
                                    <div class="">
                                          <!-- Country Residence -->
                                          <div class="row-tabCnt">
                                              <div class="validCol">
                                                  <i class='far fa-check-circle' id="countryResidenceValid"></i>
                                                  <i class='far fa-pause-circle' id="countryResidencePending"></i>
                                                  <i class='far fa-times-circle' id="countryResidenceRejected"></i>
                                              </div>
                                              
                                              <div class="fieldCol">
                                                  <p>País de Residencia</p>
                                              </div>
                                              
                                              <div class="infoCol">
                                                  <p id="countryResidence">  </p>
                                              </div>
                                          </div>
                                          <!-- State Residence-->
                                          <div class="row-tabCnt rowImpar" >
                                              <div class="validCol">
                                                  <i class='far fa-check-circle' id="stateResidenceValid"></i>
                                                  <i class='far fa-pause-circle' id="stateResidencePending"></i>
                                                  <i class='far fa-times-circle' id="stateResidenceRejected"></i>
                                              </div>
                                              
                                              <div class="fieldCol">
                                                  <p>Estado</p>
                                              </div>
                                              
                                              <div class="infoCol">
                                                  <p id="stateResidence">  </p>
                                              </div>
                                          </div>
                                          <!-- City Residence-->
                                          <div class="row-tabCnt">
                                              <div class="validCol">
                                                  <i class='far fa-check-circle' id="cityResidenceValid"></i>
                                                  <i class='far fa-pause-circle' id="cityResidencePending"></i>
                                                  <i class='far fa-times-circle' id="cityResidenceRejected"></i>
                                              </div>
                                              
                                              <div class="fieldCol">
                                                  <p>Ciudad</p>
                                              </div>
                                              
                                              <div class="infoCol">
                                                  <p id="cityResidence">  </p>
                                              </div>
                                          </div>
                                          <!-- Street Residence -->
                                          <div class="row-tabCnt rowImpar" >
                                              <div class="validCol">
                                                  <i class='far fa-check-circle' id="streetResidenceValid"></i>
                                                  <i class='far fa-pause-circle' id="streetResidencePending"></i>
                                                  <i class='far fa-times-circle' id="streetResidenceRejected"></i>
                                              </div>
                                              
                                              <div class="fieldCol">
                                                  <p> Dirección </p>
                                              </div>
                                              
                                              <div class="infoCol">
                                                  <p id="streetResidence">  </p>
                                              </div>
                                          </div>
                                          <!-- Number house -->
                                          <div class="row-tabCnt">
                                              <div class="validCol">
                                                  <i class='far fa-check-circle' id="houseNumberValid"></i>
                                                  <i class='far fa-pause-circle' id="houseNumberPending"></i>
                                                  <i class='far fa-times-circle' id="houseNumberRejected"></i>
                                              </div>
                                              
                                              <div class="fieldCol">
                                                  <p>Casa/Apartamento Nro.</p>
                                              </div>
                                              
                                              <div class="infoCol">
                                                  <p id="houseNumber">  </p>
                                              </div>
                                          </div>
                                          <!-- branch office -->
                                          <div class="row-tabCnt rowImpar">
                                              <div class="validCol">
                                                  <i class='far fa-check-circle' id="branchOfficeValid"></i>
                                                  <i class='far fa-pause-circle' id="branchOfficePending"></i>
                                                  <i class='far fa-times-circle' id="branchOfficeRejected"></i>
                                              </div>
                                              
                                              <div class="fieldCol">
                                                  <p>Sucursales</p>
                                              </div>
                                              
                                              <div class="infoCol">
                                                  <p id="branchOffice">  </p>
                                              </div>
                                          </div>
                                      </div>
                                </div>
                                <div class="tabcntCell cellLevels">
                                    <div class="drawLevelLines">
                                    </div>
                                </div>
                            </div>
                        </div>
                </div>
            <!-- /Direction Company --> 
            
            <!-- Professional Data -->
                <div id="professional-info-legal" class="tabcontent tabcontentLegal">
                    <div class="tblSect">
                            <div class="tabcntCell">
                                <div class="row-tabCnt rowCurrencie" >
                                  <div style="width: 20%; display: table-cell">
                                      <p style="font-weight: bold; font-size: 93%">Estatus</p>
                                  </div>
                                  
                                  <div style="width: 40%; display: table-cell; text-align: left">
                                      <p style="font-weight: bold; font-size: 93%" >Campo</p>
                                  </div>
                                  
                                  <div style="width: 40%; display: table-cell; text-align: left">
                                      <p style="font-weight: bold; font-size: 93%" >Información</p>
                                  </div>
                                </div>
                            </div>
                            <div class="tabcntCell cellLevels">
                                <div class="row-tabCntX rowCurrencie" >
                                    <div style="width: 33.3333%; display: table-cell;text-align:center">
                                        <p style="font-weight: bold; font-size: 93%">N1</p>
                                    </div>
                                     
                                    <div style="width: 33.3333%; display: table-cell; text-align: center">
                                        <p style="font-weight: bold; font-size: 93%" >N2</p>
                                    </div>
                                      
                                    <div style="width: 33.3333%; display: table-cell; text-align: center">
                                        <p style="font-weight: bold; font-size: 93%" >N3</p>
                                    </div>
                                </div>
                            </div>
                        </div>
                    <div class="scrollBox">
                        <div class="tblSect">
                                <div class="tabcntCell">
                                    <div class="">
                                      <!-- Economic Activity -->
                                      <div class="row-tabCnt rowImpar">
                                          <div class="validCol">
                                              <i class='far fa-check-circle' id="economicActValid"></i>
                                              <i class='far fa-pause-circle' id="economicActPending"></i>
                                              <i class='far fa-times-circle' id="economicActRejected"></i>
                                          </div>
                                          
                                          <div class="fieldCol">
                                              <p>Actividad Económica</p>
                                          </div>
                                          
                                          <div class="infoCol">
                                                <p id="economicAct">  </p>
                                                <select class="form-input poppins-regular" style="display:none" disabled>
                                                    <option value="" class="poppins-medium" selected></option>
                                                    <option class="poppins-medium" value="1">Banca, Finanzas y Seguros</option>
                                                    <option class="poppins-medium" value="2">Comercio</option>
                                                    <option class="poppins-medium" value="3">Construcción / Inmobiliario / Bienes Raices</option>
                                                    <option class="poppins-medium" value="4">Diversión y Esparcimiento</option>
                                                    <option class="poppins-medium" value="5">Educación / Instrucción</option>
                                                    <option class="poppins-medium" value="6">Electrico / Gas / Agua</option>
                                                    <option class="poppins-medium" value="7">Estado / Gobierno / Publico</option>
                                                    <option class="poppins-medium" value="8">Hotel y Turismo</option>
                                                    <option class="poppins-medium" value="9">Industrias Manufactureras (Excluye Petroleo)</option>
                                                    <option class="poppins-medium" value="10">Medios de Comunicaciones / Telecomunicaciones</option>
                                                    <option class="poppins-medium" value="11">Mineria / Petroleo</option>
                                                    <option class="poppins-medium" value="12">Salud / Servicios Medicos y Hospitalarios</option>
                                                    <option class="poppins-medium" value="13">Servicios Comunales / Sociales</option>
                                                    <option class="poppins-medium" value="14">Servicios de Asesorias / Consultorias</option>
                                                    <option class="poppins-medium" value="15">Servicios Personales / Servicios del Hogar</option>
                                                    <option class="poppins-medium" value="16">Transporte y Almacenamiento</option>
                                                </select>
                                          </div>
                                      </div>
                                      
                                      <!-- Politically Exposed Person  -->
                                      <div class="row-tabCnt" >
                                          <div class="validCol">
                                              <i class='fas fa-check-circle' id="personExposedValid"></i>
                                              <i class='far fa-pause-circle' id="personExposedPending"></i>
                                              <i class='far fa-times-circle' id="personExposedRejected"></i>
                                          </div>
                                          
                                          <div class="fieldCol">
                                              <p>Persona Políticamente Expuesta</p>
                                          </div>
                                          
                                          <div class="infoCol">
                                              <p id="personExposed">  </p>
                                          </div>
                                      </div>
                                      
                                      <!-- Anual Income -->
                                      <div class="row-tabCnt rowImpar" >
                                          <div class="validCol">
                                              <i class='far fa-check-circle' id="anualIncomeValid"></i>
                                              <i class='far fa-pause-circle' id="anualIncomePending"></i>
                                              <i class='far fa-times-circle' id="anualIncomeRejected"></i>
                                          </div>
                                          
                                          <div class="fieldCol">
                                              <p>Ingreso Anual ($)</p>
                                          </div>
                                          
                                          <div class="infoCol">
                                              <p id="anualIncome">  </p>
                                          </div>
                                      </div>
                                      
                                      <!-- Worth -->
                                      <div class="row-tabCnt">
                                          <div class="validCol">
                                              <i class='far fa-check-circle' id="worthValid"></i>
                                              <i class='far fa-pause-circle' id="worthPending"></i>
                                              <i class='far fa-times-circle' id="worthRejected"></i>
                                          </div>
                                          
                                          <div class="fieldCol">
                                              <p>Patrimonio ($)</p>
                                          </div>
                                          
                                          <div class="infoCol">
                                              <p id="worth">  </p>
                                          </div>
                                      </div>
                                  </div>
                                </div>
                                <div class="tabcntCell cellLevels">
                                    <div class="drawLevelLines">
                                    </div>
                                </div>
                            </div>
                    </div>
                </div>
            <!-- /Profesional Data -->  
            
            <!-- Support Image -->
                <div id="images-data-legal" class="tabcontent tabcontentLegal" style="width: 100%">
                    <div class="tblSect">
                        <div class="row-tabCnt rowCurrencie">
                                  <div style="width: 20%; display: table-cell">
                                      <p style="font-weight: bold; font-size: 93%">Estatus</p>
                                  </div>
                                  
                                  <div style="width: 70%; display: table-cell; text-align: left">
                                      <p style="font-weight: bold; font-size: 93%" >Documento</p>
                                  </div>
                                  
                                  <div style="width: 10%; display: table-cell">
                                      
                                  </div>
                            </div>
                        <div class="tabcntCell cellLevels">
                                <div class="row-tabCntX rowCurrencie" >
                                    <div style="width: 33.3333%; display: table-cell;text-align:center">
                                        <p style="font-weight: bold; font-size: 93%">N1</p>
                                    </div>
                                     
                                    <div style="width: 33.3333%; display: table-cell; text-align: center">
                                        <p style="font-weight: bold; font-size: 93%" >N2</p>
                                    </div>
                                      
                                    <div style="width: 33.3333%; display: table-cell; text-align: center">
                                        <p style="font-weight: bold; font-size: 93%" >N3</p>
                                    </div>
                                </div>
                            </div>
                    </div>
                    <div class="scrollBox">
                            <div class="tblSect">
                                <div class="tabcntCell">
                                    <div class=""></div>
                                </div>
                                <div class="tabcntCell cellLevels">
                                    <div class="drawLevelLines">
                                            
                                    </div>
                                </div>
                            </div>
                        </div>
                </div>
            <!-- /Support Image -->    
            
            <!-- Transaction Data -->
                <div id="transaction-data-legal" class="tabcontent tabcontentLegal">
                    <div class="tblSect">
                        <div class="tabcntCell">
                                <div class="row-tabCnt rowCurrencie" >
                                  <div style="width: 20%; display: table-cell">
                                      <p style="font-weight: bold; font-size: 93%">Estatus</p>
                                  </div>
                                  
                                  <div style="width: 40%; display: table-cell; text-align: left">
                                      <p style="font-weight: bold; font-size: 93%" >Campo</p>
                                  </div>
                                  
                                  <div style="width: 40%; display: table-cell; text-align: left">
                                      <p style="font-weight: bold; font-size: 93%" >Información</p>
                                  </div>
                                </div>
                            </div>
                        <div class="tabcntCell cellLevels">
                                <div class="row-tabCntX rowCurrencie" >
                                    <div style="width: 33.3333%; display: table-cell;text-align:center">
                                        <p style="font-weight: bold; font-size: 93%">N1</p>
                                    </div>
                                     
                                    <div style="width: 33.3333%; display: table-cell; text-align: center">
                                        <p style="font-weight: bold; font-size: 93%" >N2</p>
                                    </div>
                                      
                                    <div style="width: 33.3333%; display: table-cell; text-align: center">
                                        <p style="font-weight: bold; font-size: 93%" >N3</p>
                                    </div>
                                </div>
                            </div>
                    </div>
                    <div class="scrollBox">
                        <div class="tblSect">
                            <div class="tabcntCell">
                                <div class="">
                                    <!-- Operations Average by month -->
                                    <div class="row-tabCnt">
                                              <div class="validCol">
                                                  <i class='far fa-check-circle' id="averageMonthValid"></i>
                                                  <i class='far fa-pause-circle' id="averageMonthPending"></i>
                                                  <i class='far fa-times-circle' id="averageMonthRejected"></i>
                                              </div>
                                              
                                              <div class="fieldCol">
                                                  <p>Cantidad de transacciones promedio mensual de depósitos y retiros</p>
                                              </div>
                                              
                                              <div class="infoCol">
                                                  <p id="averageMonth">  </p>
                                              </div>
                                          </div>
                                    <!-- Mount $ of operations -->
                                    <div class="row-tabCnt" >
                                              <div class="validCol">
                                                  <i class='far fa-check-circle' id="mountOpValid"></i>
                                                  <i class='far fa-pause-circle' id="mountOpPending"></i>
                                                  <i class='far fa-times-circle' id="mountOpRejected"></i>
                                              </div>
                                              
                                              <div class="fieldCol">
                                                  <p>Volumen promedio mensual en US$</p>
                                              </div>
                                              
                                              <div class="infoCol">
                                                  <p id="mountOp">  </p>
                                              </div>
                                          </div>
                                    <!-- type operations -->
                                    <div class="row-tabCnt">
                                              <div class="validCol">
                                                  <i class='far fa-check-circle' id="typeOpValid"></i>
                                                  <i class='far fa-pause-circle' id="typeOpPending"></i>
                                                  <i class='far fa-times-circle' id="typeOpRejected"></i>
                                              </div>
                                              
                                              <div class="fieldCol">
                                                  <p> Tipo de Operación que estima realizar </p>
                                              </div>
                                              
                                              <div class="infoCol">
                                                  <p id="typeOp">  </p>
                                              </div>
                                          </div>
                                    <!-- Relationship with economic group -->
                                    <div class="row-tabCnt">
                                              <div class="validCol">
                                                  <i class='far fa-check-circle' id="relationGruopValid"></i>
                                                  <i class='far fa-pause-circle' id="relationGruopPending"></i>
                                                  <i class='far fa-times-circle' id="relationGruopRejected"></i>
                                              </div>
                                              
                                              <div class="fieldCol">
                                                  <p> ¿Posee relación con algún grupo económico? </p>
                                              </div>
                                              
                                              <div class="infoCol">
                                                  <p id="relationGruop">  </p>
                                              </div>
                                          </div>
                                </div>
                            </div>
                            <div class="tabcntCell cellLevels">
                                <div class="drawLevelLines">
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            <!-- /Transaction Data-->
            
            <!-- Accounts -->   
                <div id="accounts-legal" class="tabcontent tabcontentLegal" style="width: 100%;">
                    <div class="tabcntCell">
                        <div class="row-tabCnt rowCurrencie" >
                                  <div style="width: 20%; display: table-cell">
                                      <p style="font-weight: bold; font-size: 93%">Estatus</p>
                                  </div>
                                  
                                  <div style="width: 30%; display: table-cell; text-align: left">
                                      <p style="font-weight: bold; font-size: 93%" >Cuenta</p>
                                  </div>
                                  
                                  <div style="width: 20%; display: table-cell; text-align: left">
                                      <p style="font-weight: bold; font-size: 93%" >Detalles</p>
                                  </div>
                                  
                                  <div style="width: 30%; display: table-cell; text-align: left">
                                      <p style="font-weight: bold; font-size: 93%" >Información</p>
                                  </div>
                              </div>
                        <div class="scrollBox"></div>
                    </div>
                </div>
            <!-- /Accounts --> 
            
            <!-- Declaration -->
                <div id="declaration" class="tabcontent tabcontentLegal">
                    <div class="tblSect">
                        <div class="tabcntCell">
                            <div class="row-tabCnt rowCurrencie" >
                                  <div style="width: 20%; display: table-cell">
                                      <p style="font-weight: bold; font-size: 93%">Estatus</p>
                                  </div>
                                  
                                  <div style="width: 40%; display: table-cell; text-align: left">
                                      <p style="font-weight: bold; font-size: 93%" >Campo</p>
                                  </div>
                                  
                                  <div style="width: 40%; display: table-cell; text-align: left">
                                      <p style="font-weight: bold; font-size: 93%" >Información</p>
                                  </div>
                            </div>
                        </div>
                        <div class="tabcntCell cellLevels">
                            <div class="row-tabCntX rowCurrencie" >
                                    <div style="width: 33.3333%; display: table-cell;text-align:center">
                                        <p style="font-weight: bold; font-size: 93%">N1</p>
                                    </div>
                                     
                                    <div style="width: 33.3333%; display: table-cell; text-align: center">
                                        <p style="font-weight: bold; font-size: 93%" >N2</p>
                                    </div>
                                      
                                    <div style="width: 33.3333%; display: table-cell; text-align: center">
                                        <p style="font-weight: bold; font-size: 93%" >N3</p>
                                    </div>
                            </div>
                        </div>
                    </div>
                    <div class="scrollBox">
                        <div class="tblSect">
                            <div class="tabcntCell">
                                <div class="">
                                    <div class="row-tabCnt">
                                      <div class="validColX">
                                          <i class='far fa-check-circle' id="declarationLegalValid"></i>
                                          <i class='fas fa-pause-circle' id="declarationLegalPending"></i>
                                          <i class='far fa-times-circle' id="declarationLegalRejected"></i>
                                      </div>
                                      
                                      <div class="fieldCol">
                                          <p>Declaración Jurada</p>
                                      </div>
                                      
                                      <div class="infoCol">
                                          <p id="declarationLegal">   </p>
                                      </div>
                                  </div>
                                    <div class="row-tabCnt">
                                      <div class="validColX">
                                          <i class='far fa-check-circle' id="termsLegalValid"></i>
                                          <i class='fas fa-pause-circle' id="termsLegalPending"></i>
                                          <i class='far fa-times-circle' id="termsLegalRejected"></i>
                                      </div>
                                      
                                      <div class="fieldCol">
                                          <p>Términos y Condiciones</p>
                                      </div>
                                      
                                      <div class="infoCol">
                                          <p id="termsLegal">   </p>
                                      </div>
                                  </div>
                                </div>
                            </div>
                            <div class="tabcntCell cellLevels">
                                <div class="drawLevelLines">
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            <!--/Declaration -->
        </div>
        <div class="footerModal" align="center">
            <button class="buttonModal" id="buttonAceptModalLegal" align="center"> GUARDAR </button>
        </div>
        
      </div>
    </div>

</div>