@charset "utf-8";

/**
 *
 * style.css
 *
 * 1 - Styles généraux, initialisations
 * 2 - Mise en page, layout, cadres...
 * 3 - Styles de titres, textes...
 * 4 - Menu
 * 5 - login
 * 6 - Bonus (generated)
 * 7 - drapeaux
 * 8 - popup ID Interactive
 *
 */

/**
 * Styles généraux, initialisations
 *
 */

	html, body {
    margin: 0; padding: 0;
  	font-family: Verdana, "Bitstream Vera Sans", "Lucida Grande", sans-serif;
  	font-size: 80%;
  
	}
	p,li{
			color : #1F497D;
	}

	a img {
    border: none;
	}

	.clear {
	  clear:both;
	}
	
	form {
		margin:0;
		padding:0;
	}

	.erreur {
    color: red;
	}

	.succes {
    color: green;
	}

/**
 * Mise en page, layout, cadres...
 *
 */

	#conteneur{
	  position:relative;
	  width:1000px;
	  margin:auto;
	  border: 1px solid #555555;
	  margin-top:20px;
	  background-color: #FFF;
	  color: #000;
	}

	#contenu {
	  padding:0 10px 10px 10px;
		overflow:hidden;
		/*margin-top : 260px;*/
	}
	#hauteurMin {
		height:500px;
		width:1px;
		clear:left;
		float:left;
		display:none;
	}

	#header {
	    height:104px;
	    background : url(../images/header.jpg) no-repeat top left;
	}
	
	#header h1{
		display:none;
	}

	#footer {
	  border-top:1px solid #555555;
		padding:0 10px;
		clear:both;
		background-color: #CB1009;
	  text-align: center;
	  color:white;
		margin: 0; padding: 5px;
	}
	#footer a {
		color:white;
	}

/**
 * 3 - Styles de titres, textes...
 *
 */

	a{
		color:#D0000D;
		text-decoration: none;
	}
	a:hover{
		color:#D0000D;
		text-decoration: underline;
	}
	a:visited{
	}

	h1{
	    margin:0;
	    padding-top:22px;
	    text-align: center;
	    font-size: 1.8em;
	    color: #0A246A;
	}

	h2{
	    margin-bottom: 20px;
	  	color: black;
	    font-size: 1.5em;
	    text-align:left;
	    border-bottom:1px dotted #000;
	}

	h3 {
	    font-size:1.3em;	    
	    margin:5px 0px;
	    color : #970D07;
	}
	
	h4{
	 		font-size:1.1em;	    
	    margin:3px 0px;
	}
	
	h5{
			font-size:1em;	    
	    margin:2px 0px;
	}
	
	ul{
		padding-left:15px;
	}
	
/**
 * 4 - Tableau
 *
 */	
 
table td, table th {
	padding:4px 10px;
}

table{
	border-collapse:collapse;
	margin:auto auto 10px;
	width:470px;
}

table td{
	border-top:2px solid #5E8397;
}

table th{
border-bottom:2px solid #5E8397;
border-right:2px solid #5E8397;
}

.enteteG{
background:transparent url(../images/tableau_01.png) no-repeat left top;
height : 19px;
}

.enteteD{
	background:transparent url(../images/tableau_02.png) no-repeat right 0px;
	border-left:2px solid #5E8397;
	border-top : none;
}

.milieuG{
	background:transparent url(../images/tableau_04.png) no-repeat left center;
}

.milieuD{
	background:transparent url(../images/tableau_04.png) no-repeat right center;
	border-left:2px solid #5E8397;
}

.piedG{
background:transparent url(../images/tableau_07.png) no-repeat left bottom;
border-bottom : none;
}

.piedM{
	border-bottom : 2px solid #5E8397;
}

.piedD{
background:transparent url(../images/tableau_08.png) no-repeat right bottom;
border-left:2px solid #5E8397;
}
 
/**
 * 4 - Menu
 *
 */
 
 div#menu{
 	/*margin-top : -300px;*/ 
	 background : transparent url(../images/accueil-alternatif.jpg) no-repeat left top;
	 width: 1000px;
	 height :300px;	
 }

	div#menu ul{
    margin: 0;
		padding: 2px 10px;
    list-style: none;
    background-color: #333333;
    text-align: center;
    clear:right;
    font-size : 13px;
    padding-right:0px;
    font-family:verdana;
	}

	#menu li {
    margin: 0px;
    padding: 0px 23px;
	  display:block;
	  float:left;
    color: #FFF;
    letter-spacing: -1px;
    border-right : 1px solid white;    
	}

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

	#menu a:hover {
		color: #FF7F00;
  	text-decoration: underline ;
	}
	#menu a:visited {
		color: #FFF;
	}

/**
 * 5 - login
 *
 */

	#login{
	  padding:5px 0px;
	  /*float:right;*/
	}
	#login input.input{
		border:1px solid #BBBBCC;
		width:100px;
	}
	
	#loginFormOut{
		float : right;
		margin-right: 5px;
	}

/**
 * 6 - Bonus
 *
 */

	#generated {
	  text-align:center;
	  display:none;
	}

