* {
    margin:0;
    padding:0;
}
html {
    height: 102%; /* ensures that all pages will have vertical scrollbars, to keep the content from jumping horizontally when going from short page to a long one */
}
body {
 height: 100%;
 background: #fff;
 color: #000;
 text-align: center;
 behavior:url("csshover.htc") /* allows IE star hacks */
}
.container {
 width: 830px;
 position: relative;
 margin: 0 auto 24px auto;
 text-align: center;
}
#header {
 width: 830px;
 height: 36px;
 position: relative;
 z-index:2; /* this fixes the problem of dropdown going behind elements farther down on the page in IE; found solution at http://jonathanstegall.com/2009/01/15/ie-z-index-bug-with-css-dropdown-menu 12/8/10 */
 margin: 12px auto 15px auto;
 text-align: center;
 border-bottom: 1px solid #600;
}
#header ul {
 list-style-type: none;
 text-align: left;
}
#header li {
    float:left;
    position:relative; /* needed for dropdown menu */
    font-family: "Trebuchet MS", Verdana, Arial, Helvetica, sans-serif;
    color: #600;
    font-size:16px;
    text-transform: uppercase;
    font-weight: bold;
    margin-top:11px; /* needed to push the type down a bit, as the first-child has bigger type */
    margin-right:30px;
}
#header li:first-child /* dani's name is in bigger type */ {
    font-size:27px;
    margin-top:0px;
}
#header li a /* links in the header, unlike those in the body text, don't need a dotted bottom border */ {
    color: #600;
    border-bottom:none;
    padding:0 6px;
}
#header li a:hover {
 background: #ccc;
}
* html #header ul {
    font-size:24px; /* IE hack to make Dani's name the correct size */
}

/* -----BEGIN DROPDOWN MENU-------- */

#header ul li ul /* dropdown menu */ {
    margin:0;
    width:10em; /* could make this wider rather than using normal-weight text in #header ul li ul li below */
    position:absolute; /* needed for dropdown menu */
    top:24px; /* can't make this too large, or there will be vertical space between the li and the ul within it, meaning the dropdown menu will disppear before you can hover over it */
    left:-4px; /* makes up for the left padding in the li: hover and ul:hover below to line up the dropdown text w/the main menu li */
    padding:0;  /* alters the padding from #header ul */
    background-color:#fff;
    display:none; /* it's a dropdown menu that will reappear on #header ul li:hover */
/*    opacity:0.92;  a bit of transparancy on the dropdown
    -moz-opacity:0.92;
    filter:alpha(opacity=92); */
    z-index:2; /* moving it to the front in the stacking order; otherwise another li will appear above it, which looks odd. see also styling for #header near top of this file */
}
#header ul li ul li {
    width:100%; /* needed to make sure the list items stack */
    font-weight: normal;
}
#header ul li ul li:first-child {
    font-size:16px; /* equalizes the type size for all items in dropdown menu */
    padding-top:6px;
}
#header ul li:hover ul, #header ul li ul:hover {
    display:block; /* this is to make the dropdown menu display */
    padding-left:4px; /* this and the padding-right bring the link background in a bit from the edges of the dropdown menu */
    padding-right:4px;
}
#header a {
    display:block; /* useful for long names in dropdown menus */
}
* html #header ul li ul li {
    font-size:16px; /* IE hack to make the first link in the dropdown menu the correct size; may be unnecessary */
}

/* -----END DROPDOWN MENU-------- */


