html, body {
	color:#000;
	font-family: 'Roboto', sans-serif;
	font-size:14px;
	font-weight:300;
    height: 100%;
    width: 100%;
}
body{
	background-image:url(../img/bg_home.jpg);
	background-color:#fff;
	background-position:center center;
	background-repeat:no-repeat;
	background-size:cover;
	-moz-background-size:cover;
	-webkit-background-size:cover;
	display:block;
	overflow:hidden;
}

.fancybox-custom .fancybox-skin {
	box-shadow: 0 0 50px #222;
}
video::-internal-media-controls-download-button {
    display:none;
}

video::-webkit-media-controls-enclosure {
    overflow:hidden;
}

video::-webkit-media-controls-panel {
    width: calc(100% + 30px); /* Adjust as needed */
}

a{color:#000; text-decoration:underline;}
a:hover, a:active, a:visited, a:focus{text-decoration:none; border:none; outline: none;}
	header{
		display:block;
		left:0;
		position:fixed;
		top:0;
		width:100%;
		z-index:20;
	}
		.home{
			display: inline-block;
			left: 7px;
			overflow: hidden;
			position: absolute;
			top: 4px;
			z-index: 20;
		}
			.menu{
				display: inline-block;
				left: 45px;
				overflow: hidden;
				position: absolute;
				top: 7px;
				z-index: 30;
			}
				.imgChapitres{
					float: left;
					margin: 0 0.5em 0 0.5em;
					width: 25px;
				}

				.nav h5{
					color: #FFFFFF;
					display: inline-block;
					float: left;
					font-size: 1.3em;
					font-weight: 500;
					line-height: 100%;
					margin: 0 0 0 0.5em;
					padding: 0;
				} 
		.nav{
			background-color:rgba(0,0,0,.3);
			border-bottom:1px solid #fff;
			display:inline-block;
			height:40px;
			width:100%;
		}

	.btInfo {
		border-left: 1px solid #999999;
		cursor: pointer;
		display: block;
		height: 40px;
		position: absolute;
		overflow:hidden;
		right: 120px;
		top: 0;
		width: 40px;
		z-index: 30;
	}
	.ipod .btInfo, .ipad .btInfo{
		right: 110px;
	}
	.btPartager{
		border-left: 1px solid #999999;
		color: #FFFFFF;
		cursor: pointer;
		display: block;
		height: 30px;
		padding: 5px;
		position: absolute;
		right: 5em;
		top: 0;
		width: 30px;
		z-index: 30;
	}
	.mesVues {
		border-left: 1px solid #999999;
		color: #FFFFFF;
		cursor: pointer;
		display: block;
		float: right;
		height: 26px;
		margin-right:-5px
		overflow: hidden;
		padding: 7px 7px 7px 15px;
		position: absolute;
		right: 0;
		top: 0;
		width: 60px;
		z-index: 30;
	}
	.vuesActives{
		background-color:rgba(0,200,0,.5);
	}	
	.ipod .mesVues, .ipad .mesVues{
		margin-right:-13px
	}	
		.mesVues span {
			display: inline-block;
			padding: 0 0.5em 0 0;
			vertical-align: middle;
		}

/*** fin header ***/
	nav ul{
		background-color: rgba(0, 0, 0, 0.8);
		border-radius: 5px;
		display: none;
		left: 0;
		margin: 0.5em 0;
		padding: 0.2em 0.5em 0.5em;
		position: fixed;
		top: 2.5em;
		width: 250px;
		z-index:50;
	}
		nav li { 
			border-bottom: 1px solid #fff;
			display:block; 
			padding:10px 0;
			vertical-align:middle;
			width:100%;
		}
		nav li a img{ margin:0 20px; width:20px;}
		nav li a{
				color:#fff;
				display:block;
				font-size:1.2em;
				text-decoration:none;
				width:100%;
			}
			nav a:hover{
				color:#690;
				text-decoration:none;
			}


		.imgRetina{
			height:100%;
			overflow:hidden;
			position:relative;
		}
	#social{
		background-color: rgba(0, 0, 0, 0.8);
		border-radius: 5px;
		display: none;
		height: 20px;
		margin: 0.5em 0;
		padding: 1em;
		position: fixed;
		right: 2.5em;
		top: 2.5em;
		width: 85px;
		z-index: 20;
	}
		#social .btSocial {
			background-image: url("../img/inter/icones_social.png");
			background-position: center center;
			background-size: cover;
			display: block;
			height: 19px;
			position: absolute;
			right:1em;
			width: 90px;
			z-index:30;
		}
			#social .btSocial a {
				display:inline-block;
				height:100%;
				position:relative;
				width:30%;
			}
			#social .btSocial a:hover{
				text-decoration:none;
				border:none;
			}
