
<div id="divBotonesExpedienteContainer" class="clsHeaderExpediente">
    <div id="divBotonesExpediente" style=" float:left; width:auto; height:auto; overflow:auto; overflow-x:hidden;">
        <div id="btnVerExpedienteCon" class="custom-buttonDiv bordeIzq"><a id="btnVerExpediente" href="#">Expediente</a></div>
        <div id="btnVerMensajesCon" class="custom-buttonDiv"><a id="btnVerMensajes" href="#">Mensajes</a></div>
        <div id="btnVerProgresoCon" class="custom-buttonDiv"><a id="btnVerProgreso" href="#">Progreso</a></div>            
        <div id="btnVerListaSuperCon" class="custom-buttonDiv"><a id="btnVerListaSuper" href="#">Super</a></div>            
        <div id="btnVerNotificacionesCon" class="custom-buttonDiv bordeDer"><a id="btnVerNotificaciones" href="#"><div id="spanNotificaciones">10</div> Notificaciones</a></div>            
    	<div id="divExpedienteTitle" style=" float:left; width:auto; height:auto; color:#FFF; font-size:16px; font-weight:bold; padding:4px; padding-left:30px; padding-top:6px; "></div>
    </div>
        
    <div id="divBotonesExpediente2" style="float:right; width:auto; height:auto; overflow:auto; overflow-x:hidden; margin-right:30px;">
        <div id="btnVerCuestionarioCon" class="custom-buttonDiv bordeIzq"><a id="btnVerCuestionario" href="#">Cuestionario</a></div>
    	<div id="btnVerCuentaCon" class="custom-buttonDiv"><a id="btnVerCuenta" href="#">Cuenta</a></div>
    	<div id="btnVerPlanesCon" class="custom-buttonDiv bordeDer"><a id="btnVerPlanes" href="#">Planes</a></div>
    </div>
</div>

<div id="divCalendarioContainer" class="clsCalendarioContainer">
    <div id="divCalendarioControles" style=" float:left; width:100%; height:30px;; border-top:1px solid #CCC; border-bottom:1px solid #CCC; margin-top:0px; margin-bottom:4px; background: url(images/btnAccionesExpediente.png) repeat #EAECEA; overflow:auto; overflow-x:hidden;">
        <div id="btnCopiarRutina" class="clsBtnRutinaAccion" title="Copiar Rutina"><span style="padding-top:3px; padding-right:3px;">C</span></div>
        <div id="btnPegarRutina" class="clsBtnRutinaAccion" title="Pegar Rutina"><span style="padding-top:3px; padding-right:3px;">P</span></div>
        <div id="btnBorrarRutina" class="clsBtnRutinaAccion" title="Borrar Rutina"><span style="padding-top:3px; padding-right:3px;">B</span></div>
        <div id="btnModificarRutina" class="clsBtnRutinaAccion" title="Modificar Rutina"><span style="padding-top:3px; padding-right:3px;">M</span></div>

        <div id="btnCopiarDieta" class="clsBtnDietaAccion" title="Copiar Dieta" style="margin-left:35px; border-left:1px solid #ccc;"><span style="padding-top:3px; padding-right:3px;">C</span></div>
        <div id="btnPegarDieta" class="clsBtnDietaAccion" title="Pegar Dieta"><span style="padding-top:3px; padding-right:3px;">P</span></div>
        <div id="btnBorrarDieta" class="clsBtnDietaAccion" title="Borrar Dieta"><span style="padding-top:3px; padding-right:3px;">B</span></div>
        <div id="btnModificarDieta" class="clsBtnDietaAccion" title="Modificar Dieta"><span style="padding-top:3px; padding-right:3px;">M</span></div>
        
        <div id="btnLiberarPeriodo" class="clsBtnLiberarPeriodoAccion" title="Liberar Periodo" style="margin-left:35px; border-left:1px solid #ccc;"><span style="padding-top:3px; padding-right:3px;">L</span></div>
        <div id="btnMaximizarCal" class="clsBtnMaximizarCalAccion" title="Maximizar Calendario" style="border-left:1px solid #ccc;">+</div>
    </div>
    <div id="divCalendario" style=" float:left; width:100%;  margin:0px; background-color:#EEE; border:0px solid #CCC; overflow:auto; overflow-x:hidden;">
    </div>
    <!--height:auto;-->
</div>

<div id="divRutinas" style="border-radius:4px; float:left; width:63%; height:auto; margin:5px; background-color:#EEE; border:1px solid #CCC; overflow:auto; overflow-x:hidden;">
	<div id="divControlesRutinas" style=" float:left; width:99.0%; margin:3px; ">
        <div id="divLeyendaRutinaDia" style=" float:left; margin-right:10px; font-size:13px; padding-top:8px; ">
        </div>
        <div style=" float:right; margin-right:0px; ">
            <input id="btnVerRutina"  type="button" value="Modificar" class="custom-button" style="visibility:hidden; display:none;"/>     
        </div>
    </div>
    <ul id="ulRutinasVistaRapida" style=" float:left; width:99.6%; height:auto; margin:3px; background:#C00;"></ul>

