/******** CSS du Site /a-c-portail-v-1/ Version 16-08-2007 ********/
/*
Ce script a été créé gratuitement pour vous (licence GPL) !
Merci de laisser les lignes suivantes pour faire connaitre le script...
*/
/*
Site conçu et développé par Patrick HAMY - Version 16-08-2007 Réf : /a-c-portail-v-1/
Proposé au téléchargement en état (Valide CSS et XHTML - W3C) (http://www.w3.org/)
Licence GPL (http://www.gnu.org/licenses/licenses.fr.html)
Site de l'auteur : http://www.patrickhamy.net
*/
/* Pour info : les (#) = les balises <div> et les (.) les class */
body
{
   padding: 3px; /* On ajoute un padding pour que les cadres ne collent pas sur les bords */
   width: auto;
   margin: auto;
   margin-bottom: 5px;    
   background: #3b3b3b;
   background-image: url(http://shr.seebach.info/images/fond.gif);
   background-repeat: inherit;
   font-family: "Trebuchet MS", "Times New Roman",serif;
   font-size: 0.9em;
   color: #000000;
}
h5 /* Ici cela correspond aux titres qui se trouvent en haut du corps de toutes les pages */
{
   background-color: #FFFFFF;
   text-decoration: none;
   font-family: Arial, "Times New Roman","Arial Black", Verdana, serif;
   text-align: center; /* Pour centrer le titre */
   color: #006699;
}
h4 /* Ici cela correspond aux titres qui se trouvent en haut du corps de toutes les pages */
{
   background-color: #006699;
   text-decoration: none;
   font-family: Arial, "Times New Roman","Arial Black", Verdana, serif;
   text-align: center; /* Pour centrer le titre */
   color: #FFFFFF;
}
h3 /* Ici cela correspond aux titres qui se trouvent en haut du corps de toutes les pages */
{
   text-align: center; /* Pour centrer le titre */
   font-family: Arial, "Times New Roman","Arial Black", Verdana, serif; /* Un titre en Arial Black c'est mieux */
}

#en_tete /*Emplacement de l'image de fond sous la bannière nommée fond-header */
{
   width: auto;
   height: 200px;
   background: #3b3b3b;
   background-image: url("http://shr.seebach.info/images/en_tete.gif");
   color: #000000;
   margin-bottom: 10px;
   border: 0px solid red;
   text-align : center; 
}

.image /* Pour centrer une image (ou d'autres choses d'ailleurs) */
{
   text-align : center;
}

#menu-g  /* Ici il s'agit du menu placé à gauche */
{
   float: left; /* Le menu flottera à gauche */
   width: 138px; /* Très important c'est la taille du menu */
   text-decoration:none;
   background-color: #EBEBEB;
   color: #000000;
   
}

a  /* Ici il s'agit des liens */
{
   text-decoration: none; /* Les liens ne seront plus soulignés */
   color: #000000; /* Les liens seront en noir */
   background-color: #FFFFFF;
   
}
a:hover /* Quand le visiteur pointe sur le lien */
{
   text-decoration:underline; /* Le lien ne sera pas souligné quand on pointera dessus */
   color: #CCCCFF; /* Ici c'est la couleur du lien quand on pointera dessus */
   background-color: #FFFFFF;
}

a:visited /* Les liens visités */
{
   color:gray;
   text-decoration:none; /* pas de soulignement */
   background-color:#FFFFFF;
}

.link /* lien */
{
   text-decoration: underline; /* Le lien sera souligné */
   color: #85000C; /* Ici c'est la couleur du lien quand on pointera dessus */
   background-color: #FFFFFF;
}

.element_menu_g /* Configuration globale du menu situé à gauche */
{
   font-family: "Trebuchet MS", "Times New Roman",serif;
   font-size: 0.8em;
   background-color: #EBEBEB;
   border: 0px solid red;
   padding-left: 0px;
   margin-bottom: 20px; /* Pour éviter que les éléments du menu ne soient trop collés */
   color: #000000;
   text-align : center;
   
}
.element_menu_d  /* Configuration globale du menu situé à droite */
{
   font-family: "Trebuchet MS", "Times New Roman",serif;
   font-size: 0.8em;
   background-color: #FFFFFF;
   border: 0px solid red;
   padding-left: 0px;
   margin-bottom: 20px; /* Pour éviter que les éléments du menu ne soient trop collés */
   color: #000000;
   text-align : center;
}
.element_menu a:hover  /* Effets sur les liens */
{   
   background-color: #B3B3B3;
   color: black;
}
#champ_recherche
{
	margin-bottom:3px;
	width:90%;
	text-align:center;
}
a.link_mail /* Non utilisé actuellement mais à garder */
{
  font-size: 9pt;
  color: green;
  background-color : white;
  text-decoration: underline;
  font-weight: bold ;
  font-family: "Trebuchet MS", serif;
}
a.link_hamy {
  font-size: 0.9em;
  color: gray; 
  background-color : white;
  text-decoration: none;
  font-weight: normal;
  font-family: "Trebuchet MS", serif;
}

.remonter /* Ici il est question du lien ( Merci, cliquez ici pour remonter en haut de la page ! ) */
{  
   color: #3EA1D0;
   background-color : white;
   text-decoration: none;
   font-weight: bold ;
   text-align: center; 
   font-family: "Trebuchet MS", "Times New Roman", Georgia, serif;
   font-size: 0.8em;
}

#urgence /* Ici il est question du bloc ( NUMEROS D'URGENCE ) */
{
   color: #3EA1D0;
   background-color : white;
   text-decoration: none;
   font-weight: bold ;
   text-align: center; 
   font-family: "Trebuchet MS", "Times New Roman", Georgia, serif;
   font-size: 0.8em;
}

#corps /* Le corps de la page */
{
   margin-left: 140px; /* Une marge à gauche pour pousser le corps, afin qu'il ne passe pas sous le menu */
   margin-bottom: 20px; /* Ca c'est pour éviter que le corps colle trop au pied de page en-dessous */
   text-align: left;
   padding: 5px; /* Pour éviter que le texte à l'intérieur du corps ne colle trop à la bordure */
   width: auto;
   color: #000000;
   background-color: #FFFFFF; /* Une couleur de fond pour le corps */
   font-family: "Trebuchet MS", "Times New Roman",serif;
   font-size: 0.9em;
   border: 0px solid red; /* Une bordure pour bien marquer les limites du corps et pour faire joli */
}

#corps_a /* Le corps de la page */
{
   margin-left: 140px; /* Une marge à gauche pour pousser le corps, afin qu'il ne passe pas sous le menu */
   margin-bottom: 20px; /* Ca c'est pour éviter que le corps colle trop au pied de page en-dessous */
   text-align: left;
   padding: 5px; /* Pour éviter que le texte à l'intérieur du corps ne colle trop à la bordure */
   width: auto;
   color: #000000;
   background-color: #000000; /* Une couleur de fond pour le corps */
   font-family: "Trebuchet MS", "Times New Roman",serif;
   font-size: 0.9em;
   border: 0px solid red; /* Une bordure pour bien marquer les limites du corps et pour faire joli */
}

.corps-g /* Alignement du texte à gauche */
{
   color: #000000;
   background-color: #FFFFFF;
   text-align: left;
   font-family: "Trebuchet MS", "Times New Roman", Arial, "Arial Black", Times, serif;
   font-size: 0.9em;
}

blockquote /* Non utilisé actuellement mais à garder */
{
   text-align: justify; /* La citation sera justifiée */
   font-size: 1em;
}
.signature /* Pour aligner à droite */
{
   text-align: right; 
   font-family: "Trebuchet MS", "Times New Roman", serif;
   font-size: 100%;
}
blockquote
{
   text-align: justify; /* La citation sera justifiée */
}
#pied_de_page /* Ici il s'agit du bloc pied de page */
{
   padding: 5px;
   text-align: center;
   margin-left: 140px;
   width: auto;
   color: #000000;
   background-color: #EBEBEB;
   background-image: url(""); /* Image du pied de page (footer-2.png) */
   background-repeat: repeat-x;
   font-size: 0.7em;
   font-weight: normal;
   font-family: "Trebuchet MS","Times New Roman", Times, serif;
   border: 0px solid red;
}
a img /* Afin que les images ne soient pas encadrées en violet */
{
   border: none;
}

#table-g a:hover
{
    background : #76B3D7;
	color: #FFFFFF;
	text-decoration:none;
	width: 135px;
	border: 1px solid rgb(158,160,161);
}
#table-d a:hover
{
    background : #76B3D7;
	color: #FFFFFF;
}

.souligne { text-decoration: underline; 
}

.surligner { background: #B4FA78;
}

.barre { text-decoration: line-through; 
}

.italique { font-style: italic; 
}

.gras { font-weight:bold; 
}

.photoflot p {
   margin:0;
   padding:0;
}

.photoflot img {
   float:left;
   background-color:#ffffff;
   border:none;
   margin: 0 0 0px 5px;
   padding:5px;
}

/***** CSS Patrick Hamy - Web agency - Menus Horizontal *****/
div#menu_horizontal {
	list-style-type: none;
	width: auto;
    margin-top: 150px;
	color: #000000;
	height: 30px;
	background-color: transparent;
	border: 1px solid transparent;
}

