/* Feuille de style CSS */

body{
    margin: 0;
    padding: 0;
    background: #4B74AF;
    color: #FFF;
    font-family: Arial, Helvetica, Verdana, sans-serif;
    font-size: 12px;
}

#global{
    width: 1000px;
    margin: 0 auto;
}

img{
    border: 0;
}

a{
    color: #FFF;
    text-decoration: none;
}

a:visited{
    color: #FFF;
}

a:hover{
    color: #010165;
}

/* style d'un lien pointant sur la page courante */
.activelink a{
  color: #010165;
}

/* header */

div#header{  
  position: relative;
  height: 115px;
  background-color: #5872AB;
  text-align: right;  
}

div#header p#logo{
  position: absolute;
  top: 10px;
  left: 10px;
  width: 158px;  height: 90px;
  margin: 0; padding: 0;
}

div#header div#slogan{
  position: absolute;
  top: 20px; right: 5px;
}

div#header p#titreSlogan1{
  margin: 0; padding: 0;
  font-size: 20px;
  font-weight: bold;
}

div#header p#titreSlogan2{
  margin: 0; padding: 0;
  font-size: 16px;
  font-style: italic;
  font-weight: bold;
}

#nav1{
  position: absolute;
  bottom: 7px; right: 5px;
  text-align: right;  
  font-size: 13px;
}

#nav1 a{    
  font-weight: bold;
  margin-left: 7px;
}

/* nav */

#nav2{
    margin: 0; 
    padding: 0;
}

#header, #nav2{
    text-align: right;
}

#nav2 a{    
    font-weight: bold;
    margin-left: 7px;
}

span.separator{
    margin-left: 7px;
    font-weight: bold;
}

/* central */

#central{
    position: relative; 
    background: #F7F5EA;  
    color: #333;
    font-size: 12px;       
    width: 100%;    
}

/* titre de page positionné en absolu */

h1{
    position: absolute;
    top: -5px; left: -3px;
    margin: 0; 
    padding: 0; padding-top: 4px;
    height: 32px; width: 1004px;    
    background: #4B74AF url(img/c-titre-page.gif) no-repeat top left;    
    color: #FFF;    
    text-align: center;
    font-size: 18px; 
}

#centraltop, #centralbottom{
    height: 11px; 
}

/* central : cadre arrondi composé de 3 divs */

#centraltop{      
    background: #4B74AF url(img/ca-haut-page.gif) no-repeat top left;    
}

#centralbottom{    
    background: #4B74AF url(img/ca-bas-page.gif) no-repeat bottom left;    
}

#centralmiddle{    
    padding-top: 25px; /* détail du calcul : 36px - 5px - 11px (+ 5px)  */  
    background: #F7F5EA;
}

/* centralmiddle : zone de contenu agencée en 3 colonnes */

#columnleft{        
    float: left;
    width: 200px;
    margin-right: 5px;
}

#columnmiddle{    
    overflow: hidden;  
    width: 590px; /* IE 6 */  
}

#columnright{
    float: right;    
    width: 200px;
    margin-left: 5px;        
}

/* titre rubrique */

.rubtitle{ 
    margin: 0 auto 3px;
    padding: 0; padding-top: 4px;
    height: 27px; width: 185px;
    background: #F7F5EA url('img/c-rubrique.gif') no-repeat top left;
    color: #FFF;
    text-align: center;
    font-size: 16px;
}

#columnleft a{
  color: #333;
  text-decoration: none;
}

#columnleft a:hover{
  color: #010165;
}

/* cadre arrondi : quatre divs imbriquées (upperleft : dimensions ; lowerright: espacements) */

.upperleft{   
    background: #F0EADB url('img/coin-haut-gauche-rubrique.gif') no-repeat top left;
}

.upperright{
    background: url('img/coin-haut-droit-rubrique.gif') no-repeat top right;	
}

.lowerleft{
    background: url('img/coin-bas-gauche-rubrique.gif') no-repeat bottom left;	
}

.lowerright{
    background: url('img/coin-bas-droit-rubrique.gif') no-repeat bottom right;
    padding: 0 5px; 
}

/* dimensions des cadres arrondis */

#columnleft div.upperleft, #columnright div.upperleft{
    margin: 0 auto 15px;
    width: 185px;      
}

#columnleft div.last, #columnright div.last, #columnmiddle div.last{
    margin-bottom: 0;
}

/* contenu des rubriques */

/* listes */ 
#columnleft ul{
    margin: 0;
    padding: 0;        
}

#columnleft li{ 
    margin: 0;
    padding: 5px;
    list-style-type: none;    
}

#columnright ul.bluearrow{
    margin: 0; padding: 5px 0;
    padding-left: 25px;
}

#columnright ul.bluearrow li{    
    margin: 0;
    padding: 0 4px 5px;
    list-style: url('img/puce-fleche-bleue.gif');
}

#columnright h3{
    margin: 0; 
    padding: 5px;
    color: #263A8A;
    font-size: 14px;
}

/* ! temporaire ! */
#columnright p, #columnleft p{
  margin: 0;
  padding: 5px 0;
}

/*
#columnright p{
    margin: 0; 
    padding: 2px 5px;
    font-size: 12px;
}*/

#columnright p.action{
    text-align: center;
    padding: 0;
    padding-top: 3px;
}

/* columnmiddle : contenu de la colonne centrale */

#columnmiddle h4, #columnright h4{ 
    margin: 0;
    padding: 5px 0;
    color: #010165;
    font-size: 14px;
}

#columnmiddle p{ 
    margin: 0;
    padding: 5px 0;
}

#columnmiddle a, #columnright a{
    color: #010165;
    text-decoration: none;
    font-weight: bold;
}

#columnmiddle a:visited, #columnright a:visited{
    color: #010165;
}

