html, body {			/* needed to nicely center the page vertically and horizontally */
	height:100%;
}

body {
    font-family: Verdana, serif;
    font-size: 10pt;
	margin:0;
	padding:0;
}

h1 {
	font-size: 15pt;
	font-weight: bold;
    margin-top: 0;
}

h2 {
    font-size: 13pt;
    font-weight: bold;
    font-style: italic;
}

h3 {
    font-size: 11pt;
    font-weight: bold;
}

h4 {
    font-size: 10pt;
    font-weight: bold;
    font-style: italic;
}

p {
    font-size: 10pt;
}

ul {
    margin-bottom: 0;
}
ul * {
    font-size: 10pt;
}

ul li {
    padding-bottom: 10px;
}

a img {
    border-style: none;
}

td#switchedTabParent {
}

/* <div> tags of switched tabs */
div.switchedTab {
    display: none;

    overflow: hidden;
    text-align: left;
}

/* <div> tag of a switched tab that is active after loading the page */
div.switchedTab.active {
    display: block;
}

div#tab_AlbumSetView {
    background-image: url('../images/paperjam_corr_700x580.jpg');
    background-repeat: no-repeat;
    background-color: #f2f0fb; /* in case bgnd img doesn't load */
    margin: 0;
    width: 700px;
    height: 580px;
    border-width: 0;
    position: absolute;
    left: 50%;
    top: 50%;
    margin-left: -350px; /* ja pierdole, jak mi sie udalo to pozycjonowanie */
    margin-top: -290px;  /*horiz-vert diva, to nie pytajcie, bo do konca nie wiem :-) */
}

/* Title bar and a breadcrumb inside tab_AlbumSetView div. Its role is to keep the margin between
   tab_AlbumSetView's background and its contents */
div#tab_AlbumSetView_titlebar {
    width: 620px;
    margin-left: 40px;
    margin-right: 50px;
    margin-top: 40px;
    margin-bottom: 10px
}

/* Album list inside tab_AlbumSetView div. Its role is to keep the margin between
   tab_AlbumSetView's background and its contents, including the scrollbar */
div#tab_AlbumSetView_albumlist {
    width: 620px;
    height: 400px;
    margin-left: 40px;
    margin-right: 40px;
    margin-top: 0;
    overflow: auto
}

div#tab_AlbumView {
    background-image: url('../images/paper_980x580.jpg');
    background-repeat: no-repeat;
    background-color: #f2f0fb; /* in case bgnd img doesn't load */
    margin: 0;
    width: 960px;
    height: 460px;
    padding-left: 20px;
    padding-right: 0;
    padding-top:40px;
    padding-bottom:80px;
    border-width: 0;
    position: absolute;
    left: 50%;
    top: 50%;
    margin-left: -490px; /* ja pierdole, jak mi sie udalo to pozycjonowanie */
    margin-top: -290px;  /*horiz-vert diva, to nie pytajcie, bo do konca nie wiem :-) */
}

/* BEGIN album styles  (albumview.html) ----------------------------------------------------------------------------- */

tr.thumbnavbar td {
    width: 20px;
    height: 30px;
    background-repeat: no-repeat;
}

tr.thumbnavbar td#btn_up {
}

tr.thumbnavbar td#btn_first {
    background-image: url('../images/btn_first.gif');
}

tr.thumbnavbar td#btn_rew {
    background-image: url('../images/btn_rew.gif');
}

tr.thumbnavbar td#btn_prev {
    background-image: url('../images/btn_prev.gif');
}

tr.thumbnavbar td#btn_next {
    background-image: url('../images/btn_next.gif');
}

tr.thumbnavbar td#btn_ff {
    background-image: url('../images/btn_ff.gif');
}

tr.thumbnavbar td#btn_last {
    background-image: url('../images/btn_last.gif');
}


tr.thumbnavbar td.enabled {
    background-position: 0 0;
}

tr.thumbnavbar td.hover {
    background-position: -20px 0;
}

tr.thumbnavbar td.down {
    background-position: -40px 0;
}

tr.thumbnavbar td.disabled {
    background-position: -60px 0;
}


div.thumbs_viewport {
    width:405px; /* 5 thumbs */
    height:30px;
    overflow: hidden;
    position: relative; /* make it a containing block */
}

div#thumbs_primary {
    width:405px;
    height:30px;
    position: absolute;
    left: 0;
}

div#central_frame {
    width:45px;
    height:30px;
    position: absolute;
    left: 180px;
    text-align: center;
    z-index: 2;
    /*background-color: red;*/
}

div#central_frame img {
    padding: 0;
    margin: 0;
    border-width: 1px;
    border-color: #6666ff;
    border-style: solid;
    position: relative;
    top: 0;
}

div#thumbs_anim {
    width:1215px; /* 5+5+5 thumbs */
    height:30px;
    position: absolute;
    left: -405px;
    display: none;
}

div.thumb {
    width:45px;
    height:30px;
    float: left;
    text-align:center;
}

div.thumb img {
    position: relative;
    /*top: 2px;*/
}


tr.thumbnavbar td.thumb {
    width:45px;
    height:30px;
    text-align:center;
    vertical-align: middle;
}

tr.thumbnavbar td.thumb img {
    border: none;
}

tr.thumbnavbar td.thumb img.current {
    padding: 1px;
    border-width: 1px;
    border-color: #6666ff;
    border-style: solid;
}

img.img_main_class {
    background-color: white;
    padding: 5px;
    border: 1px solid #b4b3b3;
}

#img_title
{
	font-size: 10pt;
	font-weight: bold;
}

#img_descr
{
    font-size: 8pt;
}

#img_loc
{
    font-size: 8pt;
	font-weight: bold;
}

#img_date
{
    font-size: 8pt;
	font-style: italic;
}

#img_author
{
    font-size: 8pt;
	font-style: italic;
}

img.withLink {
    cursor: pointer;
}

/* END album styles  (albumview.html) ------------------------------------------------------------------------------- */


/* BEGIN album set styles (albumsetview.html) ----------------------------------------------------------------------- */

div#albumset_title {
    font-size: 15pt;
    font-weight: bold;
    padding-bottom: 5px;
}

div#albumset_breadcrumb {
    font-size: 10pt;
    color: blue;
    font-style: italic;
    margin-bottom: 5px;
}

div#albumset_breadcrumb a {
    text-decoration: none;
    color: blue;
}

div#albumset_breadcrumb a:hover {
    text-decoration: underline;
}

div.albumset_separator {
    border-bottom: 1px solid gray;
    margin-bottom: 1px;
    padding-left: 0;
    padding-right: 0;
}

div.album_block {
    margin: 10px;
}

div.album_block div a {
    text-decoration: none;
    color: black;
}

div.album_block div a:hover {
    text-decoration: underline;
}

div.album_block div a:hover img {
    border-color: #6666ff;
}

div#album_block_prototype {
    display: none;
}

div.album_title {
    clear: left; /* float:left alone wasn't enough in the case of long titles in FF */
    font-size: 13pt;
    font-weight: bold;
    padding-bottom: 5px;
}

div.album_image {
    float: right;
}

div.album_image img {
    padding: 2px;
    border: 1px solid gray;
    margin-left: 10px;
    margin-bottom: 10px;
}

div.album_descr {
    clear: left;
    font-size: 10pt;
    margin-bottom: 10px;
}

div.album_separator {
    clear: both;
    border-bottom: 1px solid gray;
    margin-bottom: 10px;
    padding-left: 0;
    padding-right: 0;
}
/* END album set styles (albumsetview.html) ------------------------------------------------------------------------- */