/*************************************************************************************************************
flatalbums2006 stylesheets
This is a patchwork of different stylesheets related to gallery views.
Those code portions are relased under different licences, so read carefully 
the incipit of each of them before reuse or manipulate it.

This stylesheet is relased in flatalbums2006 for the first time in 03beta version, 
december 2006.

Alfredo Cosco (orazio.nelson[at]gmail[dot]com)

**************************************************************************************************************/
/* Vertical Slides Stylesheet*/
/************************************************************************************************************
	(C) www.dhtmlgoodies.com,
	
	This is a stylesheet from www.dhtmlgoodies.com.

	Terms of use:
	You are free to use and edit this code portion as long as the copyright message is kept intact. However, you may not
	redistribute, sell or repost it without our permission.
	
	Thank you!
	
	www.dhtmlgoodies.com
	Alf Magne Kalleland
	
************************************************************************************************************/
	#dhtmlgoodies_slideshow{
		width:100%;	/* Total width of slideshow */


	}
	
	#previewPane{
		border:1px solid #000;
		margin-right:10px;	
		text-align:center;
		vertical-align:middle;
		padding-top:10px;
		
		
		/* CSS HACK */
		height: 550px;	/* IE 5.x */
		height/* */:/**/528px;	/* Other browsers */
		height: /**/528px;
		
		width:80%;		
		float:left;
				
	}
	#waitMessage{
		display:none;
		position:absolute;
		left:200px;
		top:150px;
		background-color:#FFF;
		border:3px double #000;
		padding:4px;
		color:#555;
		font-size:0.9em;
		font-family:arial;	
	}	
	#galleryContainer{	/* Big Div surrounding up image, list of images and down image */
		float:left;	/* Floating */
		
		/* CSS HACK */
		height: 550px;	/* IE 5.x - 120 px + 2 px for borders and 2px for padding*/
		height/* */:/**/528px;	/* Other browsers */
		height: /**/528px;
		
		/* CSS HACK */
		width: 120px;	/* IE 5.x - 120 px + 2 px for borders and 2px for padding*/
		width/* */:/**/120px;	/* Other browsers */
		width: /**/120px;
				
		border:1px solid #000;	/* Black border */		
		padding:1px;	/* A little space between the black border and the content inside */
		
	}
	#galleryContainer #arrow_down{	/* Arrow down image */
		height:35px;
	}
	#galleryContainer #arrow_up{
		height:35px;	/* Arrow up image */
	}
	
	#theImages{	/* DIV where the images are located */
		position:relative;
		overflow:hidden;
		height:450px;	/* Height of boxes for the images */
	}
	#theImages div{	
		position:relative;	/* Don't change this */
		height:1500px;	/* Higher than total height of thumbnails */
		
	}
	#theImages img{
		border:0px;	/* No border */
		filter:alpha(opacity=50);	/* Transparency - IE */
		opacity:0.5; /* Transparency - Firefox */
		padding-top:5px;	/* Space between images */
	}
	#previewPane #largeImageCaption{	/* CSS styling of image caption below large image */
		font-style:italic;
		text-align:center;
		font-family: Trebuchet MS, Lucida Sans Unicode, Arial, sans-serif;	/* Font to use */
		font-size:1.2em;
	}

	#theImages .imageCaption{
		display:none;
	}

/*Auto Slaides stylesheet*/
/************************************************************************************************************
	(C) www.dhtmlgoodies.com,
	
	This is a stylesheet from www.dhtmlgoodies.com.

	Terms of use:
	You are free to use and edit this code portion as long as the copyright message is kept intact. However, you may not
	redistribute, sell or repost it without our permission.
	
	Thank you!
	
	www.dhtmlgoodies.com
	Alf Magne Kalleland
	
************************************************************************************************************/
#imageSlideshowHolder{

		/* This is a CSS hack in order to get a nice look in IE 5.5 and lower 

		In these versions of Internet Explorer, we need to add borders and padding to the width. In this example, we have a 3 pixel
		border on all sides. This means that the width in IE5.5 should be 606 pixels(600 + border 3px on the left + border 3 px on the right). Height
		should be set to 456 pixels(450 + 3 +3). IE 5.5 will ignore the width attributes below the first line. These will be applied to other browsers.

		*/
		/* CSS HACK */
		width: 606px;	/* IE 5.x */
		width/* */:/**/600px;	/* Other browsers */
		width: /**/600px;
		
		/* CSS HACK */
		height: 456px;	/* IE 5.x */
		height/* */:/**/450px;	/* Other browsers */
		height: /**/450px;
		
		/*background-color:transparent;
		border:3px solid #317082;*/
		position:relative;	/* Never change this value */
		
	}
	.imageInGallery{		
		width:600px;
		height:450px;
		background-color:transparent;
		
		/* Never change these 3 value */
		left:25%;
		position:absolute;	
	}
	
	
	#imageSlideshowHolder img{
		position:absolute;
	}