h1{
	font-size:1.7em;
	font-weight:300;
	height:0;
	line-height:100%;
	margin:0 auto;
	text-indent:-9999px;
	width:300px;
}
h2{
	font-size:2em;
	font-weight:300;
	line-height:100%;
	margin:0 0 10px;
}
h3{
	font-size:1.7em;
	font-weight:300;
	line-height:100%;
	margin:1em 0;
}
h4{
	color:#fff;
	font-size:1.2em;
	font-style:italic;
	font-weight:300;
	line-height:100%;
	margin:0 0 1em;
}
h5{
	color:#fff;
	font-size:1em;
	font-weight:300;
	line-height:100%;
	margin:0;
	padding: 1em 0 1em;
}
p{margin:.5em 0;}
strong{
	font-weight:500;
}
.imgFull{
	display:none;
	height:100%;
	padding:40px 0 0;
	position:relative;
	overflow:hidden;
	width:100%;
	-moz-background-size:cover;
	-webkit-background-size:cover;
}
.imgIntro{
	display: block;
	height:100%;
	position:relative;
	overflow:hidden;
	width:100%;
}
.imgFull article{
	height: 95%;
	overflow-y: auto;
	-webkit-overflow-scrolling: touch;
    padding:30px 2% 30px;
    width: 96%;
}

	.imgIntro .oiseaux{
		background-color:rgba(50, 150, 110, 0.6);
	}
	.imgIntro .herbacees{
		background-color:rgba(50,205,50, 0.3);
	}
	.imgIntro .arbres{
		background-color:rgba(184, 140, 10, 0.6);	 
	}
	.imgIntro .amphibien{
		background-color:rgba(256, 250, 0, 0.55);
	}

/* info */
	
#info .logos{
	background-color:#fff;
	border-radius:10px;
	-webkit-border-radius: 10px;
	-mozt-border-radius: 10px;
	margin: 1em 0 3em;
	overflow:hidden;
	padding:2%;
	position:relative;
	width:96%;
}
	#info .logos img{
		float:left; margin:1em;
	}
	#info ul, #infos li {
		list-style:none;
		margin:1em;
		padding:0;
	}
	#info h3{margin-bottom:5px;	}
	#info h3 span{font-size:.7em; font-style:normal;	}

/* end info */
/***** elem ******/
.elem{
	background-color: rgba(50, 150, 110, 0.1);
	cursor:pointer;
	float:left;
	margin-bottom:1em;
	overflow:hidden;
	padding:1%;
	position:relative;
	width:100%;
}
.elem:hover{
	background-color: rgba(50, 150, 110, 0.2);
}
	.elem .img{
		border:2px #FFF solid;
		border-radius:10px;
		-webkit-border-radius: 10px;
		-mozt-border-radius: 10px;
		float:left;
		margin-right:.5em;
		overflow:hidden;
		max-width:120px;
		max-width:70px;
	}
		.elem .img img{
			width:100%;
			position:relative;
		}
	.elem .nom{
		padding:1%;	
	}
		.elem .nom h3{
			margin: 0;
		}
		.elem .nom h4{
			margin:.2em 0;
		}
	.elem .icones{
		display:inline-block;
		bottom:0;
		overflow:hidden;
		padding: 0 1%;
		position:absolute;
		right:0;
		text-align:right;
		width:80%;
	}
		.elem .icoElem{
			display:none;
		}
/***** end elem ******/