</div>

<div id="divDietas" style="border-radius:4px; float:left; width:99%; height:auto; margin:5px; margin-top:20px; margin-bottom:30px; background-color:#EEE; border:1px solid #CCC; overflow:auto; overflow-x:hidden;">
	<div id="divControlesRutinas" style=" float:left; width:99.0%; margin:3px;">
        <div id="divLeyendaDietaDia" style=" float:left; margin-right:10px; font-size:13px; padding-top:8px; ">
        </div>
        <div style=" float:right; margin-right:0px; ">
            <input id="btnVerDieta"  type="button" value="Modificar" class="custom-button" style="visibility:hidden; display:none;"/>         
        </div>
    </div>
    <div id="divDietasVistaRapida" style=" background:#FFF; float:left; width:99.6%; height:auto; margin:3px; ">
    	<ul id='ulDietaDiaVistaRapida' style=' width: 700px; float:left;'></ul>
    	<div id='payDietaDiaVistaRapida' style=' width: 350px; float:left; height: 150px; z-index:1;'></div>
    </div>
</div>

<div id="dialog-confirm-copiar-rutina" title="Alerta">
  <p><span class="ui-icon ui-icon-alert" style="float:left; margin:0 7px 20px 0;"></span>&iquest;Ya existe una rutina para este d&iacute;a, desea a&uacute;n copiarla?</p>
</div>
<div id="dialog-confirm-borrar-rutina" title="Alerta">
  <p><span class="ui-icon ui-icon-alert" style="float:left; margin:0 7px 20px 0;"></span>&iquest;Esta seguro de borrarla?</p>
</div>
   
<div id="dialog-confirm-copiar-dieta" title="Alerta">
  <p><span class="ui-icon ui-icon-alert" style="float:left; margin:0 7px 20px 0;"></span>&iquest;Ya existe una dieta para este d&iacute;a, desea a&uacute;n copiarla?</p>
</div>
<div id="dialog-confirm-borrar-dieta" title="Alerta">
  <p><span class="ui-icon ui-icon-alert" style="float:left; margin:0 7px 20px 0;"></span>&iquest;Esta seguro de borrarla?</p>
</div>
   
<div id="divMensajesEjercicio" title="Mensajes">
    <h1 style="padding-left:8px;">
        <span id="spanTitleEjercicio"></span>
    </h1>
    <div id="divMensajesContainer2" style="border-radius:4px; width:517px; height:400px; margin:5px; background-color:#EEE; border:1px solid #CCC; overflow:auto; overflow-x:hidden;">
        <div style="padding:6px;">No hay Mensajes</div>
    </div>
    <div id="divNuevoMensaje2" style="border-radius:4px; width:500px; padding:10px; margin:5px; background-color:#EEE; border:1px solid #CCC; overflow:auto; overflow-x:hidden;">
        <div id="divDatosExtrasMsg2">
            
        </div>
        <div>
            <textarea id="txtAreaMensaje2" style="width:400px; height:80px; float:left; margin:5px;"></textarea>
            <input id="btnEnviarMensaje2" type="button" value="Enviar" style="height:80px; float:left; margin:5px;" class="custom-buttonBuscar"/>
        </div>
    </div>
</div>

<div id="divFormulario" title="Datos de Tarjeta">
	<br/>
    <h1 class="form-h1">Datos necesarios para realizar el pago del plan.</h1>
    <hr/>
    <br/>
    <form action="procesos/conekta.php" method="POST" id="card-form">
      <span class="card-errors"></span>
      <div class="form-row">
        <label>
          <div class="form-label">Nombre del tarjetahabiente</div>
          <input type="text" size="30" data-conekta="card[name]" class="form-text"/>
        </label>
      </div>
      <div class="form-row">
        <label>
          <div class="form-label">N&uacute;mero de tarjeta de cr&eacute;dito</div>
          <input type="text" size="30" data-conekta="card[number]" class="form-text"/>
        </label>
      </div>
      <div class="form-row">
        <label>
          <div class="form-label">CVC</div>
          <input type="text" size="4" data-conekta="card[cvc]" class="form-text"/>
        </label>
      </div>
      <div class="form-row">
        <label>
          <div class="form-label">Fecha de expiraci&oacute;n (MM/AAAA)</div>
          <input type="text" size="2" data-conekta="card[exp_month]" class="form-text"/>
        </label>
        <span>/</span>
        <input type="text" size="4" data-conekta="card[exp_year]" class="form-text"/>
      </div>
      <div class="form-row">
        <label>
          <div class="form-label">&nbsp;</div>
          <button type="submit" class="form-button">Pagar</button>
        </label>
      </div>
    </form>
    <br/><br/><br/>
    <label><b>Nota:</b> Los datos recopilados de su tarjeta no ser&aacute;n guardados en nuestros servidores.</label>

</div>