@charset "iso-8859-1";
	
	body, html {width: 100%; height: 100%; margin: 0px auto; padding: 0px; font-family: Tahoma, Geneva, sans-serif; font-size: 12px; background-image:url(img/st/fond.png); background-size:cover; background-position:center center; background-attachment:fixed;} 
	
	table { border: 0; }
	img { border: none; }
	form, dl, ul, ol, h1, h2, h3, h4, h5, h6, p {margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 0px; padding-top: 0px; padding-right: 0px; padding-bottom: 0px; padding-left: 0px; }
	 
	a:link {color: #8b48c1;  text-decoration: underline}
	a:visited {color: #8b48c1;  text-decoration: underline}
	a:active {color: #5600a8;  text-decoration: underline}
	a:hover {color: #5600a8; text-decoration: underline}
	
	td {color: #000000; font-size: 12px; font-family: Arial;}
	.clear { clear:both} 
	
	#mes_ok { margin: 10px 20px; font-size: 13px; padding: 10px 30px; background-color: #006600; color: #ffffff; font-weight: bold; }
	#mes_pok {margin: 10px 20px; font-size: 13px; padding: 10px 30px; background-color: #CC0000; color: #ffffff; font-weight: bold; }
	
	.global {
		width: 100%;
		text-align: center;
		z-index: 1;
	}
		.haut 
		 {
			max-width: 1150px; 
			margin: 0 auto; 
			text-align: left;
		}
			.logo {
				float: left;
				width: 250px;
				padding: 10px 0 0 0;
				text-align:right; 
			}
			.top {
				text-align:right;
			}
				.nuage {
					padding: 20px;
				}
				
				
		.contenu {
			position:relative;
			display:block;
			max-width: 1150px; 
			margin: 0 auto; 
			text-align: left;
			
		}
			.slogan {
				position:absolute;
				border-radius: 6px;
				border: none;
				color: #fff;
				padding: 5px 10px 5px 24px;
				font-weight: bold;
				right: 10px;
				top: -20px;
			}
				.slogan:before {
					position: absolute;
					content: " ";
					left: 10px;
					top:6px;
					border:6px solid transparent;
					border-left:8px solid #ff6d00;
				}
				
			.menu {
				float: left;
				width: 250px;
				margin: 0 20px 0 0;
				padding: 10px 0 0 0;
				background:url(img/st/fond-menu.png) bottom;
				display:block;
				font-size: 13px;
			}
				.menu ul {
					list-style: none;
					padding: 0;
					margin: 0 0 150px 0;
					text-transform: uppercase;
				}
					.menu ul li {
						margin: 0 4px 0 10px;	
						text-transform:uppercase;
						display: block;
					}
						.menu ul li.titre {
							background-color: #5600a8;
							padding: 6px 10px;
							color: #ff6d00;
						}
						.menu ul li.esp {
							border-left: 6px solid #5600a8;
						}
						.menu ul li.noesp {
							margin: 0 4px 0 16px;	
						}
					
						.menu ul li a{
							color: #fff;
							display: block;
							padding: 6px 10px;
							text-decoration:none;		
						}
							.menu ul li a:hover {
								background-color: #ff6d00;
							} 
			.menumobile { display: none;}
			
			.lecontenu {
				margin: 20px 0 0 290px;
			}
				.page {
					background-color:#FFF;
					padding: 20px 16px 16px 16px;
					text-align: justify;
				}
				
					.page h1 {
						font-size:20px;
						color: #6000ae;
					}
					.page h2 {
						font-size:15px;
						color: #ff6d00;
					}
					.page p, .page ul, .page ol {
						margin: 10px 0;
						font-size: 12px;
						line-height:16px;
						text-align:justify;
					}
					.page ul li {
						margin: 0 0 0 30px;
					}
					.page ol li {
						margin: 10px 0 10px 30px;
					}
					
				.bas {
					background-color: #e2abff;
					color: #666;
					padding: 5px;
					text-align: right;
					font-size: 11px;
				}
	/* fond violet */		
	.slogan,
	.menumobile {
		background: #8e57c2;
		background: -webkit-linear-gradient(#8e57c2, #7e02bb);
		background:    -moz-linear-gradient(#8e57c2, #7e02bb);
		background:     -ms-linear-gradient(#8e57c2, #7e02bb);
		background:      -o-linear-gradient(#8e57c2, #7e02bb);
		background:         linear-gradient(#8e57c2, #7e02bb);
	}
	
	/* FORMULAIRE */
	fieldset.form {
		width: 88%;
		margin: 20px 5%;
		padding:1%;
		background-color:#ecdaf5;
	}
		fieldset.form p { margin : 0}
		
		fieldset.form label {
			width: 35%;
			float:left;
			margin: 6px 1% 6px 0;
			text-align:right;
			font-weight: bold;
			color: #666;
		}
		
		fieldset.form input[type="text"],
		fieldset.form input[type="file"],
		fieldset.form p,
		fieldset.form textarea {
			width: 62%;
			float:right;
		}
		
		fieldset.form h2 {
			color: #0938e0;
		}
		fieldset.form p.desc {
			width: 100%;
			float: inherit;
			margin: 10px 0;
		}
	.button, .button:visited, input[type="submit"], button{
		padding:6px 12px;
		margin-top: 5px;
		background: #7e01bb;
		border-radius: 4px;
		border: none;
		background: -webkit-linear-gradient(#a753d1, #7e01bb);
		background:    -moz-linear-gradient(#a753d1, #7e01bb);
		background:     -ms-linear-gradient(#a753d1, #7e01bb);
		background:      -o-linear-gradient(#a753d1, #7e01bb);
		background:         linear-gradient(#a753d1, #7e01bb);
		color: #fff;
		cursor:pointer;
		font-size:14px;
	}
		.button:hover, input[type="submit"]:hover, button:hover{
			text-decoration:none;
			background: #ff6d00; 
			color: #fff;
		}
	
	/*RESPONSIVE*/
	@media screen and (max-width: 1190px) 
	{
		
	}	
	@media screen and (max-width: 990px) 
	{
		.nuage img { width: 450px; height: auto;}
		.slogan { width: 300px; font-size:11px; top: -30px; }
		.lecontenu {margin: 20px 0 0 270px;}
	}
	/*TAB 900 1024 Paysage */
	@media screen and (max-width: 900px) 
	{
		
		
	}
	/*TAB 720 768 Porttrait et smartphone PAysage */
	@media screen and (max-width: 740px) 
	{
		.nuage { display: none;}
		
		
		
	}
	@media screen and (max-width: 640px) 
	{
		.slogan { display: none;}
		.menu {width: 200px;}
		.lecontenu {margin: 20px 0 0 220px;}
		.logo {
			width: 100%;
			text-align:center; 
		}
		
		
		
	}
	/*TAB 320 480 Portrait Smartphone */
	@media screen and (max-width: 480px) 
	{
		.menu {display: none;}
		.lecontenu {margin: 20px 0 0 0;}
		.menumobile { 
			position: relative;
			display: block;
			text-align: center;
			margin: 20px 0;
			padding: 6px;
		}
			.menumobile select {width: 90%; font-size: 16px;}
		

	}
	/*TAB 320 Portrait Smartphone */
	@media screen and (max-width: 320px) 
	{
		
	}