Anexo A: Codificacin de clases

Clase Consultas_Botique

' Imports para controles web, MySQL, DataSet y dems.Imports Microsoft.VisualBasicImports SystemImports System.Data.SqlClient Imports System.Data Imports System.Web.SecurityImports System.ConfigurationImports MySql.DataImports MySql.Data.MySqlClientImports System.Web.UI.WebControlsImports System.DrawingImports System.Drawing.Drawing2DImports System.IOImports System.IO.IsolatedStorage

Public Class Consultas_Boutique

'Cadena de conexin para la base de datos, DataSet para colocar resultados de 'consultas y un adaptador de datos. Shared con As MySqlConnection = New MySqlConnection(System.Web.HttpContext.Current.Session("Conexion")) Shared ds As New System.Data.DataSet Shared da As MySqlDataAdapter

'Mtodo para dar de alta nuevos insumos en la boutique mediante una 'consulta MySQL, especificando la id del artculo, cantidad y precio.

Shared Sub Alta_Insumos(ByVal idInsumo As Double, ByVal cantidad As Double, ByVal precio As Double) Dim consulta As String Dim fecha As String = Now.Date.ToString("yyyy/MM/dd")

consulta = "INSERT IGNORE INTO altas_boutique(articulos_boutique_idarticulos_boutique,cantidad,precio,fecha) VALUES (" & idInsumo & "," & cantidad & "," & precio & ",DATE('" & fecha & "'))"

If Not con.State = ConnectionState.Open Then con.Open() End If

Dim cmd As MySqlCommand = New MySqlCommand(consulta, con)

Dim i As Integer = cmd.ExecuteNonQuery() If (i > 0) Then ' MsgBox("Record is Successfully Inserted") Else 'MsgBox("Record is not Inserted") End If If Not con.State = ConnectionState.Closed Then con.Close() End If

End Sub

'Mtodo para dar de baja insumos de la boutique, hay que especificar el 'motivo que causo dicha baja.

Shared Sub Baja_Insumos(ByVal idInsumo As Double, ByVal cantidad As Double, ByVal precio As Double, ByVal motivo As String) Dim consulta As String Dim fecha As String = Now.Date.ToString("yyyy/MM/dd")

consulta = "INSERT IGNORE INTO bajas_boutique(articulos_boutique_idarticulos_boutique,cantidad,precio,fecha,motivo) VALUES (" & idInsumo & "," & cantidad & "," & precio & ",DATE('" & fecha & "'),'" & motivo & "')"

If Not con.State = ConnectionState.Open Then con.Open() End If

Dim cmd As MySqlCommand = New MySqlCommand(consulta, con)

Dim i As Integer = cmd.ExecuteNonQuery() If (i > 0) Then ' MsgBox("Record is Successfully Inserted") Else 'MsgBox("Record is not Inserted") End If If Not con.State = ConnectionState.Closed Then con.Close() End If

End Sub

'Mtodo para agregar nuevos insumos a la boutique, hay que darles un nombre,'una descripcin, cantidad y costo de cada artculo.

Shared Sub Agregar_Insumos(ByVal nombre As String, ByVal Descripcin As String, ByVal cantidad As Double, ByVal costo As Double) Dim consulta As String Dim fecha As String = Now.Date.ToString("yyyy/MM/dd")

consulta = "INSERT IGNORE INTO articulos_boutique(nombre,Descripcin,cantidad,costo,fecha) VALUES ('" & nombre & "','" & Descripcin & "'," & cantidad & "," & costo & ",DATE('" & fecha & "'))"

If Not con.State = ConnectionState.Open Then con.Open() End If

Dim cmd As MySqlCommand = New MySqlCommand(consulta, con)

Dim i As Integer = cmd.ExecuteNonQuery() If (i > 0) Then ' MsgBox("Record is Successfully Inserted") Else 'MsgBox("Record is not Inserted") End If If Not con.State = ConnectionState.Closed Then con.Close() End If

End Sub

'Mtodo para modificar insumos de la boutique, para esto se especifica'el insumo a modificar y los nuevos valores que tendr este.

Shared Sub Modificar_Insumos(ByVal idArticulo As String, ByVal Nombre As String, ByVal Descripcin As String, ByVal Cantidad As Double, ByVal Costo As Double)

