@media all and (max-width: 800px) {

body{
font-family: 'Dosis', sans-serif;
	color:#fff;
	width:100%;
	background-color:transparent;

}
#top_acc {
width:94%;
background-image:url(../Images/rideau_rouge.jpg);
	background-repeat: no-repeat;
	background-size: 170%;
		background-position: 50% 00%;
		background-color: white;
position: absolute;
top: 0px;
font-family: 'Dosis', sans-serif;
left:0;
right:0;
height:1000px;
font-size:16px;
padding:15px;

}
#top_acc table {

font-size:20px;
height:200px;
padding-top: 135px;
width:80%;
left:-7%;
right:0%;
position:absolute;
text-align:center;
}
#top_acc img {
	width:100px;
}

#top_acc .acteur{

font-size:16px;
font-family: 'Sonsie One', sans-serif;
 background-color: #E5E5E5;
 color: black;
 text-align: center;
}


 #top_acc td { display: table-row; text-align: center; min-width:100%;}
#top_acc table, tbody { display: block;  }
#top_acc tr { display: table;float:none;width:100%;}

.rr{
font-size:24px;
}

.biarritz{
font-size:14px;

}


#top {
width:100%;
background-color: rgba(100, 100, 100, 0.3);
background-image:url(../Images/rideau_rouge.jpg);
	background-repeat: no-repeat;
	background-position:100% 100%;
	background-size: 100%;
position: absolute;
top: 0px;
left:0px;
height:210px;
z-index:1;
}


#bandeau {


		position:absolute;
		color:#fff;
		top:-10px;
		left:0px;
		height:58px;
		width:100%;
		background-color: rgba(0,0,0,0.7);

		z-index: 3;
		}

	#bandeau table {

		font-size: 22px;
		position:absolute;
		right:5%;
		vertical-align: middle;
		padding-top: 7px;

		}

		#bandeau a, a:hover{

		color:white;
		font-size:20px;

		}

		#presentation {

		position:absolute;
		top:460px;
		width: 100%;
		left:0;
		background-color: white;
		font-size:15px;
		color:black;
		padding:5px;
		height:330px;

		}

		#presentation td{

		display: table-row; width:100%;text-align:center;

		}

			#contenu_acc {

		position:absolute;
		top:880px;
		background-color: #fff;
		font-size:18px;
		width:96%;
		color:black;
		z-index:5;
		left:0;
		}
		#contenu_acc table{

		font-size:18px;
		width:98%;


		}

		#contenu_acc table img{

		font-size:18px;
		max-width: 200px;
		border:3px solid black;

		}

		#contenu_acc table td{

		vertical-align: top;
		}


	#contenu_acc table, tbody { display: block;  }
#contenu_acc tr { display: table; float:left; border-bottom:5px solid gray; margin-bottom:10px;}
 #contenu_acc td { display: table-row; width:100%;}
 #contenu_acc hr { display: none; width:100%;}

			#contenu {

		position:absolute;
		top:225px;
		left:0px;
		padding-left:10%;
		padding-right:10%;
		font-size:19px;
		width:80%;
		max-width:100%;
		color:black;
		}

		#contenu table, tbody { display: block;  }
#contenu tr { display: table; float:left;}
 #contenu td { display: table-row; width:100%;}

		.bagardie {

			text-align:center;
			font-weight:bold;
			font-size: 17px;

		}


		.titre_news {


		font-size:22px;
	color:#871011;
	font-weight: bold;

	}
	.titre_news a, a:visited{

		text-decoration: none;
		font-size:22px;
	color:#871011;
		font-weight: bold;

	}

		.titre_news a:hover, a:focus, a:active{

		text-decoration: none;
		font-size:22px;
	color:#871011;
		font-weight: bold;
		background: none;
		padding:0;

	}

	iframe {

	width:250px; height:150px;

	}

#footer {

		height:auto;
		width:100%;

		position: absolute;

		font-size:16px;
		color:#fff;
		text-align:center;
		border-top:1px solid black;
		background-color: #871011;

		}
		#footer a {

		color:#fff;
		font-size:16px;

		}
		#footer a:hover {

		text-decoration: underline;

		}

		#footer table, tbody { display: block; }
#footer tr { display: table; }
 #footer td { display: table-row; }
.clear{ clear:both }

