WP File Manager

Current Path: /home/translil/www/amitram/phototheque/albulle/themes/albulle/css/

Name	Action
..
ie_fix.css	Edit
jquery.fancybox.min.css	Edit
style.css	Edit

Editing: style.css

/*
 * Fichier : style.css
 * Date : 20/10/2008
 * Auteur : SamRay1024 - http://jebulle.net
 *
 * AlBulle CSS - Style uniquement - A partir de la version 1.1
 *
 * Choisir ses couleurs : https://htmlcolorcodes.com/fr/selecteur-de-couleur/
 */

/**
 * STYLES GENERAUX
 */

/* protection des éléments pour les tailles en ems */
input, select, th, td { font-size: 1em; }
li li, li p, td p, blockquote p { font-size: 1em; }

/* Cette classe n'est utilisée que si AlBulle n'est pas intégré à
 * un site Web : elle défini le body de la page et permet donc de ne pas
 * empiéter sur la définition éventuelle lors d'une intégration.
 */
.al_body {
	margin: 0;
	padding: 3px;
	font-size: 62.5%;
}
.albulle { width: 100%; }
.albulle::after {
	display: block;
	content: "";
	clear: both;
}
.albulle * {
	margin: 0;
	padding: 0;
	font-family: verdana, arial, helvetica, sans-serif;
	color: #333;
}
.albulle header {
	padding: 25px;
	padding-left: 85px;
	background: url(../images/logo.png) no-repeat center left 15px;
}
.albulle a { text-decoration: none; }
.albulle a:hover { color: #69C }
.albulle img { border: 0px; }
.albulle h1,
.albulle h2 {
	font-family: Georgia;
	font-weight: normal;
}
.albulle h1 { font-size: 2.4em; }
.albulle h2 { font-size: 1.4em; }
.albulle h3 {
	margin-top: 3px;
	padding: 4px;
	font-size: 1.2em;
}
.albulle ul { list-style-type: none; }
.albulle .spacer { clear: both; }
/* spacer spécial à cause de Safari pour retrouver l'écart du h3 placé après les vignettes */
.albulle .spacer_post_float {
	clear: both;
	height: 1px;
	width: 100%;
}
/* Complément du hack sur le spacer pour Safari */
.albulle h3.post_float { margin-top: 2px; }

/**
 * ELEMENTS SIMPLES
 */

/* Entête de la page + autres qui ont le même style */
.albulle .cadre {
	margin-top: 3px;
	font-size: 1.2em;
	background-color: #f4f4f4;
	border: 1px solid #d6d6d6;
}
.albulle .cadre-titre {
	margin: 0;
	padding: 4px;
	background-color: #e5e5e5;
	border-bottom: 1px solid #d6d6d6;
	font-size: 1em;
	font-weight: normal;
}
.albulle .cadre-contenu { padding: 4px; }

/* cadre d'accueil si aucun dossier sélectionné */
.albulle .texte {
	margin-top: 3px;
	padding: 10px;
	font-size: 1.2em;
	text-align: justify;
}
.albulle .texte h5 {
	margin: 0px;
	padding: 0px;
	font-size: 1.2em;
}
.albulle .texte p { margin: 10px 0px; }

/* les puces de liens d'ajout et de retrait */
.albulle .puce-ajout,
.albulle .puce-retrait {
	display: block;
	width: 20px;
	height: 20px;
	background-repeat: no-repeat;
	background-position: 50% 50%;
	overflow: hidden;
	text-indent: -10000em;
}
.albulle .puce-ajout { background-image: url(../images/envelope--plus.png); }
.albulle .puce-retrait { background-image: url(../images/envelope--minus.png); }

/* le copyright */
.albulle .copyright {
	margin: 3px;
	text-align: right;
}
.albulle .copyright,
.albulle .copyright a { color: #d6d6d6; }
.albulle .copyright a:hover { text-decoration: underline; }

/**
 * MENU DES DOSSIERS ET DU PANIER
 */

.albulle .gauche {
	float: left;
	width: 300px;
}
.albulle .droite {
	float: right;
	margin-left: -300px;
	width: 100%;
}
.albulle .contenu {
	margin-left: 303px;
	margin-bottom: 3px;
}
.albulle .gauche .cadre-titre {
	border-bottom: 1px solid;
	font-weight: normal;
}
.albulle .gauche .cadre-titre span,
.albulle .sous-dossiers .cadre-titre span {
	display: block;
	padding-left: 20px;
	background: no-repeat center left;
}

.albulle .dossiers {
	background-color: #e6ebf5;
	border-color: #c9ced6;
}
.albulle .dossiers .cadre-titre {
	background-color: #d9dee6;
	border-color: #c9ced6;
}
.albulle .dossiers .cadre-titre span {
	background-image: url(../images/blue-folder-open-image.png);
}

.albulle .panier {
	background-color: #ece6f5;
	border-color: #cfc9d6;
}
.albulle .panier .cadre-titre {
	background-color: #ded9e6;
	border-color: #cfc9d6;
}
.albulle .panier .cadre-titre span { background-image: url(../images/envelope-string.png); }
.albulle .panier p { font-size: 0.9em; }
.albulle .panier .plein { color: red; }
.albulle .asterisque { font-style: italic; }
.albulle .panier .selection-vide { margin: 4px; }

/* menu des dossiers et du panier */
.albulle .menu li,
.albulle .sous-dossiers li {
	margin: 1px;
	padding-left: 20px;
	line-height: 20px;
	background-repeat: no-repeat;
	background-position: left top 2px;
}
.albulle .menu .courant { font-weight: bold; }
.albulle .panier .menu { margin: 10px 0px 0px 15px; }
.albulle .panier li { margin-bottom: 6px; }

/* menu des sous-dossiers */
.albulle .menu ul { margin: 2px 0px 2px -20px; }
.albulle .menu ul li {
	padding-left: 24px;
	background-position: 4px;
	border-left: 1px dotted #009;
}

/* chemin des icones */
.albulle .puce {
	padding-left: 20px;
	background-repeat: no-repeat;
	background-position: left top;
}
.albulle .puce-dossier { background-image: url(../images/blue-folder-horizontal.png); }
.albulle .puce-vide { background-image: url(../images/image--exclamation.png); }
.albulle .puce-remonter { background-image: url(../images/arrow-curve-180-left.png); }
.albulle .puce-dossier-vide { background-image: url(../images/blue-folder-smiley-sad.png); }
.albulle .puce-download { background-image: url(../images/box-zipper.png); }
.albulle .puce-voir { background-image: url(../images/magnifier.png); }
.albulle .puce-vider { background-image: url(../images/cross.png); }

/**
 * BARRE DE MENU
 */

.albulle .menubar {
	margin-top: 3px;
	font-size: 1.2em
}
.albulle .menubar a,
.albulle .menubar span {
	display: block;
	float: left;
	height: 20px;
	line-height: 20px;
	margin-right: 3px;
	padding: 2px 4px;
}
.albulle .menubar .btn-page,
.albulle .menubar .btn-page-active { margin-right: 1px; }

/* Les boutons "Tout ajouter" & "Tout retirer" */
.albulle .bouton span {
	margin: 0px;
	width: 16px;
}
.albulle .bouton .tout { background: url(../images/envelope--plus.png) no-repeat center top 2px; }
.albulle .bouton .rien { background: url(../images/envelope--minus.png) no-repeat center top 2px; }
.albulle .bouton .diaporama { background: url(../images/projection-screen.png) no-repeat center top 2px; }
.albulle .bouton .galerie { background: url(../images/blue-document-view-thumbnail.png) no-repeat center top 2px; }

/* liens vers les pages */
.albulle .btn-page,
.albulle .bouton,
.albulle .diapo {
	border: 1px solid #e0e0e0;
	background-color: #f4f4f4;
}

/**
 * Le formulaire de défilement automatique
 */
.albulle .defilement {
	position: absolute;
	left: 22px;
	top: 9px;
	width: 300px;
	font-size: 1.1em;
	text-align: left;
}
.albulle .defilement .type_texte {
	width: 25px;
	text-align: center;
}
.albulle .defilement fieldset {
	border: 0px;
}
.albulle .defilement input {
	padding: 2px 4px;
	border: 1px solid #aaa;
}

/**
 * VIGNETTES
 */

/* Une vignette contient : une image miniature, les infos de l'image qu'elle représente
   un lien pour l'ajouter au panier. */

/* cadre de la vignette */
.albulle .vignette,
.albulle .vignette-diapo {
	float: left;
	position: relative;
	margin: 3px 3px 0 0;
	padding: 2px;
	text-align: center;
}
.albulle .vignette { width: 200px; }
.albulle .vignette-diapo {
	height: 80px;
	width: 80px;
	padding: 3px;
	background-color: #f4f4f4;
	border: 1px solid #d6d6d6;
}
.albulle .vignette-diapo .miniature_defaut {
	max-width: 50px;
	max-height: 50px;
}

/* survol de la vignette, et des boutons */
.albulle .vignette:hover,
.albulle .bouton:hover,
.albulle .btn-page:hover,
.albulle .btn-page-active,
.albulle .diapo-courante {
	background-color: #e4e4e4;
	border: 1px solid #d0d0d0;
	color: #c33;
}
.albulle .diapo-courante { background-color: #d0d0d0; border-color: #999; }

/* classe de l'image dans la vignette */
.albulle .miniature {
	display: block;
	width: 100%;
	height: 200px;
	object-fit: cover;
}
.albulle .vignette-diapo .miniature {
	width: 80px;
	height: 80px;
}

/* fiche infos de l'image */
.albulle .infosImg {
	padding: 3px 23px 3px 3px;
	font-size: 1em;
	text-align: left;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

/* bouton d'ajout / retrait du panier */
.albulle .puce-panier {
	position: absolute;
	right: 4px;
	bottom: 4px;
}

/* La classe de la diapo utilisé en mode diaporama */
.albulle .diapo {
	clear: both;
	margin: 3px 3px 0px 0px;
	position: relative;
	text-align: center;
}
.albulle .diapo .image {
	margin-top: 5px;
 /* Permet de décoller l'image du bord du cadre quand les boutons de navigations ne sont pas affichés */
	max-width: 95%;
	max-height: 71%;
	border: 1px solid black;
}
/* Liens précédente / suivante du diaporama */
.albulle .diapo .nav-diapos {
	height: 32px;
	margin-top: 2px;
	margin-left: auto;
	margin-right: 22px;
}
.albulle .diapo .nav-diapos span {
	display: block;
	float: right;
	height: 32px;
	width: 32px;
	margin: 0px 2px;
}
.albulle .diapo .nav-diapos a:hover {
	font-weight: normal;
}
/* pour annuler l'effet du survol des liens qui provoque un déplacement des icônes précédentes/suivante */
.albulle .diapo .precedente span { background: url(../images/arrow32-180.png) no-repeat center center; }
.albulle .diapo .suivante span { background: url(../images/arrow32.png) no-repeat center center; }
/* Le cadre des informations sur l'image courante lorsque l'on se trouve en mode diaporama */
.albulle .diapo .informations {
	margin-top: 5px;
	/* Petite subtilité nécessaire quand il n'y a qu'une image dans un dossier et que l'on se trouve en mode diaporama */
	width: 100%;
}
.albulle .diapo .fiche {
	float: left;
	max-width: 45%;
	min-width: 45%;
	margin: 5px;
	padding: 5px;
}
.albulle .diapo .fiche ul {
	margin-left: 10px;
	margin-top: 3px;
}
/* La fiche signalétique de l'image affichée */
.albulle .diapo .informations .fiche {
	text-align: left;
	font-size: 1.1em;
}
.albulle .diapo .informations span {
	font-weight: bold;
	text-decoration: underline;
}
.albulle .diapo .fiche {
	border-left: 4px solid #c33;
	background-color: #ece6f5;
}
.albulle .diapo .fiche ul span { text-decoration: none; }

/**
 * RAPPEL DES SOUS-DOSSIERS
 */
.albulle .sous-dossiers .cadre-contenu { padding: 10px; }
.albulle .sous-dossiers .cadre-titre span { background-image: url(../images/blue-folder-tree.png); }
.albulle .sous-dossiers ul li {
	float: left;
	width: 160px;
}

.fancybox-container { font-family: verdana, arial, helvetica, sans-serif; }

@media (max-width: 719px) {
	.albulle header {
		padding: 10px;
		padding-left: 70px;
		background-position: center left 10px;
		background-size: 50px;
	}
	.albulle h1 { font-size: 2.2em; }
	.albulle h2 { font-size: 1.2em; }

.albulle .gauche,
	.albulle .droite {
		display: block;
		width: 100%;
	}
	.albulle .droite {
		margin-left: 0;
	}
	.albulle .breadcrumb {
		line-height: 18px;
	}
	.albulle .contenu {
		margin-left: 0;
		margin-bottom: 0;
	}
	.albulle .diapo .fiche {
		float: none;
		max-width: none;
		margin: 5px;
		padding: 5px;
	}
	.albulle .menu li {
		line-height: 24px;
		background-position: left top 4px;
	}
	.albulle .sous-dossiers { display: none; }
}

@media (min-width: 720px) and (max-width: 1080px) {
	.albulle .gauche {
		width: 240px;
	}
	.albulle .droite {
		margin-left: -240px;
		width: 100%;
	}
	.albulle .contenu {
		margin-left: 243px;
		margin-bottom: 3px;
	}
}

@media (max-width: 1080px) {
	.albulle .vignette {
		width: 148px;
	}
	.albulle .miniature {
		width: 100%;
		height: 153px;	
	}
}
/* EOF */