*{box-sizing:border-box}
html,body{margin:0;padding:0}
body{font-family:Arial,Helvetica,sans-serif;background:#fff;color:#000;padding:32px 20px}
.menu-sistema{width:268px;margin:30px auto 0;border:1px solid #000;background:#fff}
.menu-titulo{height:148px;background:#ccccff;display:flex;align-items:center;justify-content:center;text-align:left;padding:20px 56px;font-size:31px;font-weight:bold;line-height:1.05}
.menu-opcion{display:block;height:50px;line-height:50px;text-align:center;border-top:1px solid #000;font-size:23px;color:#0000ee;background:#ccccff;text-decoration:underline}
.menu-opcion:nth-child(even){background:#d0d0d0}
.menu-opcion:hover{background:#bdbdf5}
.contenedor{width:min(760px,100%);margin:30px auto;border:1px solid #000;background:#fff}
.titulo-pagina{margin:0;padding:18px 24px;background:#ccccff;border-bottom:1px solid #000;font-size:27px}
.contenido{padding:22px}
.tabla-form{width:100%;border-collapse:collapse}
.tabla-form td{border:1px solid #000;padding:9px;font-size:16px}
.tabla-form td:first-child{width:35%;background:#d0d0d0;font-weight:bold}
input{width:100%;padding:8px;border:1px solid #777;font-size:15px}
.boton{display:inline-block;padding:9px 15px;margin-top:15px;border:1px solid #000;background:#d0d0d0;color:#000;text-decoration:none;cursor:pointer;font-size:15px}
.boton:hover{background:#ccccff}
.tabla-datos{width:100%;border-collapse:collapse}
.tabla-datos th,.tabla-datos td{border:1px solid #000;padding:8px;text-align:left}
.tabla-datos th{background:#ccccff}
.tabla-datos tr:nth-child(even) td{background:#d0d0d0}
.mensaje{padding:15px;border:1px solid #000;background:#d0d0d0}
@media(max-width:600px){body{padding:15px}.menu-sistema{margin-top:20px}.contenedor{margin-top:20px}.menu-titulo{font-size:28px}.menu-opcion{font-size:20px}.contenido{padding:15px}.tabla-form td{display:block;width:100%!important}.tabla-form td:first-child{border-bottom:0}}