/**
 * 7 - drapeaux
 *
 */

	#flags {
	  position:absolute;
	  margin:2px 5px;
	  display:none;
	}

/**
 * 8 - popup ID Interactive
 *
 */
 #popupIDI {
  position:absolute;
  color:black;
  background:#FFFFFF;
	border:1px solid #444444;
	padding:4px;
	right:10px;
	bottom:10px;
	font-size:0.8em;
	display:none;
 }
 
 
#actuListe {
	float : right;
	width : 300px;
	margin-top : 10px;
}

#displayActu{
	width : 650px;
	border-right : 1px solid black;
	padding-right : 15px;
}

.item {
  clear:left;
	margin-bottom:0px;
	overflow:auto;
	
}
	.item .miniature {
		float:left;
		margin-right:5px;
	}
 #actualites {
  float:left;
  width:200px;
 }
 #actualites p{
 	margin : 8px 0px 5px;
 }
 #gauche {
 	width:750px;
 }

div#accueil div{ 
	float : left;
	width : 294px;
	border : 1px solid #666666;
	padding : 10px;
	margin : 5px;
	height:290px;
		overflow : hidden;
}

div#accueil div h2{
	margin : 5px 0px;
}
 
div#actualites img{
	/*float : right;*/
}

.clear{
	clear: both;
}

div.carac{
	float : left;
	width : 290px;
	margin : 5px 3px;
	border : 1px solid black;
	padding : 10px;
}

#list2 {
	width : 330px;
}

#list2 dt{
	border-bottom : 1px solid white;
	padding : 5px 5px;
	color : white;
	background :#5E8397;
}

#list2 dd{
	padding-left:15px;
	margin-left:5px;
	background : url(../images/bullet_blue.png) no-repeat left center;
	
}

#list2 dd span{
	color : #970D07;
}

.mordicus{
	float : right;
	width : 528px;
	margin-top: 0px;
	margin-right: 15px;
}

h3.title_surcouf{
  margin-left: 400px;
  margin-top : 80px;
}

.dufour_40_elu_bateau_croisiere{
  text-align :center;
  width : 320px;
  
}

 
#photosStage, #bateau{
	float : right;
	border : 1px solid black;
	padding : 5px;
	padding-right : 10px;
	padding-top : 0px;
	margin : 5px;
	margin-left:15px;
}

#bateau{
	float : right;
}

#copyright_photo{
  clear : right;
  margin : 0px;
  margin-right : 170px;
	float : right;
}

#list1 {
	width : 500px;
	border : 1px solid #5E8397;
}

#list1 h2{
	border-bottom : 1px solid white;
	padding : 5px 5px;
	color : white;
	background :#5E8397;
	font-size: 0.9em;
	margin : 0px;
	
}

#list1 ul{
	margin : 5px;
	padding : 0;
	padding-left:25px;
	
}

#list1 li{
	margin-left:0px;
	list-style-image: url(../images/bullet_blue.png);	
}

#list1 .longDD,#list2 .longDD,#test .longDD{
	list-style-image: none;
	list-style: none;
	margin-left: -15px;
	padding-top : 8px;
	padding-bottom : 8px;
}

#list1 li li,#list1 li li,#list1 li ul{
	border : 1px solid white;
}

#list1 ul ul li{
	list-style-image:none;
	list-style-type: square;	
}

#list1 li span{
	color : #970D07;
}

.pdf{
	background : url(../images/page_white_acrobat.png) no-repeat left center;
	padding-left: 20px;
}

.contact{
	width : 400px;
	margin : 5px auto;
}

.contact p{
  overflow : hidden;
}



.contact label{
	display: block;
	width : 110px;
	float : left;
}

.shortForm{
	width : 500px;
	margin : 5px auto;
}

.shortForm label{
	display: block;
	width : 230px;
	float : left;
}

.contact fieldset,.shortForm fieldset{
	padding :10px;
}

#menu_admin{
	background : #333333;
}

