/*HTML5 deprecates <br clear="all"/>, so I now use <br class="unfloat"/>*/
.unfloat{
    clear: both;
}

/***********************************************/
/*           Photo-Caption PZ2 CSS             */
/***********************************************/
/*
Usage:
<div class="fillHoriz"></div><p class="PZ1 PZoom PZhoriz"><a href="javascript:void(0)"><img alt="image" src="photo.jpg"/><span class="PZcap">CAP</span></a></p>
(Note: For embedded images in blog posts, the z-index is automatically counted down inline;
 I still use the following definitions for About/Projects though)
*/
.PZ1 { z-index:99; }
.PZ2 { z-index:98; }
.PZ3 { z-index:97; }
.PZ4 { z-index:96; }
.PZ5 { z-index:95; }
.PZ6 { z-index:94; }
.PZ7 { z-index:93; }
.PZ8 { z-index:92; }
.PZ9 { z-index:91; }
.PZ10 { z-index:90; }
.PZ11 { z-index:89; }
.PZ12 { z-index:88; }
.PZ13 { z-index:87; }
.PZ14 { z-index:86; }
.PZ15 { z-index:85; }
.PZ16 { z-index:84; }
.PZ17 { z-index:83; }
.PZ18 { z-index:82; }
.PZ19 { z-index:81; }
.PZ20 { z-index:80; }

/*UL's next to the images won't work right, but can be fixed according to http://www.mail-archive.com/nzphpug@googlegroups.com/msg02468.html */
.fillVert, .fillHoriz, .fillvert, .fillhoriz { float:left; margin:5px 10px 1px 1px; }
.PZoom                                { position:relative; float:left; right:210px; margin:0; }
.PZoom   a                            { position:absolute; cursor:default; }
.PZoom   img                          { width:200px; border:1px solid #369; vertical-align:middle;}
.PZoom   .PZcap                       { display:none; }
.PZoom   a:hover .PZcap               { display:block; font-weight:normal; background:#369; font-family:verdana,sans-serif; text-align:justify; font-size:9pt; line-height:12pt; color:white; padding:4px 6px; }
.PZoom   a:hover                      { position:absolute; left:0; top:0; border:0; background:none; text-decoration:none; }

/*Not functionally relevant; just to satisfy Google Page Speed checker*/
.PZhoriz > a > img                    { height:150px; }
.PZvert > a > img                     { height:267px; }
.D40 > .PZvert a > img                { height:301px; }
.D40 > .PZhoriz a > img               { height:133px; }

/* Standard values for 800x600 */
.fillHoriz, .fillhoriz                { width:200px; height:150px; }
.fillVert, .fillvert                  { width:200px; height:267px; }
.PZhoriz > a:hover > img              { width:800px; height:600px; }
.PZvert  > a:hover > img              { width:600px; height:800px; }
.PZhoriz > a:hover > .PZcap           { width:790px; }
.PZvert  > a:hover > .PZcap           { width:590px; }

/* Values for Nikon D40's 902x600 */
.D40 .fillVert, .D40 .fillvert        { width:200px; height:301px; }
.D40 .fillHoriz, .D40 .fillhoriz      { width:200px; height:133px; }
.D40 > .PZhoriz > a:hover > img       { width:902px; }
.D40 > .PZhoriz > a:hover > .PZcap    { width:892px; }
.D40 > .PZvert > a:hover > img        { height:902px;}


/***************************************************/
/*                 PhotoZoom - Mods                */
/***************************************************/

/*Fix for suffusion over 3.5.7 in IE7 (photozoom goes behind sidebar)*/
.sidebar-shell{
    z-index: 1;
}
#main-col{
    z-index: 2;
}

/*Prevent photozoomed images from being cutoff*/
.post, #content{
    overflow:visible;
}

/*Prevent the next post's title from appearing in front of photozoom images.*/
.title-container{
    z-index:1;
    position:relative;
}

/*Override his style in custom-styles.php that forces image sizes to fit the post content - but just for zoomed photos*/
.PZoom img, .D40 > .PZoom img {
    max-width: 9999px;
}

/*Only for photos in the blog, shift them to the left when they zoom to compensate for the sidebar*/
.entry        > .PZhoriz a:hover       { left:-95px; }
.entry > .D40 > .PZhoriz a:hover       { left:-160px; }

/* Fix for stupid IE7 on >5.7.3, so the photozooms aren't overlapped by subsequent stuff */
.entry-container{ 
    position:static;
}

/* Fix for Suffusion 3.7.8, which adds overflow:hidden, screwing up photozoom */
.entry, .non-wp-entry{
    overflow:visible;
}

/***************************************************/
/*                     Widgets                     */
/***************************************************/

#tagcloud a{
    padding:0;
}

.collapsableList ul{
/*In the sidebar, a collapsable list of categories, links, etc*/
    list-style-image:none;
    list-style-position:outside;
    list-style-type:none;
}

.collapsableList > ul > li, .collapsableList > ul > li > ul > li{
    background-image:none;
    padding-left: 5px;
}

.collapsableList > ul > li a{
    margin: 0;
    padding: 0px 0px 0px 18px;
}

.collapsableList > ul > li > a{
    background: transparent url('widgets/nav_bullet02.gif') no-repeat center left;
    text-decoration: none;
}

.collapsableList > ul > li > #countriesLnk{
    background: transparent url('widgets/earth-icon.png') no-repeat center left;
}

.collapsableList > ul > li > #blogsLnk{
    background: transparent url('widgets/blog-icon.png') no-repeat center left;
}

.collapsableList > ul > li > a:hover{
    color: #FF0000;
}

.collapsableList > ul > li > ul a{
    background: transparent url('widgets/nav_bullet03.gif') no-repeat center left;
}