Fri May 21, 2004 7:30 am
See if this works for you. I added a hover frame. And, a frame for the photo. And, changed the ugly color for the first letter in the title. Anyway, you can customize the colors as you see fit! Also, you might want to consider re-sizing your photos. That's been discussed often in these forums .
<!--
/* modified alexc*/
BODY
{
color: white;
background-color: #333333;
font-size: 7pt;
}
DIV,TH,TR,TABLE,FONT,LI,UL,FORM,
BLOCKQUOTE,P,B,I,H1,H2,H3,H4,H5,FONT, CENTER
{
font-family: verdana, arial, sans-serif;
font-size: 10pt;
color: white;
}
font
{
color: #AAAAAA; letter-spacing: 2px; font-size: 8pt;
}
h2
{
font-size: 14pt;
font-weight: normal;
text-align: right;
letter-spacing: 8px;
padding-top: 15px;
padding-bottom: 15px;
margin-left: 2px;
margin-right: 2px;
background-color: black;
color: white;
}
h2:first-letter
{
color: #ffcc66;
font-weight: bold;
font-size: 22pt;
}
h4
{
color: #44dd44;
font-size: 11pt;
}
I
{
color: #888888;
}
TEXTAREA
{
background-color: #EEEEEE;
font-family: times new roman;
color: black;
scrollbar-base-color: gray;
scrollbar-3dlight-color: black;
scrollbar-highlight-color: none;
}
A, TD.A, A:link
{
color: #FFCC00;
text-decoration: none;
}
A:hover { color: #00FF00; text-decoration: underline; }
A:visited { color: #FFCC66; }
A:active { color : #d5ae83; }
.caption
{
font-size : 18pt;
color : #bbbbbb;
font-weight: bold;
}
TD
{
background-color: #333333;
}
TD.thumbnail
{
vertical-align: middle;
background : #333333;
}
a.td.thumbnail, a:link.td.thumbnail, a:visited.td.thumbnail, a:active.td.thumbnail {
border: rgb(0, 0, 0) 1px solid;
margin-bottom: -50px;
padding-top: 5px;
width: 185px;
display: block;
background: rgb(10, 10, 10);
height: 210px;
filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100);
}
a:hover.td.thumbnail {
border: rgb(255, 204, 102) 1px solid;
margin-bottom: -50px;
padding-top: 5px;
width: 185px;
display: block;
background: rgb(0, 0, 0);
height: 210px;
filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100);}
.thumbnail
{
border: 3px RIDGE #999999;
background-color: black;
}
.display
{
background-color: black;
border: 12px RIDGE #d8d8d8;
}
BODY { margin-top: 0px; top: 0px; }
HR { position : relative;}
BODY { margin-top: 0px; top: 0px; }
HR { position : relative;}
-->