.link {
	color:#0000CD;
	text-decoration:underline;
	font-size: 20px;

}

.link a, a:visited{
	color:#0000CD;
	text-decoration:underline;
	font-size: 18px;

}
.link a:hover, a:focus{

text-decoration:underline;
color:#0000CD;
font-size:18px;
}


/****************formulaires**************/


		form{
			position: relative;
			left:-10%;
			clear: both;
			float: left;
		}

	select, option{

	font-size:18px;
	height:35px;
	padding-right:10px;
		font-family: 'Oxygen', sans-serif;
	}

	textarea{

	width:100%;
	font-size: 18px;
	}

	input[type="submit"], input[type="button"]	{

	width:200px;
	font-size:18px;

	border-radius: 22px / 20px;
	-webkit-border-radius: 22px / 20px;
	-moz-border-radius: 22px / 20px;
	}

	input[type="reset"], input[type="button"]	{


	width:200px;
	font-size:18px;

	border-radius: 22px / 20px;
	-webkit-border-radius: 22px / 20px;
	-moz-border-radius: 22px / 20px;
	}
	input[type="text"] {
	width:250px;
	height:26px;

	font-size: 18px;
	}

		input[type="email"] {
	width:250px;
	height:26px;

	font-size: 18px;
	}

	input:invalid {
  border-color: 2px solid red;
}

input:valid {
   border: 2px solid green;
}



h3{
font-size:25px;
color: #871011;
font-family: 'Dosis', sans-serif;
font-weight: bold;
}





/*menuhaut*/
/*******************************/


/* titre du logo */

#menuHaut .logo img a{


height:75px;

}

#menuHaut .show-menu img {


height:26px;

}
#menuHaut table {

position: absolute;
top:48px;
height:85px;

background-color: white;
left:0;
width:100%;
font-size:16px;
color:#871011;
font-family: 'Sonsie One', cursive;

}
#menuHaut table a:hover {
	background-color:transparent;
	color:#871011;
}


/*Strip the ul of padding and list styling*/
ul {
	list-style-type:none;
	margin:0;
	padding:0;

	top:0px;
	background-color: white;
	height:0px;
	width:40%;


		position: static;
		display: none;

}

/*Create a horizontal list with spacing*/
li {
	display:inline-block;
	text-align: center;
width:10%;
font-size:17px;

		z-index:30000;
		position:relative;
		left:24%;
}

/*Style for menu links*/
li a, a:visited {
	display:block;
	min-width:100px;
	height: 85px;
	text-align: center;


}
li a:hover, a:focus {
	display:block;
	min-width:100px;
	height: 85px;
	text-align: center;
	color: #000;
	background: #FFF;
	text-decoration: underline;
	font-size:17px;


}
/*Hover state for top level links*/
li:hover a {
	background: #871011;
	color: white;
	text-decoration: none;
	font-weight: normal;
	font-size:17px;

}

/*Style for dropdown links*/
li:hover ul a {
	background-color: #000;
	color: white;
top:-85px;
	z-index:555555 !important;
	position: relative;
	height:inherit;

}

/*Hover state for dropdown links*/
li:hover ul a:hover {
	background: #E5E5E5;
	color: #000;

}

/*Hide dropdown links until they are needed*/
li ul {
	display: none;
	position:relative;
	top:0px;
	background-color: #000;

}

/*Make dropdown links vertical*/
li ul li {
	display: block;
	width: 100%;
	left:100%;
	top:-100%;
}

/*Prevent text wrapping*/
li ul li a {
	width: auto;
	min-width: 100px;
	padding: 0 1px;
}

/*Display the dropdown on hover*/
ul li a:hover + .hidden, .hidden:hover {
	display: block;
}

/*Style 'show menu' label button and hide it by default*/
.show-menu {

	text-decoration: none;
	color: #fff;
	text-align: center;
	display: none;
	position:absolute;
	top:-3px;
	left:5%;
	z-index:30000;
}


/*Hide checkbox*/
input[type=checkbox]{
    display: none;
}

/*Show menu when invisible checkbox is checked*/
input[type=checkbox]:checked ~ #menu{
    display: block;
   z-index:30000;
}


	/*Make all menu links full width*/
	ul li, li a {
		width: 100%;

	}


	/*Display 'show menu' link*/
	.show-menu {
		display:block;


	}

}