#columnmiddle a:hover, #columnright a:hover{
    color: #FF7000;
}

#columnmiddle strong{
    color: #010165;
}

/* élément de contenu texte avec image */

#columnmiddle .csc-textpic, #columnright .csc-textpic{
    margin: 0;
    padding: 0; 
}

#columnmiddle .csc-textpic-text p, #columnright .csc-textpic-text p{
    margin: 0;
    padding: 0 0 5px 0; 
}

#columnmiddle .csc-textpic-caption, #columnright .csc-textpic-caption{
    color: #010165;
    font-weight: bold;
}

#columnright .csc-textpic{
  padding-bottom: 10px;
}

#columnright .csc-textpic-text p{
  padding: 0 0 2px 0;
}

#vivrecetterandonnee .lowerright div{
  padding-bottom: 10px;
}

#columnright p.vivrerando{
  padding: 0;
}

/* listes */

#columnmiddle ul, #columnmiddle ol{
    margin: 0;
    padding: 5px 50px;
}

#columnmiddle div.encart ul, #columnmiddle div.encart ol{
    margin: 0;
    padding: 5px 0;    
}

#columnmiddle ul li, #columnmiddle ol li{
    margin: 0;
    padding: 0 4px 5px;
}

#columnmiddle ul li{
    list-style: url('img/puce-ronde-bleue.gif');
}

#columnmiddle div.encart ul li{
    list-style-image: none;
    list-style-type: none;
    padding: 4px 5px;    
}

#columnmiddle div.type ul li, #columnmiddle div.type p{
    text-align: left;
}

#columnmiddle ul.bluedisc, #columnmiddle .programme ol{
    margin: 0; padding: 5px 0;
    margin-left: 5px;
    padding-left: 25px;
}

#columnmiddle ul.bluedisc li, #columnmiddle .programme ol li{    
    margin: 0;
    padding: 0 4px 12px;
} 

#columnmiddle .programme ol li{
  padding-bottom: 12px;
}

#columnmiddle ul.bluedisc li{
    padding: 0 4px 5px;
    list-style: url('img/puce-ronde-bleue.gif');
}

/* tableaux */

table{
    margin: 5px 1px;
    border: 1px solid #666;
    border-collapse: collapse;    
}

td{    
    border: 1px solid #666;    
    padding: 5px;
    text-align: center;
    background-color: #F0EADB;
    color: #333;
}

th, thead td{ 
    border: 1px solid #666;    
    padding: 5px;
    background-color: #4B74AF;
    color: #FFF;
    text-align: center;
    font-weight: bold;
}

caption{ 
    padding-left: 5px;
    text-align: left;  
    font-weight: bold;
    color: #333;
}

/* le RTE encapsule le contenu des cellules par des <p> */
#columnmiddle td p{
    margin: 0;
    padding: 0;
}

/* encarts */

#columnmiddle div.cara, #columnmiddle div.programme{
    float: left;
    width: 345px;    
}

#columnmiddle div.type, #columnmiddle div.itineraire, #columnmiddle div.diaporama{
    float: right;
    width: 235px;    
}

div#topimage, #columnmiddle div.diaporama{
    text-align: center;
}

#columnmiddle .encart{
    margin: 10px 0 5px;
}

#columnmiddle p.description{    
    float: left;
    width: 340px;
    padding: 5px 0 5px 5px;
    color: #010165;
    font-weight: bold;   
}

/* cara (caractéristiques) */

#columnmiddle div.cara{
    position: relative;
}

#columnmiddle div.cara .cartes{
    position: absolute;
    bottom: 5px; right: 25px;
}

#columnmiddle div.cara img{
    padding-left: 5px;
}

/* type */
#columnmiddle div.type img{
    vertical-align: middle;
    margin-right: 5px;
}

#columnmiddle div.type span{
  display: inline-block;
  width: 100px;
}

/* programme */
#columnmiddle div.programme p{
    padding-top: 0;
    font-size: 0.8em;
}


/* itinéraire */

#columnmiddle div.itineraire{
    text-align: right;
}

#columnmiddle div.itineraire p{
    padding-right: 0;
}

div#itititre{
  padding-top: 5px;
}

#itimg{
  width: 235px;
}

#columnmiddle div.itineraire h4.impression {
    display: inline;
}

#columnmiddle div.itineraire p.agrandir {
  margin: 0; padding: 0;
}

/* temoignage */

#columnmiddle div.temoignage{
    width: 100%; /* IE 6 */    
    margin: 5px 0 10px;
}

#columnmiddle div.temoignage img{
    float: left;
    width: 120px; 
    padding: 5px;
}

#columnmiddle div.actualite img{
	float: none;
	width: 300px;	
}

#columnmiddle .savoirplus{
    clear: left;
    padding-top: 0;
    text-align: right;
}

#columnmiddle .ajoutertem{    
    padding-top: 0;
    text-align: right;
}

#columnmiddle .ajoutertem a{
    padding-left: 20px;
    background : url('img/puce-fleche-bleue.gif') no-repeat left;
}

/* actualités : pagination */

#columnmiddle p.pagination{
	text-align: center;
}

#columnmiddle span.pcourante{
	color: #FF7000;
}

#columnmiddle span.pprec{
	margin-right: 12px;
}

#columnmiddle span.psuiv{
	margin-left: 12px;
}

#columnright form{
    display: inline;
    margin: 0;
    padding: 0;
}

#email{    
    margin: 0;
    padding: 0;
    height: 14px; 
    width: 140px;
    color: #010165;   
}

/* footer */

#footer{    
    margin: 15px 0 5px;
    font-size: 16px;
}

#idilink{
  margin-top: 0;
  text-align: right;
  font-size: 12px;
}