Dim consulta As String

consulta = "UPDATE articulos_boutique SET nombre='" & Nombre & "',Descripcin='" & Descripcin & "',cantidad=" & Cantidad & ",costo=" & Costo & " WHERE idarticulos_boutique=" & idArticulo

con.Open()

Dim cmd As MySqlCommand = New MySqlCommand(consulta, con)

Dim i As Integer = cmd.ExecuteNonQuery() If (i > 0) Then 'MsgBox("Record is Successfully Inserted") Else 'MsgBox("Record is not Inserted") End If con.Close()

End Sub

End Class

Consulta Clase CosasJS

Imports Microsoft.VisualBasic

'Este mtodo se encarga de mostrar mensajes especificados por el usuario,'pero haciendo uso de cdigo JavaScript.Public Class cosasJS Shared Sub javaMsg(ByRef page As System.Web.UI.Page, ByVal message As String) Dim sb As New System.Text.StringBuilder() sb.Append("window.onload=function(){") sb.Append("alert('") sb.Append(message) sb.Append("')};")

page.ClientScript.RegisterClientScriptBlock(page.GetType(), "alert", sb.ToString(), True)

End Sub

'Este mtodo se encarga de mostrar mensajes especificados por el usuario,'y despus hacer un re direccionamiento a otra pgina,'pero haciendo uso de cdigo JavaScript.

Shared Sub javaMsgRed(ByRef page As System.Web.UI.Page, ByVal message As String, ByVal redirigir As String) Dim sb As New System.Text.StringBuilder() sb.Append("window.onload=function(){") sb.Append("alert('") sb.Append(message)

sb.Append("');") sb.Append("document.location=('" & redirigir & "')};") page.ClientScript.RegisterClientScriptBlock(page.GetType(), "alert", sb.ToString(), True)

End SubEnd Class

Clases Fechas

' Imports para controles web, MySQL, DataSet y dems.

Imports Microsoft.VisualBasicImports SystemImports System.Data.SqlClient Imports System.Data Imports System.Web.SecurityImports System.ConfigurationImports MySql.DataImports MySql.Data.MySqlClient

Public Class Fechas

'Este mtodo se encarga de calcular el nmero de semanas en 'un mes especificado por el usuario

Public Shared Function SemanasEnMes(ByVal NumeroMes As Integer) As Double

Dim SemanaInicial As Integer Dim SemanaFinal As Integer

'Validacin que el nmero de mes est en el rango If NumeroMes < 1 Or NumeroMes > 12 Then Throw New ArgumentException("El Numero del mes ha de estar entre 1 y 12", "NumeroMes") End If

'obtenemos la primera semana del mes SemanaInicial = DatePart(DateInterval.WeekOfYear, _ New Date(Now.Year, NumeroMes, 1), _ FirstDayOfWeek.Monday, _ FirstWeekOfYear.Jan1)

'obtenemos la ltima semana del mes

SemanaFinal = DatePart(DateInterval.WeekOfYear, _ New Date(Now.Year, NumeroMes + 1, 1).AddDays(-1), _ FirstDayOfWeek.Monday, _ FirstWeekOfYear.Jan1)

'restamos 1 a la semana inicial porque el principio del mes est contenido en la semana inicial Return (SemanaFinal - (SemanaInicial - 1))

End Function

'Este mtodo se encarga de llenar un DropDownList con las 'fechas de inicio y fin de semanas que hay en el ao.

Public Shared Sub llenarComboFechas(ByRef cboSemana As DropDownList) Dim dtSemanas = New DataTable("Semanas") dtSemanas.Columns.Add("Codigo", System.Type.GetType("System.Int32")) dtSemanas.Columns.Add("Nombre", System.Type.GetType("System.String")) dtSemanas.Columns.Add("Inicio", System.Type.GetType("System.DateTime")) dtSemanas.Columns.Add("Fin", System.Type.GetType("System.DateTime")) Dim fechaRef As New Date(Now.Date.Year(), 1, 1) While fechaRef.DayOfWeek DayOfWeek.Monday fechaRef = fechaRef.AddDays(1) End While Dim a As String For i As Integer = 0 To 51 If i < 10 Then a = "0" + i + 1 End If a = i + 1 Dim r As DataRow = dtSemanas.NewRow r("Codigo") = i + 1 r("Nombre") = "S" & a & " - " & fechaRef.AddDays(i * 7) & " al " & fechaRef.AddDays((i * 7) + 5) r("Inicio") = fechaRef.AddDays(i * 7) r("Fin") = fechaRef.AddDays((i * 7) + 5) dtSemanas.Rows.Add(r) Next cboSemana.DataSource = dtSemanas cboSemana.DataTextField = "Nombre" cboSemana.DataValueField = "Codigo" cboSemana.DataBind() End Sub

