/********************************************************\
**********************************************************

        MISE EN PAGE : TAILLES DES DIV ET FONDS
        
**********************************************************
\********************************************************/



/***************** MISE EN PAGE GENERALE ****************/
#nospace {
    width:100%;
    margin: 0px;
}

body
{
    background-color: #001843;
    margin: 0;
}

#page{
    position: relative;
    top:0px;
    margin-left: auto;
    margin-right: auto;
    width:850px;
}


/**************** EN TETE *********************/
#header {
    position:absolute;
    top:0px;
    width:100%;
    right:15px;
    margin-right:-15px;
    height:400px;
    background-color: #001843;
}

#banniere {
	position:absolute;
	left:0px;
	top:0px;
	width:850px;
	height:257px;
	z-index:0;
}

#banniereH {
	position:absolute;
	left:0px;
	top:0px;
	width:850px;
	height:257px;
	background:url("./img/header-no-flash.jpg") no-repeat;
}
#banniereH .lien-accueil{
	position:absolute;
	height: 120px;
	width: 90px;
	top: 120px;
	left: 160px;
}
#banniereH .lien-internet{
	position:absolute;
	height: 120px;
	width: 90px;
	top: 130px;
	left: 270px;
}
#banniereH .lien-intranet{
	position:absolute;
	height: 120px;
	width: 90px;
	top: 130px;
	left: 380px;
}
#banniereH .lien-demo{
	position:absolute;
	height: 120px;
	width: 90px;
	top: 130px;
	left: 495px;
}
#banniereH .lien-contact{
	position:absolute;
	height: 120px;
	width: 90px;
	top: 120px;
	left: 600px;
}

#bulle_gauche{
	position:absolute;
	left:0px;
	top:257px;
	width:306px;
	height:99px;
    background-image: url("./img/bulle_gauche.jpg");
}

#bulle_titre_cont{
	position:absolute;
	left:306px;
	top:257px;
	width:238px;
	height:99px;
  background-image: url("./img/bulle_titre_cont.jpg");
}

#bulle_droite{
	position:absolute;
	left:544px;
	top:257px;
	width:306px;
	height:99px;
    background-image: url("./img/bulle_droite.jpg");
}

#jointure{
	position:absolute;
	left:0px;
	top:356px;
	width:850px;
	height:44px;
	background-image: url("./img/jointure.jpg");
}


/*************** MILIEU - CONTENU *****************/
#main {
    position:absolute;
    top:400px;              /* correspond a la hauteur totale de l'en-tete : notre contenu commencera a 400px du haut de la page */
    width:100%;
    right:15px;
    margin-right:-15px;
}

* html body #main {
    height:100%;
    overflow:hidden;
}

/* IE-mac ne voit pas les lignes qui suivent \*/
* html body #main {
    height:0px;
    overflow:visible;
} 
/* fin du text caché pour IE/mac */

#central {
    position:relative;
    top:0px;
    
    width:auto;
    margin:0px;
    margin-left:100px;
    margin-right:100px;
    
    background-image: url("./img/milieu.jpg");
    background-repeat: no-repeat;
    background-color: #52a3fe;
}

#corps {
    position:relative;
    min-height:300px;
}

* html body #corps {
    height:300px;
} 

#div-min-height {
    position:relative;
    height:371px;              /* fixe une taille minimale au contenu (taille du dégradé) */
    width:0px;
    float:left;
}

#div-min-height-bottom {
    position:relative;
    height:0px;
    clear:left;
}


/************ REMPLISSAGE GAUCHE **************/

#degr_gauche {
    position:absolute;
    height:100%;
    width:100px;
    top:0px;
    left:0px;
    background-image: url("./img/rpt_gauche.jpg");
    background-repeat: repeat-y;
}

#haut_degr_gauche{
    position:relative;
    top: 0px;
    left: 0px;
    width:100px;
    height:371px;
    background-image: url("./img/contenu_gauche.jpg");
}


/************ REMPLISSAGE DROIT **************/

#degr_droit {
    position:absolute;
    height:100%;
    width:100px;
    top:0px;
    right:15px;
    margin-right:-15px;
    
    background-image: url("./img/rpt_droit.jpg");
    background-repeat: repeat-y;

}

#haut_degr_droit{
    position:relative;
    top: 0px;
    left: 0px;
    width:100px;
    height:371px;
    background-image: url("./img/contenu_droit.jpg");
}


/************ PIED DE PAGE ***************/

#pied {
    position:relative;
    width:100%;
    height:78px;
    background-image: url("./img/pied.jpg");
    margin-top:25px;
}
		
#pied_gauche, #pied_droit{
    position: absolute; 
    left:0px;
    bottom: 0px;
    height:78px;
    width:100%;
    background-color:black;
}

#pied_gauche{
    background-image: url("./img/pied_gauche.jpg");
}

#pied_droit{
	background-image: url("./img/pied_droit.jpg");
}


#footer {
    text-align: center;
    position:absolute;
    bottom: -1px;  
    left:0px; 
    width:850px;
    height:78px;
    background-image: url("./img/pied_complet2.jpg");
}