/*********************************************************************

		TABLETTES ET SMARTPHONES

*********************************************************************/

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

/* Structure générale */

		header {
		    padding: 0 0 10px 0;
		}
		#wraper, footer {
			width: 100%;
			margin: 0;
		}
		section {
			width: 100%;
			margin: 0;
			padding: 0;
		}
		section article {
			width: 100%;
		}

/* Menu toggle */

	/* On supprime la position fixed */ 

			nav#menu {
			    position: initial;
			}

	/* On fait disparaître le menu ordinateurs et tablettes de largeur > 1200 px */

			nav#menu ul {
				background: linear-gradient(to bottom, rgba(255,30,0,0.9), rgba(255,30,0,0.8));;
				display: none;
			}
			/* Le bouton RESERVER va être traité autrement */ 
			nav#menu ul li:nth-child(2){
			}
			header h1 img {
				display: none;
			}

	/* Le menu hamburger et le logo attenant */

			nav#menu #nav-toggle span {
			    display: block;
			    height: 31px;
			    width: 57px;
			    float: left;
			    margin: 4px 7px;
			    background: linear-gradient(to bottom, #fff 0%, #fff 20%, transparent 20%, transparent 40%, #fff 40%, #fff 60%, transparent 60%, transparent 80%, #fff 80%, #fff 100%);
			}
			#nav-toggle img {
			    width: 46%;
			    margin-top: -6px; 
			    margin-left: -67px;
			}

	/* Bouton orange "RESERVEZ" */

		a#bouton_reservez {
		    display: block;
		    padding: 13px 20px;
		    text-transform: uppercase;
		    text-align: center;
		    letter-spacing: 5px;
		    background-color: #FF1e00;
		    color: #fff;
			background: #FF1e00;
			background-image: -webkit-linear-gradient(top, #FF1e00, #d62e00);
			background-image: -moz-linear-gradient(top, #FF1e00, #d62e00);
			background-image: -ms-linear-gradient(top, #FF1e00, #d62e00);
			background-image: -o-linear-gradient(top, #FF1e00, #d62e00);
			background-image: linear-gradient(to bottom, #FF1e00, #d62e00);
	  	}

	/* On traite le style du menu toggle */

			nav#menu #nav-toggle {
			    display: block;
			    height: 54px;
			    line-height: 35px;
			    padding: 0;
			    margin: 0;
			    color: white;
			    text-transform: uppercase;
			    font-size: 14px;
			    color: #FFF;
			    letter-spacing: 2px;
			    font-weight: 500;
			    text-align: center;
			    padding: 18px 15px;
			    background-color: black;
			}
			nav#menu ul li {
				width: 100%;
				border-top: 1px dotted #303030;	
			}
			nav#menu a{
				padding: 9px 17px;
				font-size: 12px;
			    letter-spacing: 7.8px;
			}
			div#nav-toggle a {
			    display: inline !important;
			    padding: 0 !important;
			    margin: 0;
			}
			div#nav-toggle a:hover {
			    background-color: rgba(255, 100, 31, 0);
			}

/* Autres caractéristiques du header */

	/* Menu langues et suppression de facebook */

			#langues {
				border-top: none;
				top: 20%;
			}
			#langues {
				line-height: 0.9em;
			}
			#langues ul {
				margin: none;
				font-size: 0.9em;
			}
			#langues ul li a {
				margin: 0 5px;
			}
			#langues ul li a::after{
				content: " | ";
			}
			#langues ul li a img {
				display: none;
			}
			#langues{
			    display: block;
		    	background-color: rgba(0,0,0,0.4);
				position: initial;
				top: 0;
				height: 25px;
				width: 100%;
				line-height: 20px;
				padding-top: 5px;
			}
			#langues  ul {
				font-size: 0.9em;
				margin: 0;
				text-align: center;
			}
			
			#langues ul li {
				display: inline-block;
				position: initial;
			}

			#social-media {
			    display: inline-block;
			    width: 100%;
			    position: absolute;
			    top: 110px;
			    text-align: center;
				border-top: none;
				/* top: 20%; */
			}
			#social-media img {
			    float: none;
			    width: 29px;
			    display: inline-block;
			}

	/* Date de l'événement */

		header #date {
			font-size: 0.7em;
			letter-spacing: 5px;
		/*	padding-top: 10px; */
			margin-left: 10%;
			margin-right: 10%;
		}


/* Corps de texte */

	/* Lettrines */

			section #lettrine{
				display: none;
			}
			section h2:first-letter{
				font-family: 'ChopinScript', Georgia, cursive;
				line-height: 40px;
				font-size: 100px;
				color: #ff1e00;
		 		margin-left: 5px;
		 		font-weight: normal;
		 		font-style: normal;
		 		text-transform: lowercase;
		 		z-index: 100;
			}

	/* Titre principal */

		h2:first-letter{
	    	color: #ff1e00 !important;
		}

		h2{
			text-align: center;
			margin-top: 20px;
			padding-top: 30px !important;
		}

	/* Page réservations principale */

		ul#choix-reservations li a{
			letter-spacing: 3px;
			font-size: 12px;
		}

	/* Encart .connexion */

		div.central {
		    padding: 0 !important;
		}
		.noir {
		    background-color: rgba(0,0,0,0.6);
		}
		.connexion{
			border: none;
			margin-top: 0;
		}
		.central.noir>div.connexion {
		    padding: 20px !important;
		    margin: 0;
		}
	    p.active + .connexion, .connexion .connexion + .connexion, #dem-motpasse .connexion .connexion {
	    	padding: 22px 0 !important;
	    }

/* Pied de page */ 

	footer {
	    padding: 20px;
	}
	footer a {
		font-size: 10px;
	    font-weight: 500;
	}
	footer nav {
		text-align: center;
	}
	footer nav ul li a {
		display: block;
		border: none !important;
		color: white;
		padding: 5px;
	}


}


@media all and (min-width : 960px) and (max-width : 1023px) {
	nav#menu a {
	    padding: 14px 12px;
	}
	div.connexion {
	    padding: 20px 56px !important;
	}
}

@media all and (min-width : 1280px) and (max-width : 1365px) and (orientation:landscape) {
	.central.noir>div.connexion {
	    padding: 48px 156px;
	}
}