html	{
			background-image:url('images/pareo.jpg');
			/*background-color:#BFF4FF;*/
			}

body	{
			margin:auto;
			width:900px;
			height:auto;
			color:#002D47;
			font-family:verdana;
			background:#fff;
			}
			
#left_index	{
				width:550px;
				height:1000px;
				float:left;
				}
				
#right_index	{
				width:330px;
				height:auto;
				margin-left:550px;
				
				}
								
.titre_index	{
					
					margin-left:40px;
					margin-top:20px;
					font-style:italic;
					}
					
.couleur	{
				color:#0099FF;
				}
				
#video	{
			margin-left:60px;
			
			}
			
#texte_home	{
				width:440px;
				height:auto;
				margin-left:40px;
				}
				
#promo	{
			margin-left:10px;
			
			}
				
/*---------------- menu ----------------*/

#menu2 {padding:0; width:900px; margin:0; list-style:none; height:28px; position:relative; z-index:500; font-family:arial, verdana, sans-serif; background:#002D47; border-bottom:1px solid #edb;}
#menu2 li.top {display:block; float:left;}

#menu2 li a.top_link {display:block; height:25px; float:left; line-height:22px; font-size:12px; font-weight:bold; padding:0 50px 0 10px; color:#edb; text-decoration:none; border-top:3px solid #002D47;}

#menu2 li a.top_link:hover {color:#5FB7FF;}

#menu2 li:hover > a.top_link {color:#5FB7FF;}

#menu2 table {border-collapse:collapse; width:0; height:0; position:absolute; top:0; left:0;}

/* Default link styling */

/* Style the list OR link hover. Depends on which browser is used */

#menu2 a:hover {visibility:visible; position:relative; z-index:200;}
#menu2 li:hover {position:relative; z-index:200;}

/* keep the 'next' level invisible by placing it off screen. */
#menu2 ul, 
#menu2 :hover ul ul, 
#menu2 :hover ul :hover ul ul,
#menu2 :hover ul :hover ul :hover ul ul,
#menu2 :hover ul :hover ul :hover ul :hover ul ul {position:absolute; left:-9999px; top:-9999px; height:0; margin:0; padding:0; list-style:none;}

#menu2 :hover ul.sub {left:0; top:25px; white-space:nowrap; width:120px; height:auto; z-index:300; padding-top:5px; background:url(trans.gif);}
#menu2 :hover ul.sub li {display:block; float:left; width:100%; height:25px;}
#menu2 :hover ul.sub li span {display:block; height:25px; float:left; width:90px; font-weight:normal;}
#menu2 :hover ul.sub li b {display:block; height:25px; float:left; width:30px; font-weight:normal;}

#menu2 :hover ul.sub li a {display:block; position:relative; font-size:12px; height:25px; width:120px; margin-right:-30px; line-height:25px; text-indent:10px; color:#fff; text-decoration:none; background:url(trans.gif);}

#menu2 :hover ul.sub li span a:hover {color:#002D47;}

#menu2 :hover ul.sub li:hover > span a {color:#002D47;}

#menu2 :hover ul :hover ul,
#menu2 :hover ul :hover ul :hover ul,
#menu2 :hover ul :hover ul :hover ul :hover ul,
#menu2 :hover ul :hover ul :hover ul :hover ul :hover ul
{left:120px; top:0; white-space:nowrap; width:120px; z-index:400; height:auto;}

#menu2 :hover ul.wide {width:150px;}
#menu2 :hover ul.wide li span {width:120px;}
#menu2 :hover ul.wide li a {width:150px;}

#menu2 :hover ul.narrow {width:90px;}
#menu2 :hover ul.narrow li span {width:60px;}
#menu2 :hover ul.narrow li a {width:90px;}

#menu2 :hover ul.narrow :hover ul,
#menu2 :hover ul :hover ul.narrow :hover ul,
#menu2 :hover ul :hover ul :hover ul.narrow :hover ul,
#menu2 :hover ul :hover ul :hover ul :hover ul.narrow :hover ul
{left:90px;}

#menu2 li > span {
background: url(images/tab-midleft.png);
}
#menu2 li > b {
background: url(images/tab-midright.png)
}
#menu2 li.fly > b {
background: url(images/tab-midright-sub.png)
}

#menu2 li.subtop > span,
#menu2 li.flytop > span { 
background:url(images/tab-topleft.png);
}
#menu2 li.subtop > b {
background:url(images/tab-topright.png);
}

#menu2 li.flytop > b {
background:url(images/tab-topright-sub.png);
}

#menu2 li.subbot > span,
#menu2 li.flybot > span {
height:35px !important; background:url(images/tab-botleft.png);
}

#menu2 li.subbot > b {
height:35px !important; background:url(images/tab-botright.png);
}
#menu2 li.flybot > b {
height:35px !important; background:url(images/tab-botright-sub.png);
}


/*----------------- cours ----------------------*/


#slideshow	{
				width:840px;
				height:300px;
				margin-top:20px;
				margin-left:-10px;
				}
				

UL#portfolio LI IMG {
 BORDER-TOP-WIDTH: 0px; 
 BORDER-LEFT-WIDTH: 0px; 
 BORDER-BOTTOM-WIDTH: 0px; 
 BORDER-RIGHT-WIDTH: 0px;
}
#slideshow UL LI {
 LIST-STYLE-TYPE: none;
}

.texte_cours	{
					width:840px;
					height:auto;
					margin-left:30px;
					}

.titre_cours	{
					margin-left:50px;
					
					}
					
 a.reservation	{
					text-decoration:none;
					color:#002D47;
					font-size:120%;
					margin-left:700px;
					}
 a:hover.reservation	{
					text-decoration:none;
					color:#4FD1FF;
					font-size:120%;
					margin-left:700px;
					}


#container  img	{
			border:0;
			}


/*------------------ surf camps ---------*/

#text_camps	{
					width:750px;
					height:auto;
					margin-left:75px;
					font-family:arial;
					text-align:center;
					}
					
.green	{
			color:#69B022;
			}
/*-------------- popup Beaurivage ----------------*/

div #map-beaurivage {
	border: 6px solid red;
}

/*------------- contact --------------*/

.titre_contact	{
					text-align:center;
					
					}

#texte_form p {
				margin-left:150px;
				
				}



#formulaire	{
				margin-left:20px;
				margin-top:20px;
				width:800px;
				height:550px;
				color:#002D47;
}

#formulaire_camps	{
				margin-left:20px;
				margin-top:20px;
				width:800px;
				height:550px;
				color:#002D47;
}
				

.colonne_gauche{
		width:25%;
		text-align:left;
		float:left;
		}

.submit	{
			margin-left:115px;
			}
			
.submit input[type=submit] {	background-color:#002D47;
								border:1px solid #808080;
								color:#ffffff;
								}
								
.colorinput
			{
				background-color: #002D47;
				color: #ffffff;
				}
				
.form	{
			margin-left:255px;
			margin-top:75px;
			
			}