div#menu_horizontal ul {
list-style-type : none;
margin : 0;
}

div#menu_horizontal li {
padding : 0 0.5em;
line-height : 30px;
}

div#menu_horizontal li.bouton_gauche {
float : left;
border-right : 1px solid rgb(158,160,161);
}

div#menu_horizontal li.bouton_droite {
float : right;
border-left : 1px solid rgb(158,160,161);
}

div#menu_horizontal a {
color : black;
background-color: rgb(254, 255, 179);
text-decoration : none;
padding : 0 0.5em;
font : 0.8em "Trebuchet MS", serif;
}

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

div#menu_horizontal a img {
border : none;
padding :  0 0.3em;
}

/***** CSS Patrick Hamy - Web agency - Menus en onglets *****/

#menu
{
        border-bottom : 1px solid #9EA0A1;
        padding-bottom : 25px;
}

#onglets
{
        position : absolute;
        border : 1px solid transparent;
        padding : 0;
        font : bold 11px Batang, arial, serif;
        list-style-type : none;
        left : 50%;
        margin-top : 0;
        width: auto;
		margin-left : -350px; /* la moitié de width (-496 initialement) */
		font-family: "Trebuchet MS", "Times New Roman",serif;
}

#onglets li
{
    float : left;
    height : 25px;
	color: #000000;
    background-color: #F4F9FD;
    margin : 1px 0px 0px 0px !important;  /* Pour les navigateurs autre que IE */    
    border : 1px solid #9EA0A1;
}