'Este mtodo se encarga de llenar un DropDownList con las fechas 'de cada semana en un mes especificado por el usuario.

Public Shared Sub llenarComboFechasConMes(ByRef cboSemana As DropDownList, ByVal mes As String) Dim dtSemanas = New DataTable("Semanas") dtSemanas.Columns.Add("Codigo", System.Type.GetType("System.Int32")) dtSemanas.Columns.Add("Nombre", System.Type.GetType("System.String")) dtSemanas.Columns.Add("Inicio", System.Type.GetType("System.DateTime")) dtSemanas.Columns.Add("Fin", System.Type.GetType("System.DateTime")) Dim fechaRef As New Date(Now.Date.Year(), 1, 1) While fechaRef.DayOfWeek DayOfWeek.Monday fechaRef = fechaRef.AddDays(1) End While Dim a As String For i As Integer = 0 To 51 If i < 10 Then a = "0" + i + 1 End If a = i + 1 Dim r As DataRow = dtSemanas.NewRow r("Codigo") = i + 1 r("Nombre") = "S" & a & " - " & fechaRef.AddDays(i * 7) & " al " & fechaRef.AddDays((i * 7) + 5) r("Inicio") = fechaRef.AddDays(i * 7) r("Fin") = fechaRef.AddDays((i * 7) + 5) If fechaRef.AddDays(i * 7).Month() = mes Then dtSemanas.Rows.Add(r) End If

Next

cboSemana.DataSource = dtSemanas cboSemana.DataTextField = "Nombre" cboSemana.DataValueField = "Inicio" cboSemana.DataBind() End Sub

End Class

Anexo B: Codificacin de Formularios Web Forms

Pgina Almacen_Articulos_DarAltaNuevosArticulos.aspx (HTML Y ASP.NET)

.auto-style1 { width: 1000px; height: 166px; }

Inicio

Calidad y atencin

• Boutique
• Calificaciones
• Inscripciones
• Pagos
• Reportes

Almacn

• Insumos
• Utensilios
• Requisiciones
• Reportes

Recetas

• Agregar
• Eliminar
• Modificar
• Ver recetas

Jefatura

• Asignaturas
• Cursos cortos
• Diplomados
• Reticula
• Tipos de materias

Dir. administrativa

• Pago de servicios
• Becas

Recursos humanos

• Empleados e instructores

Control Escolar

• Alumnos
• Clientes
• Examenes extraordinarios
• Crear horario para curso corto

Dir. academica

Dir. capacitacin

Alumnos

• Consultar calificaciones

Ver perfil

• Ver

Directorio de la empresa

• Ver directorio

Agregar nuevos insumos Nombre del nuevo insumo:

Cantidad: Unidad de medida: Cantidad mnima: Cantidad mxima: Precio: Categoria del artculo:

Pgina Almacen_Articulos_DarAltaNuevosArticulos.aspx (VB.NET)

Cdigo en VB.NET de una pgina cualquiera del sitio web.

' Importacion de las clases para uso de controles web.Imports System' Imports System.Web.SecurityImports System.Configuration

Partial Class Inicio Inherits System.Web.UI.Page

'Cdigo para el botn de Logout, cierra la sesin. Protected Sub btnLogout_Click(sender As Object, e As EventArgs) Handles btnLogout.Click

Session("Permisos") = "anonimo" Response.Redirect("../../Inicio.aspx")

End Sub

'Cdigo que se ejecuta al momento de cargar la pgina. Protected Sub Page_Load(sender As Object, e As EventArgs) Handles Me.Load If (Session("Permisos") "Kamisama") Then If (Session("Permisos") "Almacn") Then Response.Redirect("../../Inicio.aspx") End If

End If