.thumbs /* for index, painting pages */ {
 width: 178px;
 margin: 0 45px 0 0;
 float: left;
 text-align: left;
}
.artist {
 width: 350px;
 margin: 0 0 24px 0;
 padding: 0;
 background: #fff;
 float: left;
 text-align: left;
}
.painting, .series /* used on individual painting pages and on series pages */ {
 width: 607px;
 /* position: relative; */
 margin: 0 0 24px 0;
 float: left;
 text-align: left;
}
.painting img {
 margin: 10px 0 18px 0;
 border: 0;
}
.series img {
 margin: 36px 0 0 0;
 border: 0;
}
.story /* used on all journalism pages, story list included  */ {
 width: 400px;
 margin: 24px auto;
 padding: 0;
 background: #fff;
 position: relative;
 /* float: left; */
 text-align: center;
}
.shows /* previous art shows, art resume, artist statement  */ {
 width: 600px;
 margin: 24px auto;
 padding: 0;
 background: #fff;
 position: relative;
 /* float: left; */
 text-align: center;
}
.dani /*used in about, 404 page */ {
 width: 288px;
 margin: 24px auto 20px auto;
 position: relative;
 text-align: center;
}
img.thumb {
 margin: 7px 7px 7px 7px;
 border: 0;
 opacity:1;
 -moz-opacity:1;
 filter:alpha(opacity=100);
}
img.thumb:hover {
 margin: 7px 7px 7px 7px;
 border: 0;
 opacity:.4;
 -moz-opacity:.4;
 filter:alpha(opacity=40);
}
img.thumbnolink /* use on thumbnail for the painting page you're on */{
 margin: 7px 7px 7px 7px;
 border: 0;
 opacity:1;
 -moz-opacity:1;
 filter:alpha(opacity=100);
 cursor:default;
}
/* img.thumbnolink:hover {
 margin: 7px 7px 7px 7px;
 border: 0;
 opacity:100;
 -moz-opacity:1;
 filter:alpha(opacity=100);
} */
img.thumbmed {
 margin: 7px 7px 0 0;
 border: 0;
 opacity:1;
 -moz-opacity:1;
 filter:alpha(opacity=100);
}
img.thumbmed:hover {
 margin: 7px 7px 0 0;
 border: 0;
 opacity:.4;
 -moz-opacity:.4;
 filter:alpha(opacity=40);
}
A {
 text-decoration: none;
}
a:link {
 color: #333;
 border-bottom: dotted #999 1px;
}
a:visited {
 color: #333;
 border-bottom: dotted #999 1px;
}
a:hover {
 color: #600;
 background: #ccc;
 border-bottom: dotted #600 0;
}
a:active {
 color: #999;
}
A.categories /* painting categories on index page */ {
 text-decoration: none;
 border-bottom: dotted #600 0px;
}
a.categories:link {
 color: #333;
 text-decoration: none;
 border-bottom: dotted #600 0px;
}
a.categories:visited {
 color: #333;
 border-bottom: dotted #600 0px;
}
a.categories:hover {
 /* color: #333; */
 opacity:.4;
 -moz-opacity:.4;
 filter:alpha(opacity=40);
 border-bottom: dotted #600 0px;
 background: #fff;
}
a.categories:active {
 color: #999;
}
A.img {
 text-decoration: none;
 border-bottom: dotted #600 0px;
}
a.img:link {
 color: #fff;
 text-decoration: none;
 border-bottom: dotted #600 0px;
}
a.img:visited {
 color: #fff;
 border-bottom: dotted #600 0px;
}
a.img:hover {
 color: #600;
 border-bottom: dotted #600 0px;
 background: #fff;
}
a.img:active {
 color: #fff;
}
p, li {
 font-size: 100%;
 line-height: 150%;
 margin: 1em 0 0 0;
 padding: 0;
 text-align: left;
 font-weight: normal;
 font-family: Georgia, Trebuchet MS, Verdana, Arial, Helvetica, sans-serif;
}
ul {
    list-style-type:square;
    list-style-position:outside;
}
.small {
 font-size: 80%;
 line-height: 120%;
 margin: .7em 0 0 0;
 padding: 0;
 font-weight: bold;
 font-family: Georgia, Trebuchet MS, Verdana, Arial, Helvetica, sans-serif;
}
.smallplain /* gallery map link on previous shows page */ {
 font-size: 80%;
 line-height: 120%;
 margin: .7em 0 0 0;
 padding: 0;
 font-weight: normal;
 font-family: Georgia, Trebuchet MS, Verdana, Arial, Helvetica, sans-serif;
}
p.paintcat /* painting categories in index, nonlink category labels above thumbs on painting pages */ {
 font-size: 80%;
 text-transform:uppercase;
 margin:0 7px 7px 7px;
 padding: 0;
 font-weight: bold;
 font-family: Trebuchet MS, Verdana, Arial, Helvetica, sans-serif;
}
p.paintcat2 /* painting category links on painting pages */ {
 font-size: 80%;
 text-transform:uppercase;
 margin:0 7px 7px 7px;
 padding: 0;
 font-weight: bold;
 font-family: Trebuchet MS, Verdana, Arial, Helvetica, sans-serif;
}
.prevShows /* 'previous shows' line at bottom of index */ {
 margin-bottom: 24px;
}
h1 {
 font-family: Georgia, Trebuchet MS, Verdana, Arial, Helvetica, sans-serif;
 font-size: 200%;
 font-weight: bold;
 color: #000;
 text-align: left;
 margin: 24px 0 0 0;
 padding: 0;
}
h2 {
 font-family: Georgia, Trebuchet MS, Verdana, Arial, Helvetica, sans-serif;
 font-size: 150%;
 text-align: left;
 margin: 30px 0 0 0;
 padding: 0;
}
h3 {
 font-family: Georgia, Trebuchet MS, Verdana, Arial, Helvetica, sans-serif;
 font-size: 110%;
 text-align: left;
 color: #000;
 margin: 24px 0 0 0;
 padding: 0;
}