#onglets li.active
{ 
    border-bottom: 1px solid #fff;
    background-color: #fff;
	color: #000000;
}

#onglets a
{
    display : block;
	background-color: #FEFFB3;
    color : #666;
    text-decoration : none;
    padding : 4px;
}

#onglets a:hover
{
    background : #76B3D7;
	color: #FFFFFF;
}

#onglets .sousMenu
{ 
   display: none;
   list-style-type: none; 
   margin: 0;
   padding: 1px; 
   border: 0;
}

#onglets .sousMenu li
{ 
   float: none; 
   margin: 0;
   padding: 0; 
   border: 0;
   width: 149px; 
   border-top: 1px solid transparent;
   border-right: 1px solid transparent; 
}
   
#onglets li:hover > .sousMenu 
{ 
   display: block;
}

#onglets .sousMenu li a:link,
#onglets .sousMenu li a:visited
{ 
   display: block; 
   color: #FFF; 
   margin: 0; 
   border: 0; 
   text-decoration: none; 
   background: #CCCCCC;
}

#onglets .sousMenu li a:hover
{ 
   background-image: none; 
   background-color: #999999;
}   

/* CSS du Tableau au centre de la page index, trouvé sur le net, (impéccable) que je réutilise en partie ici */

caption /* Titre du tableau */
{
   margin: auto; /* Centre le titre du tableau */
   font-family: Arial, Times, "Times New Roman", serif;
   font-weight: bold;
   background : white;
   font-size: 1.2em;
   color: #666699;
   margin-bottom: 20px; /* Pour éviter que le titre ne soit trop collé au tableau en-dessous */
}