RolesUsuario.VerMenu(Session("Permisos"), "anonimo", m1, False, m2, False, m3, False, m4, False, m5, False, m6, False, m7, False, m8, False, m9, False, m10, False) RolesUsuario.VerMenu(Session("Permisos"), "Kamisama", m1, True, m2, True, m3, True, m4, True, m5, True, m6, True, m7, True, m8, True, m9, True, m10, True) RolesUsuario.VerMenu(Session("Permisos"), "Almacn", m1, False, m2, True, m3, False, m4, False, m5, False, m6, False, m7, False, m8, False, m9, False, m10, False) txtLogin.Text = Session("NombreUsuario") & " como: " & Session("Permisos") btnLogout.Visible = True

If Not IsPostBack Then LlenarControl.llenarLista(ListaUnidadMedida, "unidad_medida", "unidad_medida") LlenarControl.llenarLista(ListaCategoriaArticulos, "categoria_articulos", "Nombre_Categoria") End If End Sub

'Cdigo que se ejecuta para poder agregar un Nuevo artculo al sistema. Protected Sub AgregarArticulo_Click(sender As Object, e As EventArgs) Handles AgregarArticulo.Click Consultas.Agregar_articulo(txtNombreArticulo.Text, txtCantidad.Text, ListaUnidadMedida, txtMaxima.Text, txtMinima.Text, txtPrecio.Text, ListaCategoriaArticulos) Dim refPage As System.Web.UI.Page = Me.Page cosasJS.javaMsgRed(refPage, "Articulo agregado correctamente", HttpContext.Current.Request.Url.LocalPath.ToString) End Sub

'Cdigo para limpiar todos los controles de la pgina hacienda un re direccionamiento. Protected Sub LimpiarCampos_Click(sender As Object, e As EventArgs) Handles LimpiarCampos.Click Response.Redirect(HttpContext.Current.Request.Url.LocalPath) End SubEnd Class

Pgina de Reporte (HTML y ASP.NET)

Cdigo de muestra de una pgina que contiene un reporte.

Un control de tipo CrystalReportViewer, donde se mostrara el reporte generado -->

Pgina de un Reporte (VB.NET)

Cdigo VB de una pgina para visualizar determinado reporte.

'Se usaron todas estas importaciones para evitar problemas de ejecucin.Imports Microsoft.VisualBasicImports SystemImports System.Data.SqlClient Imports System.Data Imports System.Web.SecurityImports System.ConfigurationImports MySql.DataImports MySql.Data.MySqlClientImports CrystalDecisions.CrystalReportsImports CrystalDecisions.CrystalReports.EngineImports CrystalDecisions.ReportSourceImports CrystalDecisions.Shared

Partial Class Personal_Almacen_Reporte_Insumos Inherits System.Web.UI.Page

Protected Sub Page_Load(sender As Object, e As EventArgs) Handles Me.Load Try'Aqui se crea la consulta para llenar un reporte predefinido, usando un'dataset tipado para este fin Dim CrReport As New CrystalDecisions.CrystalReports.Engine.ReportDocument

CrReport = New CrystalDecisions.CrystalReports.Engine.ReportDocument() CrReport.Load(Server.MapPath("Reporte_Insumos.rpt")) Dim myDS As DSInsumos = GetData("SELECT datos_escuela.nombre as esc,articulos_almacen.Nombre, articulos_almacen.Existencia, articulos_almacen.Cantidad_Max - articulos_almacen.Existencia AS Faltante, CONCAT('$',' ',articulos_almacen.Precio) as Precio , unidad_medida.unidad_medida AS UnidadMedida, categoria_articulos.Nombre_Categoria as Categoria FROM articulos_almacen INNER JOIN unidad_medida ON articulos_almacen.unidad_medida_idunidad_medida = unidad_medida.idunidad_medida INNER JOIN categoria_articulos ON articulos_almacen.categoria_articulos_idcategoria_articulos = categoria_articulos.idcategoria_articulos,datos_escuela WHERE articulos_almacen.unidad_medida_idunidad_medida = unidad_medida.idunidad_medida AND categoria_articulos.idcategoria_articulos = articulos_almacen.categoria_articulos_idcategoria_articulos AND articulos_almacen.categoria_articulos_idcategoria_articulos NOT LIKE 17 and datos_escuela.iddatos_escuela=" & Double.Parse(Session("NumeroInstitucion"))) 'dataset tipado CrReport.SetDataSource(myDS) CrystalReportViewer1.ReportSource = CrReport