/*** slideshow ****/
.slideshow {
	display:block;
	height:100%;
	margin:0 auto;
	overflow:hidden;
	padding-top:15px;
	position:relative;
	width:100%;
}
	.slideshow article.slide{
		display:none;
		float:left;
		position:relative;
		padding:0 7% 2%;
		width: 86%;
	}
	.slVisible{}
	.slideshow .fleches{
		height: 50px;
		margin-top: -50px;
		padding: 0 1% 0 .5% ;
		position: absolute;
		top: 50%;
		width: 98.5%;
		z-index: 10;
	}
	.ipod .slideshow .flecheNext, .ipad .slideshow .flecheNext{
		right:0;
	}
	
		.flecheNext{
			display:block; 
			margin-top: -40px;
			overflow:hidden;
			position: absolute;
			right:15px;
			top: 50%;
		}
		.flechePrev{
			display:block; 
			left:0;
			margin-top: -40px;
			overflow:hidden;
			position: absolute;
			top: 50%;
		}
		.flecheNext img{ height:100px;}
		.flechePrev img{ height:100px;}
		.slide .enteteDes{
			display:block;
			float:left;
			padding:1em 0 1em;
			overflow:hidden;
		}
		.slide .enteteDes h5.cliquez{
			background-color: #FFFFFF;
			-webkit-border-top-left-radius: 5px;
			-webkit-border-top-right-radius: 5px;
			-moz-border-radius-topleft: 5px;
			-moz-border-radius-topright: 5px;
			border-top-left-radius: 5px;
			border-top-right-radius: 5px;
			color: #333333;
			display: table;
			font-size:12px;
			margin: 0 0 0 .5em;
			padding: 0.3em .5em;
		}
		.slide .enteteDes .slideshowImg{
			border:2px #FFF solid;
			border-radius:10px;
			-webkit-border-radius: 10px;
			-mozt-border-radius: 10px;
			display:block;
			float:left;
			margin-right:3%;
			overflow:hidden;
			width:49%;
		}
			.enteteDes .slideshowImg img{display:none; width:100%}
			.imgVisible{display:block!important;}
		
		.enteteDes .nom{
			float:left;
			width:45%;
		}
		.enteteDes .btnGeo{
			background-color:#506f00;
			border-radius:5px;
			-webkit-border-radius: 5px;
			-mozt-border-radius: 5px;
			box-shadow: 2px 2px 2px 2px #253301;
			-webkit-box-shadow: 2px 2px 2px 2px #253301;
			-mozt-box-shadow: 2px 2px 2px 2px #253301;
			color:#fff;
			display:block;
			font-size:16px;
			font-weight:normal;
			overflow:hidden;
			padding:5px 10px;
			position: relative;
			text-decoration:none;
			width:130px;
			z-index:20;
		}
		.gpsAudio{
			display:block;
			float:left;
			height:90px;
		}
		 .gpsAudio div{
			 float:left; 
			 height:90px;
			 position:relative; 
		}
		 	.gpsAudio .audio{margin-left:30px; }
			.enteteDes .btnGeo img{
				margin-top:-3px;
			}
			.slide .description h3{
				color:#fff;
				margin:0 0 .2em;
			}
			.audio{
				display:block;
			}
			audio{
				border-radius: 5px;
				display: block;
				height: 35px;
				margin: -5px 0 20px;
				width: 150px;
			}
			.ie audio{
				height: auto;
				width: auto;
			}
			.ipod audio, .ipad audio, .ipad android{
				border-radius:5px!important;
				-webkit-border-radius: 5px!important;
				-mozt-border-radius: 5px!important;
				display:block!important;
				height:40px!important;
				margin:-5px 0 20px !important;
				width:50px!important;
			}
		
		.slide .description{
			display: block;
			float: left;
			margin: 1em 1em 5em;
			padding-bottom:70px;
	
		}
			
		
/*** end slideshow ***/

/******* landscape **********/	
	.landscape .imgIntro .logo{
		display:block;
		float: left;
		height:100%;
		width:46%
	}
			.landscape .mshLogo{
				margin:auto 20%;
				overflow:hidden;
				width:60%;
			}
	.landscape .imgIntro .el{
		cursor:pointer;
		display:block;
		float: left;
		height:50%;
		width:27%
	}
		.landscape .el .icones{
			margin:auto 30%;
			overflow:hidden;
			width:40%;
		}