table /* Le tableau en lui-même */
{
   margin: auto; /* Centre le tableau */
   border: 1px outset #76B3D7; /* Bordure du tableau avec effet 3D (outset) */
   border-collapse: collapse; /* Colle les bordures entre elles */
}

.table-ligne1-centre 
{
   font-size : 0.9em; 
   font-family : "Trebuchet MS", "Times New Roman",serif; 
   color : #333366; 
   text-align : center; 
   background-color : #FFFFFF; 
}

.table-ligne1-centre_a
{
   font-size : 0.9em; 
   font-family : "Trebuchet MS", "Times New Roman",serif; 
   color : #333366; 
   text-align : center; 
   background-color : #000000; 
}

div#table-ligne1-centre a:hover
{
   text-decoration : underline;
}  

th /* Les cellules d'en-tête */
{
   background-color: #3b3b3b;
   color: white;
   font-size: 1.1em;
   font-family: Arial, "Arial Black", Times, "Times New Roman", serif;
   text-align: center;
}

td /* Les cellules normales */
{
   border: 1px solid black;
   font-family: "Trebuchet MS", Verdana, Times, "Times New Roman", serif;
   text-align: left; /* Tous les textes des cellules seront centrés*/
   padding: 5px; /* Petite marge intérieure aux cellules pour éviter que le texte touche les bordures */
}

.surt-rub {
	padding-left: 10px; font-size: 13px; margin-bottom: 3px; border-bottom: #85000c 1px solid; font-family: 'Arial black', ArialBold
}

.surt-rub1 {
	width: 420px; padding-left: 10px; font-size: 13px; margin-bottom: 3px; border-bottom: #85000c 1px solid; font-family: 'Arial black', ArialBold
}

.couleur {
	color: #85000c;
}

.couleur-bleu {
    color: #666699;
}

.couleur-red {
	color: #FF0000;
}

.couleur-gray {
	color: gray;
}

.couleur-tit {
	color: #1c2951;
}

.ptit {
	font-weight: bold; font-size: 14px; color: #85000c;
}

.datedi {
	font-size: 11px; 
	margin-bottom: 10px; color: gray; 
	font-family: Arial, Geneva, Helvetica, sans-serif; 
	text-align: justify
}

.datedi_moyen {
	font-size: 14px; margin-bottom: 10px; color: gray; font-family: Arial, Geneva, Helvetica, sans-serif; text-align: left
}

.trait_gauche {
    border-left: 1px solid black;
    padding-left: 5px;
    margin-left: 5%;
}

.marge_haut {
	margin-top: 6%;
}

.bord_bas {
	border-bottom: #85000c 1px solid;
}

#photo_presse {
	margin-top: 50px;
}

.table_corps /* Le tableau en lui-même */
{
   margin: auto; /* Centre le tableau */
   border: 0; /* Bordure du tableau avec effet 3D (outset) */
   border-collapse: collapse; /* Colle les bordures entre elles */
}	

.td /* Les cellules normales */
{
   border: 0;
   font-family: "Trebuchet MS", Verdana, Times, "Times New Roman", serif;
   text-align: left; /* Tous les textes des cellules seront centrés (modif. à gauche)*/
   padding: 5px; /* Petite marge intérieure aux cellules pour éviter que le texte touche les bordures */
}

.td_centre /* Les cellules normales */
{
   border: 0;
   font-family: "Trebuchet MS", Verdana, Times, "Times New Roman", serif;
   text-align: center; /* Tous les textes des cellules seront centrés*/
   padding: 5px; /* Petite marge intérieure aux cellules pour éviter que le texte touche les bordures */
}

