/* --------------------------------------------------------------

   layout.css
   Disposition des blocs principaux
   cf.: http://romy.tetue.net/structure-html-de-base

-------------------------------------------------------------- */

body {  background: url(img/motif.png) repeat ; }
.page { position: relative; width: 1000px; margin: 0 auto;  background: url(img/header-ISDD.jpg) no-repeat; padding: 10px 0 0 0; text-align: left;  background-color: #FFF ;  }

.header {margin: 75px 0 0 0; padding-left:15px; }
.main { padding: 0px 0;  }
.footer {
	clear: both;
	margin-top: 40px;
	padding: 10px 0 0 0;
	border-top: 5px solid;
	font-family:Arial, Helvetica, sans-serif;
	font-size: 0.8em;
	line-height: 1.4em;
}

.wrapper { clear: both; float: left; width: 717px; overflow: hidden; }
.content { min-height: 350px; padding-left: 10px ;}

/* colonne page sommaire */
#col_actuel {float:left; width:224px; margin-right:21px; }
#col_cs {float:right; width:224px; }
p.suite {margin-bottom:28px;  border-top:dotted; border-top-width:1px;  border-bottom:solid; border-bottom-width:1px; padding-top:10px; padding-bottom:5px; }
#col_derniers_articles {width:224px; margin-right:21px; overflow:hidden; }

/* Habillage de la timeline */
/* ------------------------------------------ */
/* Timeline page sommaire */
#timeline-sommaire { margin-top: 36px ; margin-bottom:30px ; height: 312px; width: 715px;  border: 1px solid #aaa;  }



#timeline { font-family: Arial, Helvetica, sans-serif; margin: 5px; }
#timeline li { display:inline; list-style: none; padding : 5px; text-align:center; line-height: 1em ; vertical-align: text-bottom; }
#timeline img { vertical-align: middle; }

#my-timeline {
	    font-size: 0.8em;
	    border: 1px solid #aaa;
		text-align:left;
		line-height:1.5em; 
	}
/* taille de la timeline incluse dans la page sommaire */
#my-timeline-sommaire {	    
		height: 280px; width: 700px;  
		border: 1px solid #aaa; 
		margin-top:23px; margin-bottom:10px;
		font-size: 0.8em;
	    border: 1px solid #aaa;
		text-align:left;
		line-height:1.5em; 
}	
.timeline-toute {  margin-bottom:30px; }

.timeline-event-bubble-title {
	text-align:left;
	font-size: 0.9em;
}

.timeline-event-bubble-body {
	text-align:left;
	font-size: 0.9em;
}

.timeline-event-bubble-time{
	text-align:left;
	font-size: 0.9em;
} 

/* Fin habillage de la timeline */


.aside { float: right; width: 224px; overflow: hidden; padding-right: 10px;  }
.aside .suite {margin-bottom:28px;  border-top:dotted; border-top-width:1px;  border-bottom:solid; border-bottom-width:1px; padding-top:10px; padding-bottom:5px; }


#nuage { font-family:"Lucida Sans Unicode", "Lucida Grande", sans-serif; text-align:center; margin-bottom:10px; padding:10px ;}


/* Entete et barre de navigation
------------------------------------------ */

.header { padding-bottom: 0; padding-right: 30%; }
.header #logo { display: block; margin: 0; line-height: 1; font-weight: bold;  }
.header #logo,
.header #logo a,
.header #logo a:hover { background: transparent; text-decoration: none; color: #222; }
.header #slogan { margin: 0; }

.formulaire_menu_lang { position: absolute; right: 0; top: .9em; display: block; width: 30%; }

.nav { 
	font-family: "Lucida Console", Monaco, monospace ; 
	font-size: 1em ; 
	font-weight: bold ; 
	text-transform: uppercase ; 	
}

#nav { margin-top:4px; margin-bottom:5px; border-bottom: solid #222 ; border-bottom-width: 1px ; }



.nav a {
	float: left ;
	display: block ;
	text-decoration: none ;
	padding-bottom: 4px ;
	padding-left: 8px ;
	padding-right: 10px ;
	padding-top: 8px ;
}
/* menu couleur rubrique necessite plugin couleur 
.nav ul li.on a {
	color: #cf0063;
	border-bottom: 5px;
	border-bottom-color: #cf0063;
	border-bottom-style:solid;
}

.nav ul li a:focus,
.nav ul li a:hover,
.nav ul li a:active {color: #cf0063;} 
*/

/* menu navigation page rubrique vers chronologie et carte */
#nav_rub {
	float:right;
	position:relative;
}

/* pour menu Repere_case_studies */
.rep_cs_nav {
	font-family: "Arial Black", Gadget, sans-serif ;
	text-transform: uppercase ;
	font-size: 1.4em ;
	line-height: 1.2em ;
}
#rep_cs_nav {
	border-bottom : solid 5px #000 ; 
	border-top: solid 5px #000 ; 
	padding: 4px ;
	margin-bottom: 28px ;
}
#rep_cs_nav ul li { margin-left: 25px; padding-top: 5px; line-height: 1.2em ; }

#formulaire_recherche { position: relative;}

.footer .colophon { float: left; height: 40px; width: 70%; margin: 0; }
.footer .generator { float: right; }
.footer .generator a { padding: 0; background: none; }

.footer .logo_unige {float: left; width: 707px; padding: 10px 0 0 0; border-top: 5px solid; }
.footer .inscription {float: right; width: 224px; overflow: hidden; padding-right: 10px;  }
.footer .inscription legend {  text-transform:uppercase;} 

.foot { display: table-row; width:717px; }
.foot-entree  {display: table-cell; padding :  0px 5px 5px; text-transform:uppercase; }
.foot-mot { display:list-item; list-style:outside; margin-left:15px; text-transform: none;  }

/* Gabarit d'impression
------------------------------------------ */
@media print {
.page,
.wrapper,
.content { width: auto; }
.nav,
.arbo,
.aside,
.footer { display: none; }
}

/* Affichage sur petits ecrans
Cf.: http://www.alsacreations.com/astuce/lire/1177
------------------------------------------ */
@media (max-width: 640px) {

/* passer tous les elements de largeur fixe en largeur automatique */
body,
.page,
.header,
.main,
.footer,
.wrapper,
.content,
.aside { width: auto !important; margin: auto !important; padding: auto !important; }

.page { margin: 0; padding: 5%; }

/* Passer a une seule colonne (a appliquer aux elements multi-colonnes) */
.content,
.aside { clear: both; float: none !important; width: auto !important; }
.nav ul li a { float: none; border: 0; }
#formulaire_recherche { display: none; position: static; text-align: center; }
.arbo { display: none; }
.footer .colophon { width: auto; float: none; }
.footer .generator { display: none; }

/* header du calendrier full-calendar */
table.fc-header td { display: block; text-align: left; }

}

/* end */