.landscape #panier .elem{
	width:98%;
}
	.landscape .elem:nth-child(odd){
		margin-right:1% ;
	}


/***** end landscape ********/	
/******* portrail **********/
.portrail .imgIntro .logo{
		display:block;
		float: left;
		height:50%;
		width:100%
	}
			.portrail .mshLogo{
				margin:auto auto;
				overflow:hidden;
				width:60%;
			}
	.portrail .imgIntro .el{
		cursor:pointer;
		display:block;
		float: left;
		height:25%;
		width:50%
	}
		.portrail .el .icones{
			margin:auto 35%;
			overflow:hidden;
			width:30%;
		}
.portrail .elem{width:98%;}
/***** end portrail ********/
/***** indicateurs *****/
.indicateurs {
	/*background-color:rgba(30, 40, 8, 0.6);*/
	top:41px;
    display: none;
    overflow: hidden;
    padding: 3px 0;
    position: absolute;
    width: 100%;
    z-index: 30;
}

	.indicateurs div{
		display:table;
		margin: 0 auto;
		text-align:center;
	}
		.indicateurs span{
			background-color:#fff;
			border-radius:50%;
			-webkit-border-radius: 50%;
			-mozt-border-radius: 50%;
			display:block;
			float:left;
			height:10px;
			margin: 0 0.3em;
			width:10px;
		}
		.indVisible{
			background-color:#333!important;
		}
/***** indicateurs *****/

/***** signature *****/
.signature{
	border-bottom: solid #fff 1px;
	bottom:15px;
	color:#fff;
	display:none;
	left:2%;
	overflow:hidden;
	position:absolute;
	width:94%;
	z-index:30;
}
	.signature h5 {
		font-size:.9em;
		font-weight:300;
		margin:0 0 .3em;
		overflow:hidden;
		padding:0;
	}
	.signature span {
		font-size:.8em;
		font-weight:300;
	}
		.signature strong{
			font-weight:500;
		}
/***** end signature *****/
/***** info *****/
#info h2{
	margin:.5em 0 1em 4.5em;
}
#info h3{
	color:#FFF;
}
/***** end info *****/
/***** pannier *****/
#panier .elem{
	display:none;
	float:left;
	margin-bottom:1em;
	overflow:hidden;
	padding:1%;
	position:relative;
}
	#panier article{
		margin:0 0 1em;
		padding-top:10px;
	}
	#panier .btn{
		border:1px solid #fff;
		display:block;
		float:left;
		margin-bottom:1em;
		overflow:hidden;
		padding: 10px 0;
		text-align:center;
		text-decoration:none;
		width:49.5%;
	}
	.getDatos, .getDatos:visited, .getDatos:active, .getDatos:link { background-color:#999;}
	.getDatos:hover{ background-color:#030;}
	#panier h3{	margin:0 0 10px;}
	#panier h4{
		display:none;
		margin-top:30px;
		width:100%;
	}
	#panier .elem .img{
		border:2px #FFF solid;
		border-radius:10px;
		-webkit-border-radius: 10px;
		-mozt-border-radius: 10px;
		float:left;
		margin-right:.5em;
		overflow:hidden;
		width:50px;
	}
		#panier .elem .img img{
			width:100%;
			position:relative;
		}
	#panier .elem .nom{
		float:left;
		padding:1%;
		padding-right:10px;
		margin-right:25px;
	}
		#panier .elem .nom h3{
			color:#fff;
			font-size:18px;
			margin: 0;
		}
	#panier .elem .counter{
		display:block;
		float:right;
		height:50px;
		overflow:hidden;
		position:absolute;
		right:0;
		text-align:right;
		width:40px;
	}
		#panier .counter p{
			background-color:#fff;
			border-radius:5px;
			-webkit-border-radius: 5px;
			-mozt-border-radius: 5px;
			color:#060;
			font-size:24px;
			padding: 0 5px 0 0;
		}

/***** end pannier ******/