.th /* Les cellules d'en-tête */
{
   background-color: #FFFFFF;
   color: white;
   font-size: 1.1em;
   font-family: Arial, "Arial Black", Times, "Times New Roman", serif;
   text-align: center;
}

.th_fond /* Les cellules d'en-tête */
{
   background-color: #FAFAFA;
   color: white;
   font-size: 1.1em;
   font-family: Arial, "Arial Black", Times, "Times New Roman", serif;
   text-align: center;
}

.titre_lien /* Titre pour liens accueil*/ 
{
	font-size: 1.8em; 
	font-family: Georgia, "Times New Roman", Times, serif;
	line-height: 100%;
	padding-bottom: 7px; 
}

.titre_lien_petit /* Titre pour liens accueil*/ 
{
	font-size: 1.4em; 
	font-family: Georgia, "Times New Roman", Times, serif;
	line-height: 100%;
	padding-bottom: 7px; 
}

/* Popup*/

a.tooltip {
    color: #666699;
	font-weight: bold;
	text-decoration: none;
}
a.tooltip:hover {
    color:#CCCCFF;
	border: 0; 
    position: relative; 
    z-index: 500; 
    text-decoration: underline;
}
a.tooltip:visited {
    color: gray;
	font-weight: normal;
	text-decoration: underline;
}
a.tooltip em {
    display:none;
} 
a.tooltip:hover em {
    font-style: normal;
	font-weight:normal; 
    display: block; 
    position: absolute; 
    top: 20px; 
    left: +20px; 
    padding: 5px; 
    color: #85000c; 
    border: 1px solid #bbb; 
    background: #ffc; 
    width:200px;
}
a.tooltip:hover em span {
    position: absolute; 
    top: -7px; 
    left: 15px;
    height: 7px; 
    width: 11px; 
    background: transparent url("http://www.shr.seebach.info/images/infobulle.gif"); 
    margin:0; 
    padding: 0; 
    border: 0;
}

/* Bulle avec image */

h1 {
    font-family:arial, verdana, sans-serif; 
    font-size:16px;
    font-weight:bold;  
    color:#62c0f4;  
}   
a.bulle {
    position:relative;
    color:#85000c; 
    text-decoration:underline; 
    font-family:arial, verdana, sans-serif; 
    text-align:center; 
    font-size:11px;
}  
a.bulle:hover {
    color: #CCCCFF; /* Ici c'est la couleur du lien quand on pointera dessus */
	text-decoration:underline; /* Le lien ne sera pas souligné quand on pointera dessus */
	background: none; 
    z-index: 50; 
}
a.bulle:visited {
    color:gray;
	text-decoration:none;
}  
a.bulle span { 
    display: none;
}   
a.bulle:hover span {
    display: block; 
    position: absolute;
    top: -10px; 
    left: 40px;
    font-family:arial, verdana, sans-serif; 
    text-align:justify; 
    font-size:12px;
    font-weight:normal;
    width:320px;
    background: white;
    padding: 5px;
    border: 1px solid #62c0f4;
    border-left: 10px solid #62c0f4;
}

/*Bulle avec position différente*/
   
a.bulle1 {
    position:relative;
    color:#85000c; 
    text-decoration:underline; 
    font-family:arial, verdana, sans-serif; 
    text-align:center; 
    font-size:11px;
}  
a.bulle1:hover {
    background: none; 
    z-index: 50; 
}  
a.bulle1 span { 
    display: none;
}   
a.bulle1:hover span {
    display: block; 
    position: absolute;
    top: -220px; 
    left: -350px;
    font-family:arial, verdana, sans-serif; 
    text-align:justify; 
    font-size:12px;
    font-weight:normal;
    width:320px;
    background: white;
    padding: 5px;
    border: 1px solid #62c0f4;
    border-left: 10px solid #62c0f4;
}

/*zoom sur image 200px X 264px*/

