/*style pour le site laperouse Expertise Maritime*/

/*Graphisme, codage et mise en page par Cyril en prepa Developpement*/
/* Site effectué dans le cadre d'un cas pratique pour la formation Idem*/

/*  basics élément  */

	body {
		margin : 0px;
		background-image: url(images/fond.jpg) ;
		background-repeat: repeat-y;
		background-position: center;
		background-color:#ffffff;
		font-family: Verdana, sans-serif;
		font-size: 10pt;
		color: #abaaaa;
		line-height : 1.5em;
		}
	
	p {
		background-repeat: repeat-y;
		margin: 0px;
		padding: 0px 40px 0px 10px;
		}
		
	ol {
		
		background-repeat: repeat-y;
		padding : 0px 40px 0px 20px;
		margin: 0px;
		}
	
	ul {
		padding-top: 5%;
		}
			
	li {
		list-style-type : disc;
		}
	
	h1 {	
		background : transparent;
		padding : 20px 10% 30px 10%;
		font-size: 24pt;
		font-variant: small-caps;
		color: #F87F11;
		}
				
	h2 {
		background : transparent;
		font-size:16pt;
		font-variant: small-caps;
		font-weight : bold;
		color: #F87F11;
		padding : 20px 10% 30px 10%;
		}
	
	h3 {
		background-color: transparent;
		font-size:14px;
		font-variant: small-caps;
		color: white;
		padding : 0px 190px 40px 210px;
		margin-top : 0px;
		}
		
	img.centre {
		padding :0 15%;
		margin: auto ;
		
		}
	
	img 	{
  		border:none;
  		}	
  
/*  classe pour l'affichage des photos   */

.thumb {
	border : none;
	position:relative;
	top:0px;
	left:0px; 
	}
  
.thumb a {

  float : right;
  text-decoration:none;
  }

.thumb a:hover {	
	
	background-color: #F87F10;
	}

.thumb a .grand {

	display:block;
	position:relative; 
	top : 0px;
	width:0px; 
		 
	}	  
  
.thumb a:hover .grand { 
	position:absolute; 
	top:20px;
	left:0px;
	width:256px; 
	height:192px; 
	  }
		
	a:link { 
		font-weight: bold; 
		text-decoration: underline; 
		color: #F87F10;
		}
		
	a:visited { 
		font-weight: bold; 
		text-decoration: underline; 
		color: #fff;
		}
		
	a:hover, a:active { 
		text-decoration: none; 	
		color: #339999;
		}
		
	

/*Menu*/	

#menu {	
	margin-left:-175px;
	margin-left: 25px;
	position: fixed;
	margin-top: 50px;
	width: 160px;
	height: 210px;
	background-image: url(images/fond_menu.png) ;
	background-repeat: no-repeat;
	}

#menu li {
	width: 160px;
	height: 35px;
	list-style-type:none;
	padding: 0px;
	}

#menu li a {
	color: #fff;
	font: 12pt "Trebuchet MS",Arial,sans-serif ;
	text-align: center ;
	text-decoration:none;
	}
	
#menu li a:hover, #menu li a:active {
	color: #F87F10;
	text-decoration:underline;
	}
	
#menu a span {
	display:none;
	}

#menu a:hover span.show {
	display:block; 
	position: absolute; 
	left: 1%;
	right: auto;  
	top: -50px; 
	width: auto;
	font-variant: small-caps;
	background-color:transparent; 
	color: #F87F10;
	font-size: 10pt;  
	z-index: 50;
	}



/* specifics div */

#header {
	width : 980 px;
	height : 300 px;
	margin-top:0px ;
	margin-right: auto;
	margin-left: auto;
	}

#container
	{
	/*background-image: url(images/fond.jpg) ;
	background-repeat: repeat-y;*/
	width : 1024px;
	height: auto;
	margin-top:0px ;
	margin-right: auto;
	margin-left: auto;
	/*position: relative;*/
 	
	}

#contenu {
	margin-top: 0px !important;
	margin-top: 230px;
	margin-left : 200px;
	width: 780px;
	height: 340px;	
	overflow: none;

	}
	
#footer {
	float : left;
	margin-top: 0px;
	margin-left : 200px;
	width: 780px;
	height: 340px;	
	overflow: none;
	}
	
#footer span {
	font-family: courrier new, sans-serif; 
	font-size: 8pt;
	line-height: 1em;
	}

/*id specifique pour les popup des liens associés à un javascript*/

#pop1, #pop2 {
	position: absolute;
	display:none;
	width: 230px;
	height : auto;
	border: solid thin;
	background-color: #339999;
	z-index: 500;
	font-size: 110%;
	}
	
#pop1 p.popup, #pop2 p.popup {
	margin: 0 0.3em;
	font-family:Verdana, sans-serif;
	font-size: 8pt;
	font-style: italic;
	color: black;
	padding : 10px;
	}
	
#pop1 h1.popup, #pop2 h1.popup {
	font-size: 110%;
	margin: 0 0 0.5em 0;
	padding: 2em;
	border-bottom: 1px solid black;
	background-color: #FDD4B2;
	color: black;
	text-align: center;
	}