/****** send mail ********/
/********** Send Mail form ************/
/* Style for the contact form and status messages */
#falsoFondo{
	background-color:rgba(256, 256, 256, .8);
	display:none;
	height:100%;
	left:0;
	position:absolute;
	top:0;
	width:100%;
	z-index:100;
}

#contactForm, .statusMessage {
  color: #666;
  background-color: #efefef;
  background: -webkit-gradient( linear, left bottom, left top, color-stop(0,#efefef), color-stop(1, #fff) );
  background: -moz-linear-gradient( center bottom, #efefef 0%, #fff 100% );  
  border: 1px solid #aaa;
  -moz-box-shadow: 0 0 1em rgba(0, 0, 0, .5);
  -webkit-box-shadow: 0 0 1em rgba(0, 0, 0, .5);
  box-shadow: 0 0 1em rgba(0, 0, 0, .5);
  opacity: .95;
  z-index:100;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
}
/* The form dimensions */
#contactForm {
  width: 100%;
  height: 100%;
  padding: 0 1.5em 1.5em 1.5em;
  margin: 0 auto;
  display:none;
}
/* Position the form in the middle of the window (if JavaScript is enabled) */
#contactForm.positioned {
  position: fixed;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  margin-top: auto;
  margin-bottom: auto;
}
/* Dimensions and position of the status messages */
.statusMessage {
  display: none;
  margin: auto;
  width: 30em;
  height: 2em;
  padding: 1.5em;
  position: fixed;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
}
.statusMessage p {
  text-align: center;
  margin: 0;
  padding: 0;
}
/* The header at the top of the form */
#contactForm h2 {
  font-size: 2em;
  font-style: italic;
  letter-spacing: .05em;
  margin: 0 0 1em -.75em;
  padding: 1em;
  width: 19.5em;  
  color: #aeb6aa;
  border-bottom: 1px solid #aaa;
}
/* Give form elements consistent margin, padding and line height */
#contactForm ul {
  list-style: none;
  margin: 0;
  padding: 0;
}
#contactForm ul li {
  margin: .9em 0 0 0;
  padding: 0;
}
#contactForm input, #contactForm label {
  line-height: 1em;
}
/* The field labels */
label {
  display: block;
  float: left;
  width: 85%;
  padding: .4em 0 0 0;
  margin: .15em .5em 0 0;
  color:#333;
}
/* The fields */
input, textarea {
  display: block;
  margin: 0;
  padding: .4em;
  width: 85%;
  font-family: "Georgia", serif;
  font-size: 1em;
  border: 1px solid #aaa;
  -moz-box-shadow: rgba(0,0,0,.2) 0 1px 4px inset;
  -webkit-box-shadow: rgba(0,0,0,.2) 0 1px 4px inset;
  box-shadow: rgba(0,0,0,.2) 0 1px 4px inset;
  background: #fff;
}
textarea {
  height: 10em;
  line-height: 1.5em;
  resize: none;
}
/* Place a border around focused fields, and hide the inner shadow */
#contactForm *:focus {
  border: 1px solid #66f;
  outline: none;
  box-shadow: none;
  -moz-box-shadow: none;
  -webkit-box-shadow: none;
}
/* Display correctly filled-in fields with a green background */
input:valid, textarea:valid {
  background: #dfd;
}
/* The Send and Cancel buttons */
input[type="submit"], input[type="button"] {
  float: left;
  margin: 1em .7em 0 0;
  width: 10em;
  padding: .5em;
  border: 1px solid #666;
  -moz-box-shadow: 0 0 .5em rgba(0, 0, 0, .8);
  -webkit-box-shadow: 0 0 .5em rgba(0, 0, 0, .8);
  box-shadow: 0 0 .5em rgba(0, 0, 0, .8);
  color: #000;
  background: #fff;
  font-size: 1em;
  line-height: 1em;
  font-weight: bold;
  opacity: .7;
  -webkit-appearance: none;
  -moz-transition: opacity .5s;
  -webkit-transition: opacity .5s;
  -o-transition: opacity .5s;
  transition: opacity .5s;
}
input[type="submit"]:hover,
input[type="submit"]:active,
input[type="button"]:hover,
input[type="button"]:active {
  cursor: pointer;
  opacity: 1;
}
input[type="submit"]:active, input[type="button"]:active {
  color: #333;
  background: #eee;
  -moz-box-shadow: 0 0 .5em rgba(0, 0, 0, .8) inset;
  -webkit-box-shadow: 0 0 .5em rgba(0, 0, 0, .8) inset;
  box-shadow: 0 0 .5em rgba(0, 0, 0, .8) inset;
}
input[type="button"] {
}
/* Header/footer boxes */
.wideBox {
  clear: both;
  text-align: center;
  margin: 70px;
  padding: 10px;
  border: 1px solid #333;
}
#contactForm h3{
	color:#333;
	margin:35px 0 25px;
	font-size:24px;
	font-weight:400;
}