Catch ex As Exception 'MsgBox(ex.Message) End Try End Sub

'Esta function devuelve los datos obtenidos de la consulta MySQL. Private Function GetData(query As String) As DSInsumos

Dim conString As String = Session("Conexion") Dim cmd As New MySqlCommand(query) Using con As New MySqlConnection(conString) Using sda As New MySqlDataAdapter() cmd.Connection = con

sda.SelectCommand = cmd Using dsCustomers As New DSInsumos() sda.Fill(dsCustomers, "DataTable1") Return dsCustomers End Using End Using End Using End FunctionEnd Class

Anexo C: Codificacin de archivo Global.asax

Global.asaxEs un archivo opcional usado en las aplicaciones web deASP.NETpara declarar y manejar eventos y objetos a nivel de aplicacin y de sesin. Global.asax es la extensin de archivo Global.asa utilizado enASP.

Dim UsuarioIni As String = "Anonimo" Sub Application_Start(ByVal sender As Object, ByVal e As EventArgs) ' Code that runs on application startup BundleConfig.RegisterBundles(BundleTable.Bundles) AuthConfig.RegisterOpenAuth() End Sub Sub Session_Start(ByVal sender As Object, ByVal e As EventArgs) ' Code that runs when a new session is started 'aqu nicamente se crearon algunas variables de sesin para el fcil manejo'de informacin.

Session("NombreUsuario") = "Kuroneko" Session("Clave") = "01I01000" Session("Permisos") = "Kamisama" Session("NumeroInstitucion") = "01" Session("Conexion") = "server=localhost;User Id=root;Password='root';Persist Security Info=True;database=cocinartebdchih" Session("matKardex") = "" End Sub

Sub Application_End(ByVal sender As Object, ByVal e As EventArgs) ' Code that runs on application shutdown End Sub

Sub Application_Error(ByVal sender As Object, ByVal e As EventArgs) ' Code that runs when an unhandled error occurs End Sub

Anexo D: Codificacin de hoja de estilos

Cdigo bsico de la hoja de estilos usada en el sitio web.

Hoja de estilo (CSS)Es usada para dar un estilo grafico a las pginas de nuestro sitio web.

