/******* ZEN UNIV LORRAINE ********/  

/*affichage  LABO DE RECHERCHE et pole scientifique ET COMPOSANTES */
 
  
   
/*Logos */ 
.node-fiche-laboratoire .field-name-field-logo {float:right; margin:-1em 0em 1em 1em;}
/*Image polescientifique */ 
.node-type-fiche-ps .field-name-field-photo{float:left;margin:0em 1em 1em 1em;}

/*Denomination fiche labo */ 
.node-fiche-laboratoire .field-name-field-sigle {font-weight:bold;margin-top:1em;font-size:200%}
.node-fiche-laboratoire .field-name-field-type-unite{float:left;}
.node-fiche-laboratoire .field-name-field-label:before{content:" - ";display:inline-block; float:left;margin-left:.5em;margin-right:.5em;}
.node-fiche-laboratoire .field-name-field-label .field-item{display:inline-block;float:left;}

/*direction pole scientifique*/ 
.node-type-fiche-ps .field-name-field-direction {float:left;}
.node-type-fiche-ps .field-name-field-direction  .field-item{font-weight:bold;}    
 
/**** reset des fieldset *****/ 
.node-type-fiche-ps fieldset, .node-fiche-laboratoire fieldset {clear:both} 
.node-fiche-laboratoire  div.field-name-field-type-unite {margin-bottom: 1em} 

/**** mise en forme des titres de légende ****/
.node-type-fiche-ps fieldset  span.fieldset-legend,
.node-fiche-laboratoire fieldset  span.fieldset-legend {text-transform:normal; display:inline-block;}

html.js .node-fiche-laboratoire fieldset.collapsible .fieldset-legend,
html.js .node-type-fiche-ps   fieldset.collapsible .fieldset-legend {
    background:#666 url("../images/menu-expanded_i.png") no-repeat scroll 5px 65%;
    padding-left:15px;
}
html.js .node-fiche-laboratoire fieldset.collapsed .fieldset-legend,html.js .node-type-fiche-ps fieldset.collapsed .fieldset-legend {
    background-image:url("../images/menu-collapsed_i.png");
    background-position:5px 50%;
}

.fieldset-legend a:link,
.fieldset-legend a:visited {color:#fff;text-decoration:none;}

.fieldset-legend a:hover,
.fieldset-legend a:focus {
  background-color:transparent !important; color:#ffef44; text-decoration:none;}


  
 /*marge des paragraphes dans les textes longs */   
.node-fiche-laboratoire fieldset div.field  div.field-items div.field-item p,
.node-type-fiche-ps  fieldset div.field  div.field-items div.field-item p {margin:0 0 0.5em 0; padding:0;} 
 
.node-fiche-laboratoire fieldset div.field  div.field-items div.field-item ul,
.node-type-fiche-ps  fieldset div.field  div.field-items div.field-item ul {margin:0 .5em 0 30px; padding:0;}
 
/* adresse et téléphone */
.field-name-field-adresse-2, .field-name-field-site-web-labo, 
.field-name-field-secretariat, .field-name-field-courriel {margin-top:12px;}
 
/*courriel et site web */    
.node-fiche-laboratoire .field-name-field-courrielb div.field-label,
.node-type-fiche-ps .field-name-field-email div.field-label,
.node-fiche-laboratoire .field-name-field-courrielb div.field-items,
.node-fiche-laboratoire .field-name-field-site div.field-items,
.node-type-fiche-ps .field-name-field-email div.field-items, {float:left;}
 
.node-fiche-laboratoire .field-name-field-courrielb div.field-items p,
.node-fiche-laboratoire .field-name-field-site div.field-items p,
.node-type-fiche-ps .field-name-field-email div.field-items p {margin:0 !important;padding:0;}
.node-type-fiche-ps .field-name-field-direction {margin:2em 5px 1em 5px !important;}
  
/**** FACEBOOK + TWITTER ****/
.node-type-fiche-composantes #facebook.bloc, 
.node-type-fiche-composantes #twitter.bloc {
  margin:0 0 10px; height:24px; padding:/*0 7px */7px; width:206px;}
#facebook.bloc {background:#5560a4;} 
#twitter.bloc {background:#3cadca;}
#facebook.bloc a, #facebook.bloc a:visited, #twitter.bloc a, #twitter.bloc a:visited {
  color:white !important; font-size:1.2em; margin:5px 0; text-decoration:none!important;}