.zoom {
	height:400px;
}
.zoom p {
	text-align:center;
}
.zoom img {
	width:200px;
	height:264px;
	border: 1px solid #62c0f4;
	background: white;
    padding: 5px;
}
.zoom img:hover {
	width:340px;
	height:449px;
	border: 1px solid #62c0f4;
	background: white;
    padding: 5px;
}

/*zoom 320px X 213px*/

.zoom1 {
	height:400px;
}
.zoom1 p {
	text-align:center;
}
.zoom1 img {
	width:320px;
	height:213px;
}
.zoom1 img:hover {
	width:416px;
	height:277px;
}

/*posisitonnement image*/

.img1 {
    background-image:url("");
    width: 320px;
    height: 213px;
	position: absolute;
    top: 22em;
    right: 10%;
}

/*bordure*/

.img_border {
	border: 1px solid #62c0f4;
	background: white;
    padding: 5px;
}

.img_border_a {
	border: 1px solid #62c0f4;
	background-image: url("http://shr.seebach.info/images/bookBakground.jpg");
    padding: 5px;
	color: #da524b;
	text-decoration: none;
}

.img_border_b {
	border: 1px solid #000000;
}

/*lightbox 2.04*/

#lightbox { 
position : absolute; 
left : 0; 
width : 100%; 
z-index : 100; 
text-align : center; 
line-height : 0; 
} 
#lightbox img { 
width : auto; 
height : auto; 
} 
#lightbox a img { 
border : none; 
} 
#outerImageContainer { 
position : relative; 
background-color : #fff; 
width : 250px; 
height : 250px; 
margin : 0 auto; 
} 
#imageContainer { 
padding : 10px; 
} 
#loading { 
position : absolute; 
top : 40%; 
left : 0%; 
height : 25%; 
width : 100%; 
text-align : center; 
line-height : 0; 
} 
#hoverNav { 
position : absolute; 
top : 0; 
left : 0; 
height : 100%; 
width : 100%; 
z-index : 10; 
} 
#imageContainer > #hoverNav { 
left : 0; 
} 
#hoverNav a { 
outline : none; 
} 
#prevLink, #nextLink { 
width : 49%; 
height : 100%; 
display : block;
background : transparent url(data:image/gif;base64,AAAA); /* Trick IE into showing hover */
} 
#prevLink { 
left : 0; 
float : left; 
} 
#nextLink { 
right : 0; 
float : right; 
} 
#prevLink:hover, #prevLink:visited:hover { 
background : url(http://www.shr.seebach.info/images/prevlabel.gif) no-repeat left 15%; 
} 
#nextLink:hover, #nextLink:visited:hover { 
background : url(http://www.shr.seebach.info/images/nextlabel.gif) no-repeat right 15%; 
} 
#imageDataContainer { 
font : 10px Verdana, Helvetica, sans-serif; 
background-color : #fff; 
margin : 0 auto; 
line-height : 1.4em; 
overflow : auto; 
width : 100%; 
} 
#imageData { 
padding : 0 10px; 
color : #666; 
} 
#imageData #imageDetails { 
width : 70%; 
float : left; 
text-align : left; 
} 
#imageData #caption { 
font-weight : bold; 
} 
#imageData #numberDisplay { 
display : block; 
clear : left; 
padding-bottom : 1em; 
} 
#imageData #bottomNavClose { 
width : 66px; 
float : right; 
padding-bottom : 0.7em; 
outline : none; 
} 
#overlay { 
position : absolute; 
top : 0; 
left : 0; 
z-index : 90; 
width : 100%; 
height : 500px; 
background-color : #000; 
}

/* ================================================================ 
This copyright notice must be untouched at all times.

The original version of this stylesheet and the associated (x)html
is available at http://www.cssplay.co.uk/menu/lightbox.html
Copyright (c) 2005-2007 Stu Nicholls. All rights reserved.
This stylesheet and the associated (x)html may be modified in any 
way to fit your requirements.
=================================================================== */
/* common styling */

