/* paintings by deveas */
/* MAIN                */
/* ------------------------------------------------------------- */

body {
 font-family: Geneva, Arial, Helvetica, sans-serif;
 font-size: medium;
 color: #000;
 background-color: #FED;
}
a img {
 border:none;
}
/* This gets us the right-floated image on the home page. */
/* It works, but I'm not sure if it's the ideal solution. */
img.right {
  float:right;
  padding:1.5em 35px 1.5em 2em;    /* right padding has to match p/h3 border-width */
}
/*
  h1 : overarching site title, same text on all pages
  h2 : main page-level title, sits low, away from nav. bar
  h3 : paragraph headings; align these like p's
  h6 : gallery instruction text
*/
p, h3 {
  border-style:solid;
  border-color: #FED;
  border-width:0 35px 0 35px;
  }
p + p {
  text-indent:1.5em;
  }
hr {
 margin: 15px 0 15px 0;
}
h1, h2, h6 {text-align: center}
h1 {
 width:100%;
 margin:0 0 0 0;
 padding:15px 0 25px 0;
 background-color:#9CC;
}
h2 {
 width:100%;
 padding:25px 0 0 0;
}
h6 {
 font-style:italic;
}

/* ------------------------------------------------------------- */
/* define horizontal list style for main navigation bar */
#navbar ul {
 float:left;
 width:100%;
 padding:0;
 margin:0;
 list-style-type:none;
 background-color:#9CC;
 }
#navbar li {
 display:inline;
}
#navbar li a {
 float:left;
 text-decoration:none;
 color:#000;
 background-color:#9CC;
 padding:0.2em 0.6em;
 border-right:2px solid #ADD;
 border-top:2px solid #ADD;
 border-left:2px solid #8BB;
 }
#navbar li a:hover {
 text-decoration:underline;
 background-color:#FA8;
 color:#000;
 border-right:2px solid #FB9;
 border-top:2px solid #FB9;
 border-left:2px solid #F97;
 }
#navbar li.active a {
 text-decoration:none;
 cursor:default;
 background-color:#FED;
 color:#000;
 border-right:2px solid #FFE;
 border-top:2px solid #FFE;
 border-left:2px solid #EDC;
 }

/* ------------------------------------------------------------- */
/* define horizontal gallery item nav buttons */

#gallerynav ul {
 list-style-type:none;
 text-align: center;
 }

#gallerynav li {
 display:inline;
}
#gallerynav li a {
 text-decoration:none;
 color:#000;
 background-color:#FED;
 padding:0.2em 0.6em;
 border-right:2px solid #FFE;
 border-top:2px solid #FFE;
 border-left:2px solid #EDC;
 border-bottom:2px solid #EDC;
 }
#gallerynav li a:hover {
 text-decoration:underline;
 background-color:#FA8;
 color:#000;
 border-right:2px solid #FB9;
 border-top:2px solid #FB9;
 border-left:2px solid #F97;
 border-bottom:2px solid #F97;
 }

/* ------------------------------------------------------------- */
/*  gallery item container */

#galleryitem {        /* box to contain gallery item display */
  width: 80%;         /* an explicit width is required for WinIE, or it screws up badly */
  margin: auto;       /* correctly center block element */
  padding: .5em;
  background-color: #9CC;
  color: #000;
  border: thin solid #030;
  overflow: hidden;
}

#galleryitem img {
  float:left;
  padding:0 0.5em 0.75em 0.5em;
}

#galleryitem body {
  font-size: medium;
  color: #000;
  background-color: #9CC;
}

#galleryitem table {
  background-color:#CBA;
  color:#333;
  }
#galleryitem tbody tr:hover td {
  background-color:#EDC;
  color:#432;
  }
#galleryitem tbody tr:hover th {
  background-color:#EDC;
  color:#432;
  }
#galleryitem thead th {
  background-color:#DCB;
  color:#321;
  padding:5px;
  }
#galleryitem tbody th {
  background-color:#FED;
  color:#321;
  padding:5px;
  }
#galleryitem tbody td { 
  text-align:left;
  background-color:#FED;
  color:#321;
  padding:5px;
  }
#galleryitem tbody td.num {
  text-align:right;
  }

#galleryitem p {
  border-style:solid;
  border-width:0 35px 0 35px;
  border-color:#9CC;
  }

/* we're re-using h3 inside galleryitem, centered & borderless */
#galleryitem h3 {
  text-align: center;
  border-style:none;
}

/* ------------------------------------------------------------- */
#header {
 border: 1px solid #ccc;
 margin: 0 5px 5px 5px;
 height: 70px;
 padding: 10px;
 background-color: #69C;
 text-align: center;
}
#header h1 {
 font-size: x-large;
}
#header h2 {
 font-size: large;
}
#header h3 {
 font-size: medium;
}


/* ------------------------------------------------------------- */

#footer {
 font-size: x-small;
 background-color:#FED;
 width:100%;
 margin:5em 5px 0 5px;
 margin:2em 0 1em 0;
 padding:0;
 display:inline; /* IE Hack */
 float: left;
}

#footer p {
  border-style:solid;
  border-color:#FED;
  border-width:0 2% 0 2%;
}

/* ------------------------------------------------------------- */

table.center {margin-left:auto; margin-right:auto;}

table {
  background-color:#CBA;
  color:#333;
  }

tbody tr:hover td,
tbody tr:hover th {
  background-color:#EDC;
  color:#432;
  }
thead th {
  background-color:#DCB;
  color:#321;
  padding:5px;
  }
tbody th {
  background-color:#FED;
  color:#321;
  padding:5px;
  text-align:center;
  }
tbody td { 
background-color:#FED;
  color:#321;
  padding:5px;
  text-align:center;
  }

/* (http://icant.co.uk/csstablegallery/) */
/* ------------------------------------------------------------- */