#facebook.bloc a:hover, #twitter.bloc a:hover {background:none; text-decoration:underline!important;}
  
/***** spécial fiche labo : photo du directeur *******/
.node-type-fiche-laboratoire .field-name-field-photo-contact {float:right;}

/****************************gestion de la galerie image***********************************************/        
.node-type-fiche-ps .field-name-field-galerie-ps {
  border:1px solid #000 !important; 
  display:table; 
  margin:0 auto 1em; 
  padding:10px 10px 0 10px !important; 
  text-align:center; 
}
.node-type-fiche-ps .field-name-field-galerie-ps div.field-item {display:inline-block; float:left; padding:5px;}
.node-type-fiche-ps .field-name-field-galerie-ps div.field-item:after {
  content:url("../images/fl_noir.png");
  cursor:pointer;
  display:block; 
  height:15px;
  left:50px; 
  margin:0;
  padding:0;
  position:relative;
  top:-2px;
  width:15px;
}
.node-type-fiche-ps .field-name-field-galerie-ps div.field-items a {
  display:block;
  height:70px;
  margin:0;
  padding:0;
  width:100px;
}
.node-type-fiche-ps .field-name-field-galerie-ps div.field-items a:hover {
  background-color:transparent !important; 
  border:2px solid #ff0;
}
.node-type-fiche-ps .field-name-field-galerie-ps .field-items .field-item a img  {}



/* SpryTabbedPanels.css - version 0.4 - Spry Pre-Release 1.6.1 */

/* Copyright (c) 2006. Adobe Systems Incorporated. All rights reserved. */

/* Horizontal Tabbed Panels
 *
 * The default style for a TabbedPanels widget places all tab buttons
 * (left aligned) above the content panel.
 */

/* This is the selector for the main TabbedPanels container. For our
 * default style, this container does not contribute anything visually,
 * but it is floated left to make sure that any floating or clearing done
 * with any of its child elements are contained completely within the
 * TabbedPanels container, to minimize any impact or undesireable
 * interaction with other floated elements on the page that may be used
 * for layout.
 *
 * If you want to constrain the width of the TabbedPanels widget, set a
 * width on the TabbedPanels container. By default, the TabbedPanels widget
 * expands horizontally to fill up available space.
 *
 * The name of the class ("TabbedPanels") used in this selector is not
 * necessary to make the widget function. You can use any class name you
 * want to style the TabbedPanels container.
 */

.TabbedPanels, #TabbedPanels1 {
  clear: none;
  float: left;
  margin: 0px;
  padding: 0px;
  width: 100%; /* IE Hack to force proper layout when preceded by a paragraph. (hasLayout Bug)*/
}

/* This is the selector for the TabGroup. The TabGroup container houses
 * all of the tab buttons for each tabbed panel in the widget. This container
 * does not contribute anything visually to the look of the widget for our
 * default style.
 *
 * The name of the class ("TabbedPanelsTabGroup") used in this selector is not
 * necessary to make the widget function. You can use any class name you
 * want to style the TabGroup container.
 */
.TabbedPanelsTabGroup {margin:0px; padding:0px;}

/* This is the selector for the TabbedPanelsTab. This container houses
 * the title for the panel. This is also the tab "button" that the user clicks
 * on to activate the corresponding content panel so that it appears on top
 * of the other tabbed panels contained in the widget.
 *
 * For our default style, each tab is positioned relatively 1 pixel down from
 * where it wold normally render. This allows each tab to overlap the content
 * panel that renders below it. Each tab is rendered with a 1 pixel bottom
 * border that has a color that matches the top border of the current content
 * panel. This gives the appearance that the tab is being drawn behind the
 * content panel.
 *
 * The name of the class ("TabbedPanelsTab") used in this selector is not
 * necessary to make the widget function. You can use any class name you want
 * to style this tab container.
 */
.TabbedPanelsTab {
  background-color: #000;
  border-top: solid 1px #999;
  border-right: solid 1px #999;
  border-bottom: solid 1px #999;
  border-left: solid 1px #ccc;
  color:#fff;
  cursor: pointer;
  float: left;
  font: bold 0.9em sans-serif;
  list-style: none;
  margin: 0px 1px 0px 0px;
  padding: 4px 10px;
  position: relative;
  top: 1px;
  -moz-user-select: none;
  -khtml-user-select: none;
}