/*a {color:#000;}
a:hover {text-decoration:none;}
a:visited {color:#000;}*/ /*déjà utilisé par hamy-style*/

/* slides styling */

.photo {width:635px; text-align:left; position:relative; margin:0 auto;}

.photo ul.topic {padding:0; margin:0; list-style:none; width:635px; height:auto; position:relative; z-index:10;}

.photo ul.topic li {display:block; width:125px; height:31px; float:left;}
.photo ul.topic li a.set {display:block; font-size:11px; width:124px; height:30px; text-align:center; line-height:30px; color:#000000; text-decoration:none; border:1px solid #fff; border-width:1px 1px 0 0; background:#ccc; font-family:verdana, arial, sans-serif;}

.photo ul.topic li a ul, 
.photo ul.topic li ul 
{display:none;}

.photo ul.topic li.active a
{color:#000; background:#bbb;}

.photo ul.topic li a:hover,
.photo ul.topic li:hover a
{color:#fff; background:#aaa;}

.photo ul.topic li.active ul
{display:block; position:absolute; left:0; top:31px; list-style:none; padding:0; margin:0; height:375px; background-image:url(http://shr.seebach.info/images/fond.gif); width:464px; padding:40px 60px; border:1px solid #FF0000; z-index:1;}

.photo ul.topic li a:hover ul, 
.photo ul.topic li:hover ul
{display:block; position:absolute; left:0; top:31px; list-style:none; padding:0; margin:0; height:375px; background-image:url(http://shr.seebach.info/images/fond.gif); width:464px; padding:40px 60px; border:1px solid #FF0000; z-index:100;}

.photo ul.topic li ul li
{display:inline; width:112px; height:87px; float:left; border:1px solid #fff; margin:1px;}

.photo ul.topic li ul li a
{display:block; width:110px; height:85px; cursor:default; float:left; text-decoration:none; background:#444; border:1px solid #888;}

.photo ul.topic li ul li a img
{display:block; width:100px; height:75px; border:5px solid #eee;}

.photo ul.topic li a:hover ul li a:hover, 
.photo ul.topic li:hover ul li a:hover 
{white-space:normal; position:relative;}

.photo ul.topic li a:hover ul li a:hover img, 
.photo ul.topic li:hover ul li a:hover img 
{position:absolute; left:-50px; top:-32px; width:200px; height:150px; border-color:#fff;}

/* videobox */

#lbOverlay {
	position: absolute;
	left: 0;
	width: 100%;
	background-color: #000;
	cursor: pointer;
}

#lbCenter, #lbBottomContainer {
	position: absolute;
	left: 50%;
	overflow: hidden;
	background-color: #fff; text-align: center; padding: 5px;
}

.lbLoading {
	background: #fff url(http://shr.seebach.info/images/loading.gif) no-repeat center center;
}

#lbImage {
	border: 10px solid #fff;
}

#lbPrevLink, #lbNextLink {
	display: block;
	position: absolute;
	top: 0;
	width: 50%;
	outline: none;
}

#lbPrevLink {
	left: 0;
}

#lbPrevLink:hover {
	background: transparent url(http://shr.seebach.info/images/prevlabel.gif) no-repeat 0% 15%;
}

#lbNextLink {
	right: 0;
}

#lbNextLink:hover {
	background: transparent url(http://shr.seebach.info/images/nextlabel.gif) no-repeat 100% 15%;
}

#lbBottom {
	font-family: Verdana, Helvetica, sans-serif;
	font-size: 10px;
	color: #666;
	line-height: 1.4em;
	text-align: left;
	border: 5px solid #fff;
	border-top-style: none;
}

#lbCloseLink {
	display: block;
	float: right;
	width: 66px;
	height: 22px;
	background: transparent url(http://shr.seebach.info/images/close.gif) no-repeat center center; 
	margin: 5px 0;
}

#lbCaption, #lbNumber {
	margin-right: 71px;
}

#lbCaption {
	font-weight: bold;
}

.opacite  {  
    opacity: 1.0; }

.opacite:hover  {  
    opacity: 0.3; }