* {
  font-family : "Trebuchet MS", Arial, sans-serif;
}

html, body {
 color      : #000;
 border     : 0;
 margin     : 0;
 padding    : 0;
 width      : 100%;
}

html {
 background-image      : url("/images/espigas-30.jpg");
 x-background-image      : url("/images/nieve-20.jpg");
 x-background-image      : url("/images/costa-20.jpg");
 x-background-image      : url("/images/mar-30.jpg");
 x-background-image      : url("/images/retiro-20.jpg");
 background-position   : bottom left;
 background-attachment : fixed;
 background-repeat     : no-repeat;
 background-color      : #fff;
}

h1 {
 position : absolute;
 left     : 10px;
 top      : 10px;
 margin   : 0;
 padding  : 0;
}

h2 {
 position : absolute;
 right    : 5px;
 top      : 5px;
 margin   : 0;
 padding  : 0;
}

h2 a img {
 border : 0
}

h3 {
 text-align : center;
 margin-bottom : 1em;
}

p.bienvenida {
 position : absolute;
 left     : 10px;
 top      : 75px;
 margin   : 0;
 padding  : 0;
}

p.menu {
 position : absolute;
 left     : 20px;
 top      : 110px;
 margin   : 0;
 padding  : 0;
 border-bottom : 2px solid #000
}

p.menu span { display : none }

p.menu {
 font-weight : bold
}

p.menu a:link, p.menu a:visited {
 color : #008;
 text-decoration : none;
 font-weight : bold;
}

p.menu a:hover {
 color : #c00;
 text-decoration : none;
 font-weight : bold;
 background : #fff;
}

p.copyright {
 margin      : 1em 5% 0;
 padding     : 2px 0 5px;
 font-size   : 60%;
 font-family : Verdana, Arial, sans-serif;
 border-top  : 1px solid #666;
 text-align  : right;

 position    : absolute;
 width       : 90%;
}

form > p.copyright {
 position : static
}

table {
 border-collapse : collapse;
 border : 1px solid #666;
 margin-bottom : 1.5em;
}

td, th {
 border-style : solid;
 border-color : #666;
 border-width : 1px 0;
 padding : 3px;
}

td {
 x-width : 50%;
 background : #fff;
 color : #000
}

td.input { text-align : center }

td.reqchange {
  font-size : smaller;
  font-style : italic;
  text-align : center;
}

th {
 background : #eee;
 color : #000
}

form {
 margin   : 0;
 padding  : 0;
 border   : 0;
 margin-left : 231px;
 width    : 100%;

 position : relative;
 top      : 170px;
}

form#login {
 top        : 200px;
}

body > form {
 width      : auto;
 position   : static;
 margin-top : 170px;
}

body > form#login {
 margin-top : 200px;
}

form table {
 width : 90%;
 margin-left : 5%;
}

form#login table {
 width : 50%;
 margin-left : 25%;
}

form#balance table,
form#invoices table {
 font-size : 90%;
}

form#contactinfo table td {
 width : 50%;
}

form#balance table td {
 text-align : center;
}

form#balance table.entries td {
 cursor : pointer;
}

form#balance table.entries tr :nth-child(3) {
 text-align : left
}

form#balance table tr.highlighted td {
 background : lightyellow;
}

form#balance table tr.clicked td {
 background : #ffe4b5;
}

form#invoices table.invoices td {
 width : 20%;
 text-align : center;
 font-size : 90%;
}

form#invoices table.invoices td.items {
 width : 60%;
 text-align : left;
}

form#invoices table.items td {
 width : 18%;
 text-align : center;
}

form#invoices table.items td.items {
 width : 46%;
}

input, .center {
 text-align : center;
}