@charset "UTF-8";

/* Otus Graphic Design  */
/* www.otus.fr  */
/* contact@otus.fr  */
/* 2009  */

/* ================================== BODY ================================== */

body  {
	background-image:url(img/fd.gif);
	background-repeat: repeat-x;
	background-color: #83d0f0;
	margin: 0; /* il est conseille de mettre a zero la marge et le remplissage de l'element body, pour tenir compte des differentes valeurs par defaut des navigateurs */
	padding: 0;
}

/* ============================ GRAND CONTENEUR ============================= */

#grandconteneur {
	margin: 0 auto; /* les marges automatiques (et dotees d'une largeur positive) centrent la page */
	width:765px;
/*	height:600px;*/
	height:auto;
	padding: 0;
}

/* ================================== HAUT ================================== */

#haut {
	width:765px;
	height:149px;
	margin: 0;
	padding: 0;
	background-image:url(img/fd_haut.gif);
	background-repeat:no-repeat;
}
#logo {
	float:left;
	width:313px;
	height:149px;
}
#adresse {
	float:right;
	width:260px;
	height:147px;
	padding-top:10px;
	background-image:url(img/fd_adresse.gif);
	background-repeat:no-repeat;
}
#adressepicto {
	float:left;
	width:35px;
	height:147px;
	background-image:url(img/picto.gif);
	background-repeat:no-repeat;
}
#adressetxt {
	float:right;
	width:221px;
	height:147px;
	padding-top:7px;
}

/* =============================== NAVIGATION =============================== */

/* ================================== MENU ================================== */
#naverticale {
	float:left;
	width: 132px;
	height:auto;
	margin: 0;
	padding: 0;
}
#bt_nav {
	width: 132px;
	height: 24px;
}

/* ================================ CONTENU ================================= */

#conteneur { 
	width: 765px;  /* parametrage de la largeur a 20 pixels de moins que le plein ecran (800 pixels) pour tenir compte de l'habillage du navigateur et eviter l'apparition d'un ascenseur horizontal */
	height: auto;
	margin: 0;
	padding: 0;
}
#hautcontenu_default { 
	width: 633px;  /* parametrage de la largeur a 20 pixels de moins que le plein ecran (800 pixels) pour tenir compte de l'habillage du navigateur et eviter l'apparition d'un ascenseur horizontal */
	height: 24px;
	margin: 0;
	padding: 0;
	background-image:url(img/fd_contenu_haut.gif);
	background-repeat:no-repeat;
}
#hautcontenu_visuel1 { 
	width: 633px;  /* parametrage de la largeur a 20 pixels de moins que le plein ecran (800 pixels) pour tenir compte de l'habillage du navigateur et eviter l'apparition d'un ascenseur horizontal */
	height: 24px;
	margin: 0;
	padding: 0;
	background-image:url(img/fd_contenu_haut.gif);
	background-repeat:no-repeat;
}
#contenu {
	float:right;
	right:0px;
	top:0px;
	width:633px;
	height: auto;
	background-image:url(img/fd_contenu.gif);
	background-repeat:repeat-y;
	margin:0px;
	padding-bottom:40px;
}
#colonne_gauche {
	float:left;
	width: 230px;
	height: auto;
	padding-left:78px;
	padding-top:50px;
}
#colonne_droite {
	float:right;
	width: 263px;
	height: auto;
	padding-top:50px;
	padding-right:40px;
	padding-left:20px;
}
/* = ACCUEIL = */
#colonne_g_accueil {
	float:left;
	width: 350px;
	height: 262px;
	padding-left:78px;
	padding-top:20px;
	text-align:left;
}
#colonne_d_accueil {
	float:right;
	right:10px;
	width: 181px;
	height: auto;
	padding-top:10px;
}
#colonne_m_accueil {
	float:left;
	width: 350px;
	height: auto;
	padding-left:78px;
	padding-top:10px;
	left:0px;
	top:0px;
}
#separation {
	background-image:url(img/sperateur.gif);
	background-repeat:repeat-x;
	width:auto;
	height:20px;
}

/* = QUI SOMMES-NOUS = */
#colonne_g_qui {
	float:left;
	width: 230px;
	height: auto;
	padding-left:78px;
	padding-top:10px;
}
#colonne_d_qui {
	float:right;
	width: 263px;
	height: auto;
	padding-left:20px;
	padding-top:0px;
	padding-right:40px;
}
#colonne_m_qui {
	float:left;
	width: 515px;
	height: auto;
	padding-left:78px;
}

/* = PUBLICATION = */
#colonne_g_publi {
	float:left;
	width: 190px;
	height: auto;
	padding-left:78px;
	padding-bottom:15px;
}
#colonne_d_publi {
	float:right;
	width: 303px;
	height: auto;
	padding-right:40px;
	padding-bottom:15px;
}
#colonne_m_publi {
	float:left;
	width: 495px;
	height: auto;
	padding-left:78px;
}

/* = FORMATION = */
#colonne_h_form {
	float:left;
	width: 515px;
	height: auto;
	padding-left:78px;
	padding-top:10px;
}
#colonne_separe {
	background-image:url(img/sperateur_b.gif);
	background-repeat:repeat-x;
	float:left;
	width:515px;
	height:20px;
	padding-left:78px;
}
#colonne_g_form {
	float:left;
	width: 180px;
	height: auto;
	padding-left:78px;
	padding-top:20px;
}
#colonne_d_form {
	float:right;
	width: 310px;
	height: auto;
	padding-top:20px;
	padding-right:40px;
}
#separation_formation {
	background-image:url(img/sperateur_b.gif);
	background-repeat:repeat-x;
	width:auto;
	height:20px;
}

#colonne_d_separe {
	background-image:url(img/sperateur_b.gif);
	background-repeat:repeat-x;
	float:right;
	width: 310px;
	height: auto;
	padding-left:40px;
	padding-right:40px;
}

/* = ACTUALITE = */
#colonne_h_actu {
	float:left;
	width: 492px;
	height: auto;
	padding-left:78px;
	padding-top:10px;
}
/* = CHARTE = */
#colonne_m_charte {
	float:left;
	width: 495px;
	height: auto;
	padding-left:78px;
	padding-top:10px;
}

/* = CALENDRIER = */
#colonne_m_cal {
	float:left;
	width: 515px;
	height: auto;
	padding-left:78px;
	padding-top:10px;
}

/* =========================== CONTENU SPECIALE ============================= */
.tabl {
	border: 1px;
	border-color:#006aa0;
	border-style:solid;
}

.tabl_td {
	border-top-width: 1px;
	border-right-width: 0px;
	border-bottom-width: 0px;
	border-left-width: 0px;
	border-top-style: solid;
	border-top-color: #006aa0;
}
#tabl_actu {
	text-align:left;
	background-color:#cddf00;
}
#calendrier {
	width: 100%;
	background-position: center;
	text-align:center;
}

/* ================================== BAS =================================== */
#bas { 
	width: 765px;  /* parametrage de la largeur a 20 pixels de moins que le plein ecran (800 pixels) pour tenir compte de l'habillage du navigateur et eviter l'apparition d'un ascenseur horizontal */
	height:83px;
	float:right;
	margin: 0 auto; /* les marges automatiques (et dotees d'une largeur positive) centrent la page */
	padding: 0;
	background-image:url(img/fd_bas.gif);
	background-repeat:no-repeat;
}
/* ============================= PLAN DU SITE =============================== */