/* Cette note ne doit pas être effacée.

Nom : style.css   
Version : 1.0
Auteur : Yannick Fel

Description : feuille de style du framework

*/



/*** Balise BODY ***/
body {
		background: #FFF37A;
		color: #222;
		font: normal 70% sans-serif;
		padding: 1% 1%;
		scrollbar-face-color: #0477B2; 
		scrollbar-shadow-color: #000000;
		scrollbar-highlight-color: #FFFFFF;
		scrollbar-3dlight-color: #000000; 
		scrollbar-darkshadow-color: #000000; 
		scrollbar-track-color: #94A9CA; 
		scrollbar-arrow-color: #FFFFFF
}

#news {
 	list-style-type: none;
	border: 1px dashed #fff;
	color: white;
        background: #332;
        padding: 2px;
        margin: 2px;
	width: 400px 
}

/*** Les TITRES ***/



.titre1 {
	font: normal 1.1em Georgia,serif;
	background: url('img/quote.gif') no-repeat;
	padding-left: 26px;
	margin-bottom: 10px;
	font-size:18px;
	color:black;
	
}

.titre2 {
	font-weight:bold;
	font-size: 15px;
	color : black;
}

.titre3 {
	font-style: italic;
	color : black;
}


/*** Mise en page ***/

.main#two-columns {background: #FFF url(img/two-columns.gif) repeat-y;}

.coldroite {
	float: right;
        width:200px
}

.colcentrale {
	margin-right:230px;
}

.colcentrale-bordure {
	border:1px solid black;
	margin-right:250px;
}

.bordure {
	border:1px solid black;
	width:100%
}

.coldroite-3colonnes {
        float: right;
        width:200px
}

.colcentrale-3colonnes {
        margin-right:250px;
}


/*** Les TABLES ***/

#table {
	width: 500px;
	padding: 20px 0px 10px;
	display:table;
}

#table p {

	clear:both;
	margin:0 0 30px 160px;
}

#table p span {

	float:left;
	width:150px;
	margin:0 0 0 -160px;
	text-align:right;
}

/*** Les PARAGRAPHES ***/



p.block {

	color : black;
	margin: 10px 10px 10px 10px;
	padding-left: 10px

}



p.block-gras {

	color : black;
	margin: 10px 10px 10px 10px;
	padding-left: 10px;
	font-weight: bold

}

p.block-italic {

	color : black;
	margin: 10px 10px 10px 10px;
	padding-left: 10px;
	font-style: italic
}





/* default elements */
* {margin: 0; padding: 0;}

#container {
margin-left: auto;
margin-right: auto;
padding: 0px 0px;
width: 800px;
height: auto
}

/* header */
.header {
	background: url(img/logoPortfolio3.jpg) no-repeat center bottom;
	height: 166px
}

/* gallery */
.gallery td {
	vertical-align: top;
	text-align: center;
}
.gallery em {display: block;}