/**** end send mail ******/



/*** lt-ie9 ***/

.lt-ie9 .footerNav, .lt-ie9 .imgNote, .lt-ie9 .intro{
}


/*** media querys ***/

/* Smartphones and others devises iPod 3 and old (portrait and landscape) ----------- */
@media only screen 
and (min-device-width : 320px) 
and (max-device-width : 480px) {
/* Styles */


}

/* Smartphones (landscape) ----------- */
@media only screen 
and (min-width : 321px) {
/* Styles */
}

/* Smartphones (portrait) ----------- */
@media only screen 
and (max-width : 320px) {
/* Styles */
.gpsAudio div{margin: 0 10px;}
.flecheNext img{ height:80px;}
.flechePrev img{ height:80px;}
	
}

/*  Smartphones and others devises a (portrait and landscape) ----------- */
@media only screen 
and (min-device-width : 480px) 
and (max-device-width : 640px) {	
/* Styles */
}

/* Smartphones (landscape) ----------- */
@media only screen 
and (min-width : 640px) {
/* Styles */
}

/* Smartphones (portrait) ----------- */
@media only screen 
and (max-width : 480px) {
/* Styles */
.gpsAudio div{margin: 0 10px;}
.flecheNext img{ height:80px;}
.flechePrev img{ height:80px;}
}


/*  Smartphones and others devises iPod 4 and recent a (portrait and landscape) ----------- */
@media only screen 
and (min-device-width : 640px) 
and (max-device-width : 960px) {
/* Styles */	
	
}

/* Smartphones (landscape) ----------- */
@media only screen 
and (min-width : 960px) {
/* Styles */
.gpsAudio div{margin: 0 10px;}
.flecheNext img{ height:80px;}
.flechePrev img{ height:80px;}
}

/* Smartphones (portrait) ----------- */
@media only screen 
and (max-width : 640px) {
/* Styles */
}


/* iPhone 4 ----------- */
@media
only screen and (-webkit-min-device-pixel-ratio : 1.5),
only screen and (min-device-pixel-ratio : 1.5) {
/* Styles */
}
/* iPhone 5 ----------- */
@media
only screen and (-webkit-min-device-pixel-ratio : 2),
only screen and (min-device-pixel-ratio : 2) {
/* Styles */
}


/* iPads (portrait and landscape) ----------- */
@media only screen 
and (min-device-width : 768px) 
and (max-device-width : 1024px) {
/* Styles */
	/* The form dimensions */
	#contactForm {
	  width: 40em;
	  height: 30em;
	  padding: 0 1.5em 1.5em 1.5em;
	  margin: 0 auto;
	  display:none;
	}
	/* labels */
	label {
	  display: block;
	  float: left;
	  clear: left;
	  text-align: right;
	  width: 28%;
	  padding: .4em 0 0 0;
	  margin: .15em .5em 0 0;
	  color:#333;
	}
	/* The fields */
	input, textarea {
	  display: block;
	  margin: 0;
	  padding: .4em;
	  width: 67%;
	  font-family: "Georgia", serif;
	  font-size: 1em;
	  border: 1px solid #aaa;
	  -moz-box-shadow: rgba(0,0,0,.2) 0 1px 4px inset;
	  -webkit-box-shadow: rgba(0,0,0,.2) 0 1px 4px inset;
	  box-shadow: rgba(0,0,0,.2) 0 1px 4px inset;
	  background: #fff;
	}
	input[type="submit"], input[type="button"] {
	  float: right;
	  margin: 1em 1em 0 1em;
	}
	.slide .enteteDes .slideshowImg{width:40%;}
		.enteteDes .nom{width:54%;}
}