/*Tabs Gallery Stylesheet*/
/************************************************************************************************************
I lost the reference for this code portion, if someone recognize his own code, I'll be happy to show a 
copyright notice	
************************************************************************************************************/
      a.tab { 
        border-collapse: collapse; 
        border-style: solid solid none solid;  
        border-color: black; 
        border-width: 1px 1px 0px 1px; 
        background-color: silver; 
        padding: 2px 0.5em 0px 0.5em; 
        margin-top: 4px;
        font-family: arial; 
        text-decoration: none;
        width: 13%;
        text-align: center;
      }
      a.tab:hover { 
        border-color: black; 
        background-color: white; 
      }
      .panel { 
	border: solid 1px black; 
	background-color: white; 
	padding: 5px; 
	height: 300px; 
	overflow: auto; 
	text-align : center; 
	height:800px;
	width:100%;
	}
    img.tabimage { 
	padding-top: 2em; 
	}

/*Puzzle Gallery Stylesheet*/
/************************************************************************************************************
	(C) www.dhtmlgoodies.com,
	
	This is a stylesheet from www.dhtmlgoodies.com.

	Terms of use:
	You are free to use and edit this code portion as long as the copyright message is kept intact. 
	However, you may not redistribute, sell or repost it without our permission.
	
	Thank you!
	
	www.dhtmlgoodies.com
	Alf Magne Kalleland
	
************************************************************************************************************/
	#puzzle_container{
		line-height:500px;
		text-align:center;
		vertical-align:center;
		border:10px outset #CCCCCC;
		position:relative;
		color: #FFFFFF;
		background-color: #707070;
		
		width: 520px;	/* IE 5.x */
		width/* */:/**/500px;	/* Other browsers */
		width: /**/500px;	
		
		height: 520px;	/* IE 5.x */
		height/* */:/**/500px;	/* Other browsers */
		height: /**/500px;			

	}
	
	#puzzle_container .square{
		overflow:hidden;
		border-left:1px solid #FFF;
		border-top:1px solid #FFF;
		position:absolute;
	}

	.activeImageIndicator{
		border:1px solid #FF0000;
		position:absolute;
		z-index:10000;
	}
	.revealedImage{
		position:absolute;
		left:0px;
		opacity:0;
		filter:alpha(opacity=50);
		top:0px;
		z-index:50000;
	}

/*Highslide Gallery*/
/******************************************************************************
Version 2.2.5 (November 22 2006)

Author: Torstein Hønsi
Email: See www.vikjavev.no/megsjol

Licence:
Highslide JS is licensed under a Creative Commons Attribution-NonCommercial 2.5
License (http://creativecommons.org/licenses/by-nc/2.5/).

You are free:
	* to copy, distribute, display, and perform the work
	* to make derivative works

Under the following conditions:
	* Attribution. You must attribute the work in the manner  specified by  the
	  author or licensor.
	* Noncommercial. You may not use this work for commercial purposes.

* For  any  reuse  or  distribution, you  must make clear to others the license
  terms of this work.
* Any  of  these  conditions  can  be  waived  if  you  get permission from the 
  copyright holder.

Your fair use and other rights are in no way affected by the above.

******************************************************************************/
.highslide {
	cursor: url(highslide/graphics/zoomin.cur), pointer;
    outline: none;
}
.highslide img {
	border: 2px solid gray;
}
.highslide:hover img {
	border: 2px solid white;
}

.highslide-image {
    border: 2px solid white;
}
.highslide-image-blur {
}
.highslide-caption {
    display: none;
    
    border: 2px solid white;
    border-top: none;
    font-family: Verdana, Helvetica;
    font-size: 0.9em;
    padding: 5px;
    background-color: white;
}
.highslide-loading {
    display: block;
	color: white;
	font-size: 9px;
	font-weight: bold;
	text-transform: uppercase;
    text-decoration: none;
	padding: 3px;
	border-top: 1px solid white;
	border-bottom: 1px solid white;
    background-color: black;
    /*
    padding-left: 22px;
    background-image: url(highslide/graphics/loader.gif);
    background-repeat: no-repeat;
    background-position: 3px 1px;
    */
}
a.highslide-credits,
a.highslide-credits i {
    padding: 2px;
    color: silver;
    text-decoration: none;
	font-size: 10px;
}
a.highslide-credits:hover,
a.highslide-credits:hover i {
    color: white;
    background-color: gray;
}

.highslide-move {
    cursor: move;
}

.highslide-overlay {
	display: none;
}
/* Controlbar example */
.controlbar {	
	margin-bottom: 10px;
	/*background: url(images/highslide/graphics/controlbar.gif);*/
	width: 275px;
	height: 44px;
}
.controlbar a {	
	display: block;
	float: left;
	margin: 8px 0 0 5px;
	height: 30px;
	width: 42px;
}
.highslide-display-block {
    display: block;
}
.highslide-display-none {
    display: none;
}