p{
	text-align: justify;
}
/*Menu Admin*/
	ul#menu_admin {
    margin: 0;
		padding: 2px 20px;
    list-style: none;
    background-color: #333333;
    text-align: center;
    clear:right;
    overflow:auto;
    height : 20px;
    margin-top : -20px;
	}

	#menu_admin li {
    margin: 0px;
    padding: 0px 5px;
	  display:block;
	  float:left;
    font-weight: bold;
    color: #FFF;
	}

	#menu_admin a {
		color: #FFF;
		text-decoration: none;
	}
	#menu_admin li.current {
		background: rgb(199,0,106);
	}
	#menu_admin a:hover {
		color: #FF7F00;
  	text-decoration: underline ;
	}
	#menu_admin a:visited {
		color: #FFF;
	}
	
	#conteneur div#accueil div#presentation{
		height : 290px;
		overflow : hidden;
	}
	
	
	#presentation p{
		margin-bottom : 0px;
		text-align: justify;
	}
	
	#presentation p.temps{
		width : 50px;
		margin : 0px;
		float:left;		
		text-align: right;
	}
	
	.temps a{
		font-weight: bold;
	}
	
	#presentation #meteo{

	}
	
	#presentation #domaine_interv{
		width : 182px;
		float : left;
		border:none;
		margin : 0px ;
		padding : 0px;
	}
	
	#presentation #temps{
		float : left;
		width : 110px;
		border:none;
		margin : 0px ;
		padding : 0px;
		margin-top : 20px;
	}
	
	#presentation p img{
		float : right;
		margin-left:5px;
		margin-bottom : 5px;
	}

	p.logo_balade_nautique{
		float : right;
		margin : 0px;
		margin-left:15px;
		margin-bottom : 15px;
	}

	#list1 h2, #list2 dt, #test h2{
		cursor: hand;
		background :  #5E8397 url(../images/signe_plus.jpg) no-repeat 5px center;
		padding-left: 20px;
	}
	
		#list1 h2:hover, #list2 dt:hover, #test h2:hover,#list1 h2.active:hover, #list2 dt.active:hover, #test h2.active:hover{
			background : #970D07;
		  cursor : pointer;
		}
		
		#list1 h2.inactive:hover,#test h2.inactive:hover,#list1 h2.inactive.active:hover, #test h2.inactive.active:hover,#list1 h2.inactive{
		  cursor : auto;
		  background :  #5E8397;
		  background-image : none;
		}
	
	
	#list1 h2.active, #list2 dt.active, #test h2.active{
		cursor: hand;
		background : #5E8397 url(../images/signe_moins.jpg) no-repeat 5px center;
		padding-left: 20px;
	}
	
	#list3{
    border : 1px solid #5E8397;
    width : 475px;
    margin : 10px;
  }
  
  #list3 ul{
    display : none;
    margin-left: 20px;
  }
  
  #list3 h2{
		cursor: pointer;
		background :  #5E8397 url(../images/signe_plus.jpg) no-repeat 5px center;
		
		color : white;
		margin : 0px;
		font-size : 1em;
		padding : 5px;
		padding-left: 20px;
	}
	
		#list3 h2:hover, #list3 h2.active:hover{
			background : #970D07;
		  cursor : pointer;
		}
		
		#list3 h2.inactive:hover,#list3 h2.inactive.active:hover,#list3 h2.inactive{
		  cursor : auto;
		  background :  #5E8397;
		  background-image : none;
		}
	
	
	#list3 h2.active{
		cursor: hand;
		background : #5E8397 url(../images/signe_moins.jpg) no-repeat 5px center;
		padding-left: 20px;
	}
  
  .stage{
		text-align: justify;
		margin : 8px 0px;
	}
	
	.logo_35{
		margin-bottom: 20px;
	}
	
	div#presentation ul{
		margin : 2px 5px;
	}
	
	#conteneur .saison{
		text-align: center;
		font-weight : bold;
		color : #970D07;
		font-size : 1.2em;
	}
	
	p.bulletin, p.devenir_skipper, p.cursus_professionnel, p.bulletin, p.actualite_agenda{
		text-align: center;
	}
	
	p.devenir_skipper{
		font-size : 1.5em;
		color : #970D07;
		font-weight: bold;
	}
	
	p.bulletin a{
		font-weight: bold;
	}
	
	div#coordonnees, div#partenaire, div#formContact{
		float : left;
	}
	
	div#coordonnees{
		width : 250px;
	}
	
	div#bloc_gauche{
    width : 350px; 
    float : left;
  }
	
	div#formContact{
		width : 410px;
		margin-right : 10px;
		padding : 0px 30px; 
	}
	
	.partenaire{
    margin-bottom : 45px;
  }
  
	
	p.img_logo{
		float : right;
		padding-left:5px;
		padding-bottom : 5px;
		padding-top : 5px;
	}
	
	div#partenaire{
		width : 120px;
	}
	
	.lire_suite{
    text-align : right;
  }
	
a#retourAccueil {
	display:block;
	position:absolute;
	width:250px;
	height:90px;
	left:0;
	top:0;
}

.txtMordicus{
	width : 350px ;
	float : right;
	padding-top : 70px; 
}


#rightOnglet{
	clear : both;
	padding : 5px 20px;
	float : right;
	width : 400px;
}

#rightOnglet img{
  float : right;
  margin-left: 10px;
}


div#accueil div.actu{
  
  float:none;
  border : none;
  height: auto;
  overflow : visible;
  padding : 0px;
  margin : 0px;
  margin-bottom : 5px;
  padding-left : 10px;
  padding-right : 7px;
  padding-top : 2px;
  padding-bottom : 2px;
  width:277px;
}

#actualites p.listActus{
  margin-bottom : 5px;
  margin-top : 0px;
  margin-left: 10px;
}


div#accueil div.actu p.illus{
  width : 60px;
  height : 60px;
  text-align : center;
  background : white;
  float : right;
  margin: 5px;
  margin-left: 7px;
  margin-right: 0px;
  margin-bottom : 15px;
  margin-top : 35px;
}

div#accueil div#actualites{
  padding-left : 0px;
  padding-right : 0px;
}

div#accueil div#actualites h2{
  margin-left : 10px;
  margin-right : 10px;
}

#idinteractive{
  float : right;
  display : block;
}