/* iPads (landscape) ----------- */
@media only screen 
and (min-device-width : 768px) 
and (max-device-width : 1024px) 
and (orientation : landscape) {
/* Styles */
}

/* iPads (portrait) ----------- */
@media only screen 
and (min-device-width : 768px) 
and (max-device-width : 1024px) 
and (orientation : portrait) {
/* Styles */
}

/***** Retina iPad *******/
/* Retina iPads (portrait and landscape) ----------- */
@media only screen 
and (min-device-width : 768px) 
and (max-device-width : 1024px) 
and (-webkit-min-device-pixel-ratio: 2) {
/* Styles */
}

/* Retina iPads (landscape) ----------- */
@media only screen 
and (min-device-width : 768px) 
and (max-device-width : 1024px) 
and (orientation : landscape) 
and (-webkit-min-device-pixel-ratio: 2) {
/* Styles */
}

/* Retina iPads (portrait) ----------- */
@media only screen 
and (min-device-width : 768px) 
and (max-device-width : 1024px) 
and (orientation : portrait) 
and (-webkit-min-device-pixel-ratio: 2) {
/* Styles */
}


/* Desktops and laptops ----------- */
@media only screen 
and (min-width : 1025px) {
/* Styles */
	html, body {
		font-size:16px;
	}
	/* The form dimensions */
	#contactForm {
	  width: 40em;
	  height: 30em;
	  padding: 0 1.5em 1.5em 1.5em;
	  margin: 0 auto;
	  display:none;
	}
	/* labels */
	label {
	  display: block;
	  float: left;
	  clear: left;
	  text-align: right;
	  width: 28%;
	  padding: .4em 0 0 0;
	  margin: .15em .5em 0 0;
	  color:#333;
	}
	/* The fields */
	input, textarea {
	  display: block;
	  margin: 0;
	  padding: .4em;
	  width: 67%;
	  font-family: "Georgia", serif;
	  font-size: 1em;
	  border: 1px solid #aaa;
	  -moz-box-shadow: rgba(0,0,0,.2) 0 1px 4px inset;
	  -webkit-box-shadow: rgba(0,0,0,.2) 0 1px 4px inset;
	  box-shadow: rgba(0,0,0,.2) 0 1px 4px inset;
	  background: #fff;
	}
	input[type="submit"], input[type="button"] {
	  float: right;
	  margin: 1em 1em 0 1em;
	}
	.landscape .elem{
		width:47%;
	}
	.slide .enteteDes .slideshowImg{width:35%;}
		.enteteDes .nom{width:59%;}
}

/* Large screens ----------- */
@media only screen 
and (min-width : 1824px) {
/* Styles */
	html, body {
		font-size:18px;
	}
	/* The form dimensions */
	#contactForm {
	  width: 40em;
	  height: 30em;
	  padding: 0 1.5em 1.5em 1.5em;
	  margin: 0 auto;
	  display:none;
	}
	/* labels */
	label {
	  display: block;
	  float: left;
	  clear: left;
	  text-align: right;
	  width: 28%;
	  padding: .4em 0 0 0;
	  margin: .15em .5em 0 0;
	  color:#333;
	}
	/* The fields */
	input, textarea {
	  display: block;
	  margin: 0;
	  padding: .4em;
	  width: 67%;
	  font-family: "Georgia", serif;
	  font-size: 1em;
	  border: 1px solid #aaa;
	  -moz-box-shadow: rgba(0,0,0,.2) 0 1px 4px inset;
	  -webkit-box-shadow: rgba(0,0,0,.2) 0 1px 4px inset;
	  box-shadow: rgba(0,0,0,.2) 0 1px 4px inset;
	  background: #fff;
	}
	input[type="submit"], input[type="button"] {
	  float: right;
	  margin: 1em 1em 0 1em;
	}
	.landscape .elem{
		width:47%;
	}
	.slide .enteteDes .slideshowImg{width:35%;}
		.enteteDes .nom{width:59%;}
}