/* misc */
.clear,.clearer {clear: both;} 
.clearer {font-size: 0;}
.col2 .left {width: 75%;}
.col1 .contenu {background: #FFF}
.col2 .right .contenu {background: #FFF}
.col2 .right {width: 25%;}
.left {float: left}
.right {float: right;}
.right .contenu {padding: 18px 0px 10px;}
.contenu {padding: 5px 25px 25px; }

/* block list */
ul.block {
	border-top: 1px dashed #BCBAAC;
	margin: 4px 0;
	padding: 0;
	width: 90%
}
ul.block-second {
	list-style-position:inside;
	list-style-type: disc;
	color:black;
	margin: 4px 10px;
	padding: 0;
	width: 90%;
}

.block li {
	border-bottom: 1px dashed #BCBAAC;
	list-style: none;
}
.block li a,.block li em {
	color: #553;
	display: block;
}
.block li em {
	font-size: 0.9em;
	font-style: normal;
}
.block li a {
	padding: 4px 3%;
	text-decoration: none;
	width: 94%;
}
.block li a span {font-weight: bold;}
.block li a:hover {
	background: #D2D0C0;
	color: #553;
}




.right .block,.right .block li {border-color: #DCDACC;}
.right .block li a:hover {background: #F2F0EA;},.block a#active {background: #F2F0EA;}

.first-letter
	{
	background-color: #FFF37A;
	font-size: 200%;
	font-weight: bold;
	float: top;
	text-transform: capitalize
	}


blockquote {
	background: url('img/quote.gif') no-repeat;
	display: block;
	font: normal 1.1em Georgia,serif;
	padding-left: 26px;
text-align: justify 
}





/* navigation */
.navigation {
	margin-left: auto;
	margin-right: auto;
	background: #DED9D0 url(img/nav.gif) repeat-x; width: 800px; height: 41px;
	border-top: 1px solid #996;
}
.navigation a {
	background: #FFF url(img/nav.gif) repeat-x;
	border-right: 1px solid #C9C6B3;
	float: left;
	font: bold 1em Tahoma,sans-serif;
	padding: 0 14px;
	line-height: 41px;
	text-align: center;
	text-decoration: none;
}
.navigation a:hover,.navigation a#active {background-position: left bottom; color: #331;}


/* footer */
.footer-popup {
	margin-top: 0px;
	margin-bottom: 5px;
        padding-top: 5px;
	background: #332;
	color: #EED;
	width: 502px 
}

.footer {
	margin-top: 0px;
	margin-bottom: 5px;
        padding-top: 2px;
	background: #332;
	color: #EED;
	width: 800px 
}
.footer .left {width: 100%;}
.footer .right {
	width: 30%;
	text-align: right;
}
.footer a {
	color: #FFF;
	text-decoration: none;
}
.footer a:hover {
	color: #FFF;
	text-decoration: underline;
}

.align_image img, .align_image span {
  vertical-align: middle;
  display: inline-block; 
}




/* Les liens hypertextes */


a 
	{
		
color: red;
		
padding: 4px
	}
 
 
a:hover
	{
	
color: red
	}


a:visited 
	{ 
	
color: orange
	}
	 

/* Le menu de gauche du site Web */


.menu_gauche
	{
	
	}


.titre_menu_gauche
	{
	
text-align: center;
	
background-color: #0477B2;
	
font-weight: bolder
	}
	

.cadre_menu_gauche
	{
	
	
border: 1px solid blue
	}
	

.liste_menu_gauche
	{
	
background-color: lightblue;
	
list-style-type: square
	
	}
	

li
	{
	margin: 2px 2px 0 2px;
	}  


th 
	{
	color: white;
	
background-color: #0477B2;
	
text-align: center;
	
text-decoration: none;
	
font-family: verdana,Arial,sans-serif ;
	
font-size: 12px;
	
border: black 1px solid;
	
padding-top: 10px;
	
padding-left: 10px;
	
padding-right: 10px;
	
padding-bottom: 10px
	}


/* Le cadre principal du site Web et sa présentation fixe */


.first-letter
	{
	background-color: white;
	
font-size: 200%;
	font-weight: bold;
	
float: top;
	text-transform: capitalize
	}


.cadre_principal
	{
	
background-color: white;
	
border-bottom : 2px solid #CCCCCC;
	
border-right : 2px solid #CCCCCC;
	
border-top : 2px solid #CCCCCC;
	
border-left : 2px solid #CCCCCC;
	
padding-top: 20px;
	padding-left: 10px;

	padding-right: 10px
	}



/* Ensemble des paragraphes, titres h1 et h2 */


p
	{
	
color : #0477B2;
	
text-align: justify;
	text-decoration: none;
	
font-family: verdana,Arial, sans-serif ;
	
font-size: 12px
	
}



div.centrage {text-align: center;}	

ul
	{
	color : #0477B2;
	
text-align: justify;
	
text-decoration: none;
	
font-family: verdana,Arial, sans-serif ;

	font-size: 10px;
	}


.bouton_suivant
	{
	text-align: right;
	
vertical-align: text-bottom;
	color : #0477B2;
	}



/* Style formulaire */


.myTablePresentationTab
	{
	
color : #0477B2;
	
background-color: #EEEEEE;

text-align: left;
	
text-decoration: none;
	
font-family: verdana,Arial,sans-serif ;
	
font-size: 12px;
	
border-bottom : 1px solid #DDDDDD;
	
border-right : 1px solid #DDDDDD;
	
border-top : 1px solid #DDDDDD;
	
border-left : 1px solid #DDDDDD;

	padding-top: 20px;
	
padding-left: 10px;
	
padding-right: 10px
	}




/* Style Tableau */

.myTableReportingTab
	{

	text-align: center;

	text-decoration: none;
	
font-family: verdana,Arial,sans-serif ;

	font-size: 12px;
	
border-collapse:collapse;
	
BORDER-TOP: black 1px solid;
	
BORDER-LEFT: black 1px solid;
	
BORDER-RIGHT: black 1px solid;

	BORDER-BOTTOM: black 1px solid
	}


.myTableReportingTR
	{

	color : #0477B2;

	background-color: #EEEEEE;
	
text-align: center;
	
text-decoration: none;
	
font-family: verdana,Arial,sans-serif ;
	
font-weight: bold;
	font-size: 12px;
	
border-collapse:collapse;
	
BORDER-TOP: black 1px solid;
	
BORDER-LEFT: black 1px solid;
	
BORDER-RIGHT: black 1px solid;
	
BORDER-BOTTOM: black 1px solid
	}


.myTableReportingTD
	{
	
text-align: center;
	
text-decoration: none;

	font-family: verdana,Arial,sans-serif ;
	
font-size: 12px;
	BORDER: black 1px solid
	}