/*Estilo general para la pgina;*/html,body { background-color: #808080; margin: 0; padding: 0; height: 100%; font-family: arial; font-size: 12px;}

/*Estilo para el men de navegacin y todos sus componentes*/#menu { position: relative; z-index:99999}

#menu ul, #menu li, #menu span, #menu a { margin: 0; padding: 0; position: relative; }

#menu:after, #menu ul:after { content: ''; display: block; clear: both; }

#menu a { color: #ffffff; display: inline-block; font-family: 'Lucida Grande', 'Lucida Sans Unicode', Helvetica, Arial, Verdana, sans-serif; font-size: 12px; min-width: 35px; text-align: center; text-decoration: none; text-shadow: 0 -1px 0 #333333; }

#menu ul { list-style: none; }

#menu > ul > li { float: left; }

#menu > ul > li.active a { /*und: rgba(45,92,5,1);*/ background: -moz-linear-gradient(top, rgba(45,92,5,1) 0%, rgba(75,153,6,1) 100%); background: -webkit-gradient(left top, left bottom, color-stop(0%, rgba(45,92,5,1)), color-stop(100%, rgba(75,153,6,1))); background: -webkit-linear-gradient(top, rgba(45,92,5,1) 0%, rgba(75,153,6,1) 100%); background: -o-linear-gradient(top, rgba(45,92,5,1) 0%, rgba(75,153,6,1) 100%); background: -ms-linear-gradient(top, rgba(45,92,5,1) 0%, rgba(75,153,6,1) 100%); background: linear-gradient(to bottom, rgba(45,92,5,1) 0%, rgba(75,153,6,1) 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#2d5c05', endColorstr='#4b9906', GradientType=0 ); box-shadow: inset 0 0 10px #222222, inset 0 10px 10px #222222; -moz-box-shadow: inset 0 0 10px #222222, inset 0 10px 10px #222222; -webkit-box-shadow: inset 0 0 10px #222222, inset 0 10px 10px #222222; filter: none; }

#menu > ul > li.active a:hover { background: rgba(60,120,7,1); background: -moz-linear-gradient(top, rgba(60,120,7,1) 0%, rgba(89,176,7,1) 100%); background: -webkit-gradient(left top, left bottom, color-stop(0%, rgba(60,120,7,1)), color-stop(100%, rgba(89,176,7,1))); background: -webkit-linear-gradient(top, rgba(60,120,7,1) 0%, rgba(89,176,7,1) 100%); background: -o-linear-gradient(top, rgba(60,120,7,1) 0%, rgba(89,176,7,1) 100%); background: -ms-linear-gradient(top, rgba(60,120,7,1) 0%, rgba(89,176,7,1) 100%); background: linear-gradient(to bottom, rgba(60,120,7,1) 0%, rgba(89,176,7,1) 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#3c7807', endColorstr='#59b007', GradientType=0 ); filter: none; }

#menu > ul > li a { box-shadow: inset 0 0 0 1px #8a8a8a; -moz-box-shadow: inset 0 0 0 1px #8a8a8a; -webkit-box-shadow: inset 0 0 0 1px #8a8a8a; background: #4a4a4a url(grad_dark.png) repeat-x left top; background: -moz-linear-gradient(top, #8a8a8a 0%, #707070 50%, #626262 51%, #787878 100%); background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #8a8a8a), color-stop(50%, #707070), color-stop(51%, #626262), color-stop(100%, #787878)); background: -webkit-linear-gradient(top, #8a8a8a 0%, #707070 50%, #626262 51%, #787878 100%); background: -o-linear-gradient(top, #8a8a8a 0%, #707070 50%, #626262 51%, #787878 100%); background: -ms-linear-gradient(top, #8a8a8a 0%, #707070 50%, #626262 51%, #787878 100%); background: linear-gradient(to bottom, #8a8a8a 0%, #707070 50%, #626262 51%, #787878 100%); filter: progid:dximagetransform.microsoft.gradient(startColorstr='#8a8a8a', endColorstr='#787878', GradientType=0); border-bottom: 1px solid #5d5d5d; border-top: 1px solid #5d5d5d; border-right: 1px solid #5d5d5d; line-height: 34px; padding: 0 35px; filter: none; }

#menu > ul > li a:hover { background: #8a8a8a url(grad_dark.png) repeat-x left bottom; background: -moz-linear-gradient(top, #646464 0%, #4a4a4a 50%, #3b3b3b 51%, #525252 100%); background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #646464), color-stop(50%, #4a4a4a), color-stop(51%, #3b3b3b), color-stop(100%, #525252)); background: -webkit-linear-gradient(top, #646464 0%, #4a4a4a 50%, #3b3b3b 51%, #525252 100%); background: -o-linear-gradient(top, #646464 0%, #4a4a4a 50%, #3b3b3b 51%, #525252 100%); background: -ms-linear-gradient(top, #646464 0%, #4a4a4a 50%, #3b3b3b 51%, #525252 100%); background: linear-gradient(to bottom, #646464 0%, #4a4a4a 50%, #3b3b3b 51%, #525252 100%); filter: progid:dximagetransform.microsoft.gradient(startColorstr='#8a8a8a', endColorstr='#787878', GradientType=0); filter: none; }

#menu > ul > li:first-child a { border-radius: 5px 0 0 5px; -moz-border-radius: 5px 0 0 5px; -webkit-border-radius: 5px 0 0 5px; border-left: 1px solid #5d5d5d; }

#menu > ul > li:last-child a { border-radius: 0 5px 5px 0; -moz-border-radius: 0 5px 5px 0; -webkit-border-radius: 0 5px 5px 0; }

#menu .has-sub:hover ul { display: block; }

#menu .has-sub ul { display: none; position: absolute; top: 36px; left: -1px; min-width: 100%; text-align: center; /* IE7 */ *width: 100%; z-index:9999999; }

#menu .has-sub ul li { text-align: center; }

#menu .has-sub ul li a { border-top: 0 none; border-left: 1px solid #5d5d5d; display: block; line-height: 120%; padding: 9px 5px; text-align: center; }