/* This selector is an example of how to change the appearnce of a tab button
 * container as the mouse enters it. The class "TabbedPanelsTabHover" is
 * programatically added and removed from the tab element as the mouse enters
 * and exits the container.
 */
.TabbedPanelsTabHover {/*background-color:#ccc;*/color:#ff0;}

/* This selector is an example of how to change the appearance of a tab button
 * container after the user has clicked on it to activate a content panel.
 * The class "TabbedPanelsTabSelected" is programatically added and removed
 * from the tab element as the user clicks on the tab button containers in
 * the widget.
 *
 * As mentioned above, for our default style, tab buttons are positioned
 * 1 pixel down from where it would normally render. When the tab button is
 * selected, we change its bottom border to match the background color of the
 * content panel so that it looks like the tab is part of the content panel.
 */
.TabbedPanelsTabSelected {
  background-color:#fff;
  border-bottom: 1px solid #fff;
  color:#000;
}

/* This selector is an example of how to make a link inside of a tab button
 * look like normal text. Users may want to use links inside of a tab button
 * so that when it gets focus, the text *inside* the tab button gets a focus
 * ring around it, instead of the focus ring around the entire tab.
 */
.TabbedPanelsTab a {
  color: black;
  text-decoration: none;
}

/* This is the selector for the ContentGroup. The ContentGroup container houses
 * all of the content panels for each tabbed panel in the widget. For our
 * default style, this container provides the background color and borders that
 * surround the content.
 *
 * The name of the class ("TabbedPanelsContentGroup") used in this selector is
 * not necessary to make the widget function. You can use any class name you
 * want to style the ContentGroup container.
 */
.TabbedPanelsContentGroup {
  background-color: #fff;
  border-bottom: solid 1px #ccc;
  border-left: solid 1px #ccc;
  border-right: solid 1px #999;
  border-top: solid 1px #999;
  clear: both;
}

/* This is the selector for the Content panel. The Content panel holds the
 * content for a single tabbed panel. For our default style, this container
 * provides some padding, so that the content is not pushed up against the
 * widget borders.
 *
 * The name of the class ("TabbedPanelsContent") used in this selector is
 * not necessary to make the widget function. You can use any class name you
 * want to style the Content container.
 */
.TabbedPanelsContent {padding: 4px;}



/* This selector floats the content panels for the widget so that they render to the right of the tabbed buttons. */
table.tableTabs {border-collapse:collapse; margin-top:0 !important; width:100%}

table.tableTabs tr:nth-child(odd),
table.views-table tr:nth-child(odd) {background:#dfdfe3/*b8cbe4*/; border-width:0px;}
table.tableTabs tr {border-width:0px !important;}
table.tableTabs td.active {background:transparent;}
table.tableTabs tr:nth-child(even),
table.views-table tr:nth-child(even) {background:#efeff5/*d8e0f0*/;}
/*table.tableTabs tr:first-child {background:#fff;color:#333;}*/

table.tableTabs thead th {background:#667; color:#fff; padding:5px; text-align:center;}
table.tableTabs thead th:first-child {border-right:1px dotted #fff; text-align:left; width:70%;}
table.tableTabs thead th:last-child {border-left:1px dotted #fff; width:12%;}
table.tableTabs tr.legende {background:#667; color:#fff; padding:5px; text-align:left;}
table.tableTabs caption {background:#fff; color:#333; padding:5px; text-align:left;}

table.tableTabs  caption a:link,
table.tableTabs  caption a:visited {color:#333; text-decoration:none; font-weight:bold; font-size:1.2em;}




/*affichage fiche  composantes et contact *****/
  
/*** labels légende *****/  
html.js .node-type-fiche-composantes fieldset span.fieldset-legend {
  text-transform:uppercase; display:inline-block;}

html.js .node-type-fiche-composantes fieldset.collapsible .fieldset-legend {
  background:#666 url("../images/menu-expanded_i.png") no-repeat scroll 5px 65%;}

html.js .node-type-fiche-composantes fieldset.collapsed .fieldset-legend {
    background-image:url("../images/menu-collapsed_i.png");
    background-position: 5px 50%;}

html.js .node-type-fiche-composantes .fieldset-legend a:link,
html.js .node-type-fiche-composantes .fieldset-legend a:visited {color:#fff; text-decoration:none;}

html.js .node-type-fiche-composantes .fieldset-legend a:hover
/* .node-type-fiche-composantes .fieldset-legend a:focus***/ {
  background-color:transparent !important ; color:#FF0;text-decoration:none;}



#blocsDroit {float:right;}
#blocsDroit .bloc {height:auto; font-size:.9em; padding: 5px 10px; width:200px;}
#blocsDroit .bloc a:link,
#blocsDroit .bloc a:visited {color:#fff; text-decoration:underline;}

/************* spécial pages composantes ***************/
#boutons {background:#fff; margin:0; height:110px;}
#boutons ul {/*border:1px dotted #ccc; */display:table; list-style-type:none; margin:0 0 10px; padding:0; width:218px;}
li.boutonmail, li.boutonweb {
  display:table-cell; 
  font-size:1.0em; 
  height:72px !important; 
  line-height:1.0em;
  margin:0 0 10px; 
  padding:auto 5px; 
  position:relative;
  text-align:center; 
  vertical-align:middle;
  width:103px;
}
li.boutonmail {
  background:rgb(255, 70, 45); 
  border-bottom:0px !important;
  float:left;
  padding-top:24px;
}
li.boutonweb {
  background:rgb(255, 114, 0); float:right; padding-top:24px; z-index:100;}
li.boutonmail a:link, li.boutonmail a:visited, 
li.boutonweb a:link, li.boutonweb a:visited {color:#fff; text-decoration:none;}
#boutons a:hover, li.boutonmail a:hover, li.boutonweb a:hover {background:transparent!important; color:#000!important; text-decoration:underline;}
/*************** *******/

#coordonnees.bloc {background-color:#4fc36c; padding-top:15px;}
#chiffres.bloc {background-color: #00a08f; padding-top:15px;}
#map.bloc{background-color:#F90; padding-top:10px;}

#blocsDroit .bloc h3 {
  border-top:0px solid transparent; 
  color:#fff; 
  font-family:"Oswald"; 
  font-size:1.4em; 
  font-weight:normal; 
  letter-spacing:.5px; 
  line-height:1.0em; 
  margin:5px 0;
}
#blocsDroit .bloc .field {margin-bottom:.5em;}
#blocsDroit .bloc .field p {margin:0;padding:0;}
#map.field {margin-top:.5em;}

#blocsDroit #chiffres.bloc .field {display:inline-block}
#blocsDroit #chiffres.bloc strong:before {content:" "; display:block; height:0px;}

.node-fiche-contact .field-name-body,
.node-fiche-composantes .field-name-body,
.node-fiche-composantes #node_fiche_composantes_full_group_direction_comp,
.node-fiche-composantes #node_fiche_composantes_full_group_infos {margin-right:230px;}

.node-type-fiche-composantes .field-name-field-photo-contact img,
.node-type-fiche-composantes .field-name-field-photo-contact-2 img,
.field-name-field-photo-directeur-adjoint, .field-name-field-photo-da2,
/*.field-name-field-image*/ {float:right; margin:0 0 10px;}

/******* SPÉCIAL PAGE MINES 
(l'équipe de direction est détaillée dans le corps de la page => on masque le champ "direction" ************/
.page-node-1646 #node_fiche_composantes_full_group_direction_comp {display:none;}

/* PAGES COMPOSANTES : séparation des noms du groupe de champs "direction" */
.group-direction-comp .field-type-text {border-bottom:1px dotted #999; margin-bottom:12px;}
.group-direction-comp .field-type-text:last-child {border-bottom:none; margin-bottom:5px;}
  

/**************************** gestion de la galerie image* pour les fiches composantes
 *************************************************************************************/        
.node-type-fiche-composantes .field-name-field-galerie-comp {
  display:table; 
  border:1px solid #ddd; 
  text-align:center; 
  padding:10px 10px 0 10px; 
  margin-bottom:1em;
}
.node-type-fiche-composantes .field-name-field-galerie-comp div.field-item {display:inline-block; float:left; padding:0px;}
     
.node-type-fiche-composantes .field-name-field-galerie-comp div.field-item:after { 
  content:url("../images/fl_noir.png");
  cursor:pointer; 
  display:block; 
  height:15px; 
  left:0; 
  margin:0;
  padding:0; 
  position:relative; 
  width:15px; 
  top:-7px; 
}
.node-type-fiche-composantes .field-name-field-galerie-comp  div.field-item a:link {display:block; margin:0; padding:1px;}
.node-type-fiche-composantes .field-name-field-galerie-comp  div.field-item a:hover {border-bottom:none;}

#imageDataContainer #imageDetails {font-size:13px; font-weight:normal !important;}

