/*
 *  EZWebGallery:
 *  Copyright (C) 2011 The EZWebGallery Dev Team <dev@ezwebgallery.org>
 *
 *  This program is free software: you can redistribute it and/or modify
 *  it under the terms of the GNU General Public License as published by
 *  the Free Software Foundation, either version 3 of the License, or
 *  (at your option) any later version.
 *
 *  This program is distributed in the hope that it will be useful,
 *  but WITHOUT ANY WARRANTY; without even the implied warranty of
 *  MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
 *  GNU General Public License for more details.
 *
 *  You should have received a copy of the GNU General Public License
 *  along with this program.  If not, see <http://www.gnu.org/licenses/>.
*/


/*************** BOUTONS *************/

.photoButtonEnabled{
	position:relative;		/* pour centrage vertical */
	cursor:pointer;
	margin: auto;
    width: 75%;
    opacity: 0.7;
	filter:alpha(opacity=70); /*ie ...*/
}
.photoButtonEnabled:hover{
    opacity: 1;
	filter:alpha(opacity=100); /*ie ...*/
}
.photoButtonDisabled{
	position: relative;		/* pour centrage vertical */
    cursor: not-allowed; /*css3*/
	margin: auto;
    width: 75%;
	opacity: 0.4;
	filter:alpha(opacity=40); /*ie ...*/
}

/* ---- */



/************** NAVIGATION *****************/
/* Previous arrow left position must be positionned:
/* LANDSCAPE: just right to the toolbar
/* -> div#photoRighter::left = .toolbar::width
/* PORTRAIT: just right of the browser window
/* -> div#photoRighter::left = 0
*********************************************/
div#photoRighter{
	margin: 0px; /* OBLIGATOIRE !! Sinon pb pour calculer taille max photo */
    display:none;
    z-index:-10; /*background when starting */
}


/* lanscape (default) & common */
div#photoLefter{
	margin: 0px; /* OBLIGATOIRE !! Sinon pb pour calculer taille max photo */
    display:none;
    left:4%;     /* MUST BE = to toolbar width in landscape!!! */
    z-index:-10; /*background when starting */
}

/* All Smartphones landscape */
@media only screen
and (max-device-width : 960px)
and (orientation: landscape){
   div#photoLefter {
        left:7%; /* MUST BE = to toolbar width in landscape!!! */
    }
}

/* portrait */
@media only screen
and (orientation: portrait) {
    div#photoLefter {
        left:0;
    }
}

/*******************************************/


/********** TEXT ***********/
.navigationtext {
  font-family: Arial;
  font-weight: bold;
  background:#FFFFFF;
}

.navigationtext {
  font-family: Arial;
  font-weight: bold;
}



/*********************** LAYOUT ECRAN *********************/
/* Toute la "page" photo est contenue dans screenPhoto */
/*  div en position *absolute* recouvrant tout l'écran.
		Permet d'avoir un *z-index* et d'afficher les div contenus en tenant compte de ce z-index */
#screenPhoto{
		z-index:1;     /* In the background when starting */
		display:none;
		background-color:black;
}


div.photoHeader{
	width:100%;
	height:100px;		/* MODIFIABLE */
	background-color:transparent;	/* MODIFIABLE */
}
div.photoFooter{
	width:100%;
	height:100px;		/* MODIFIABLE */
	background-color:transparent ;	/* MODIFIABLE */
}

/* 	Les background-color: transparent sont urilisés si on veut un fond uni et donc si aucun des 3 div
	n'a d'image ou de couleur de fond
*/
div#wrapperAffichagePhoto{
	background-color: transparent;
    width:auto;
    height:100%;
}
/**********************************************************/


 /*************** CAROUSSEL *************/
#photoViewport {
    background: transparent;
    position:relative;
    width:100%;
    height:100%;
    overflow:hidden;
  }


#slidesContainer {
    background:transparent;
    width:300%;
    height:100%;
    position: relative;
    top: 0px;
    left: 0px;
 }

div.slide {
    background:transparent;
    width:33.333%;
    height:100%;
    text-align:center;
    float:left;
  }





/************** PHOTO *************/
/** Contient la photo **/

div#cadrePhoto{
	position:relative;		/* vertical centering */
	margin:auto;                    /* horizontal centering on modern browsers */
	cursor:default;
}

div#divPhoto{
	display:block;
	background-color:black;
}


.mainPhoto{	/* La photo proprement dite. Classe ajoutée au runtime */
	margin: 0px;
	border:solid;
}


/************************************/


/************* Spinner **************/
/** Image affichée au centre de divPhoto au moment du load **/
.Spinner{
	position:relative;		/* pour centrage vertical */
	border: none;
	cursor:progress;
}
/*************************************/

/*************** Légende  ******************/
div.photoCaption {
	display:block;      /*OBLIGATOIRE SINON BUG SOUS IE6 */
	width: 100%;        /*OBLIGATOIRE SINON BUG SOUS IE6 */
	text-align:center;  /*OBLIGATOIRE SINON BUG SOUS IE6 */
	font-variant: normal;
	border: solid;
	border-width: 0px; /*OBLIGATOIRE SINON BUG SOUS IE6 */
	padding : 0.2em 0 0.2em 0;
    /*min-height: 10px;*/  /* Bouton - padding */
}
/**************************************/
