@charset "UTF-8";
	@font-face {
		font-family: myFirstFont;
		src: url(LuloCleanOneBold.otf);
	}
	@font-face {
		font-family: "parisienne";
		src: url("https://lesjardinsdelarcheveche-albi.fr/css/parisienne.regular.ttf");
	}
	@font-face {
		font-family: "damion";
		src: url("https://lesjardinsdelarcheveche-albi.fr/css/Damion-Regular.ttf");
	}

/*
	@viewport {
		orientation: portrait;
	}
*/
	
/*
	@media (orientation: portrait) {
		body {
			flex-direction: row;
  		}
	}
*/

	@media screen and (orientation: landscape) {
		#infoPlusBas {
			width: 100%;
			height: 60px;position:fixed; background-color: #fcfcf4;
			margin: 0 auto;
			z-index: 10000000000000;
			bottom: 0;
 		}
 	}
	
	html {
		width: 100%;
		height: 100%;
		/* background-color: #c4a494; */
		background-color: #f0debf;
		margin: 0;
		padding: 0;
	}
	body {
		width: 100%;
		height: 100%;
		/* background-color: #c4a494; */
		background-color: #f0debf;
		margin: 0;
		padding: 0;
	}
	header {
		width: 100%;
		height: 92px;
		/* background-color: #ac5454; */
		/* background-color: #c33277; */
		background-color: #f0debf;
/* 		padding: 10px; */
	}
	header div {
/* 		padding: 10px; */
	}

	header img {
		width: 180px;
		height: auto;
/* 		margin: 1px 0 0 1px; */
		padding: 20px 0 0 15px;
		
	}
	.circle {
		height: 180px;
		width: 180px;
		/* background-color: #fff;
		border-radius: 50%;
		padding: 1px 0 0 -1px; */
	}
	div p a {
		 color: white;
	}
/*
	#siteweb_produit a:hover {
		background-color: #ac5454;
	}
*/

	.firstDiv {
		margin-top: -40px;
		padding: 30px 0 90px 0!important;
	}
	
	.firstDiv {
		font-family: "helvetica";
		color: white;
		font-size: 18px;
		padding: 0 20px 0 20px;
	}
	
	.firstDiv_list {
/* 		margin-top: 30px; */
		padding: 60px 0 80px 0!important;
	}
	h1 {
		padding: 0 20px 0 20px;
		font-family: myFirstFont;
		color: white;
		font-size: 14px;
	}
	
	section p {
		font-family: myFirstFont;
		color: #847A6E;
		font-size: 14px;
	}
	
	h2 {
		padding: 0 20px 0 20px;
		font-family: myFirstFont;
		color: white;
		font-size: 14px;
	}
	h2 span {
		font-family: myFirstFont;
		color: white;
		font-size: 14px;
		font-weight: 1000;
	}
	
	h3 {
		padding: 0 20px 0 20px;
		font-family: damion;
		color: #847A6E;
		font-size: 14px;
		text-transform: none!important;
	}
	.adresse {
		padding: 0 20px 0 20px;
		font-family: myFirstFont;
		color: #847A6E;
		font-size: 10px;
		text-transform: none!important;
		text-align: center;
	}

	p {
		font-family: "helvetica";
		color: white;
		font-size: 18px;
		padding: 0 20px 0 20px;
	}
	img {
		max-width: 100%;
		height: auto;

	}
	.firstDiv img {
		margin: 5px 0 10px 0;
		border-bottom : 2px solid white;
		border-top    : 2px solid white;
	}
	video {
		max-width: 100%;
		height: auto;
		margin: 5px 0 10px 0;
		border-bottom : 2px solid white;
		border-top    : 2px solid white;
	}
	
	.item {
		padding: 0 20px 0 20px;
		font-family: "arial";
		font-size: 25px;
		font-weight: bold;
		color: white;
	}

	
	ul, li {
		list-style-type: none;		
	}
	
	ul li {
		padding: 15px;
		margin: -1px 20px -1px 20px;
		border: 1px solid #ffffff;
		font-size: 20px;
		color: white;
		font-family: "arial";
	}
	
/*
	ul li:first-child {
		border-radius: 10px 10px 0 0;
	}
	ul li:last-child {
		border-radius: 0 0 10px 10px;
	}	
*/
	.first_child {
		border-radius: 10px 10px 0 0;
	}
	.last_child {
		border-radius: 0 0 10px 10px;
	}
	.corner_li {
		border-radius: 10px;
	}
	
	ul li:hover, ul li:active {
		background-color: #ac5454;
	}

	
		a {
			text-decoration: none;
		}

		.site-crossnav {
			clear: both;
			margin: 34px 20px 130px 20px;
			padding: 24px 12px 18px 12px;
			background-color: rgba(255, 255, 255, .2);
			border-top: 10px solid #F2A2A2;
			border-bottom: 1px solid rgba(132, 122, 110, .28);
		}

		.site-crossnav h2 {
			margin: 0;
			padding: 0;
			font-family: myFirstFont, Arial, Helvetica, sans-serif;
			font-size: 14px;
			line-height: 1.55;
			text-align: center;
			text-transform: uppercase;
			color: #847A6E;
		}

		.site-crossnav nav {
			display: grid;
			grid-template-columns: 1fr 1fr;
			gap: 10px;
			margin-top: 42px;
		}

		.site-crossnav a {
			display: flex;
			min-height: 96px;
			align-items: center;
			justify-content: center;
			flex-direction: column;
			padding: 10px 8px;
			background-color: #f7ecd8;
			border: 1px solid rgba(132, 122, 110, .28);
		}

		.site-crossnav img {
			display: block;
			width: 50px;
			height: auto;
			margin: 0 auto;
			border: 0!important;
		}

		.site-crossnav span {
			display: block;
			margin-top: 12px;
			padding: 0;
			font-family: myFirstFont, Arial, Helvetica, sans-serif;
			font-size: 10px!important;
			line-height: 1.35;
			text-align: center;
			text-transform: uppercase;
			color: #847A6E!important;
		}

		.site-crossnav a[aria-current="page"] {
			background-color: #847A6E;
			border-color: #847A6E;
		}

		.site-crossnav a[aria-current="page"] span {
			color: #f0debf!important;
		}

		ul, menu, dir {
			display: block;
		list-style-type: none;
		margin-block-start: 1em;
		margin-block-end: 1em;
		padding-inline-start: 0px;
	}
	ul li span {
		float: right;
	}

/* ICI C'EST LES FLECHE DE NAVIGATION EN HAUT ET EN BAS */

/* CLASS DES FLECHES DU HAUT */
/*
	.navigationFleche {
		width: 100%;
		height: 70px;
		margin: 0 auto;
	}
*/

	header #RETOUR {
		width: auto;
		height: 92px;
		float: left;
		padding: 20px 0 20px 20px;
		display: block;
	}

	header #RETOUR img {
		width: 40px;
		height: auto;
		padding: 10px 0 0 0;
	}
	
	
/* OUVERTURE */
	
	.ouverture {
		margin-top: 100px;
		margin-bottom: 60px;
	}
	
	.ferme {
		font-size: 20px;
		text-transform: none!important;
		color: #ac5454!important;
	}
	
	.ouvert {
		font-size: 20px;
		text-transform: none!important;
		color: #0e8e01!important;
	}
	
	.midisoir {
		padding-right: 20px;
		font-size: 20px;
		text-transform: none!important;
		color: #847A6E!important;
	}
	

/* CLASS DES FLECHES DU BAS */
	.navigationFleche {
		width: 100%;
		height: 70px;
		margin: 0 auto;
		display: inline-flex;
	}
	
	
		.navigationFleche nav.navFleche {
			width: 100%;
			height: 70px;
			position: block;
			margin: 0 auto;
			z-index: 10000000000000;
			bottom: 0;
	}

	.navigationFleche a.first {
		float: left;
		display: block;
		text-align: center;
		padding: 10px 20px;
		text-decoration: none;
	}
	
	.navigationFleche a.last {
		float: right;
		display: block;
		text-align: center;
		padding: 10px 20px;
		text-decoration: none;
	}
	
	.navigationFleche a.center {
		display: block
		text-align: center;
		margin: auto;
		padding: 10px 20px;
		text-decoration: none;
	}
	
	.navigationFleche a img {
		width: 40px;
		height: 40px;
		border-bottom : 0px!important;
		border-top    : 0px!important;
	}
	
	.navigationFleche a img.svgRotate {
		transform: rotate(180deg);
	}

/* FOOTER */

	
	footer {
		width: 100%;
		margin: 0 auto;
	}
	nav.footernav {
		width: 100%;
		height: 70px;position:fixed; background-color: #f0debf;
		margin: 0 auto;
		z-index: 10000000000000;
		bottom: 0;
		border-top: 10px solid #F2A2A2;
	}
	
	footer nav a img {
		width: 40px;
		height: 40px;
	}
	footer nav a img.svgRotate {
		transform: rotate(180deg);
	}


	
	footer nav a.first {

		float: left;
		display: block;
		text-align: center;
		padding: 10px 20px;
		text-decoration: none;
	}
	footer nav a.last {

		float: right;
		display: block;
		text-align: center;
		padding: 10px 20px;
		text-decoration: none;
	}
	

/* 	CSS QRCODE  */

	.Conteneur span {
		color: white;
		text-transform : uppercase;
		font-family: Arial, Helvetica, sans-serif;
	}

	.bordernav {
		margin-top: 40px;
	}
	
	#infoPlusBas {
		width: auto;
		height: 1000px;
	}
/*
	.circle {
		height: 70px;
		width: 70px;
		background-color: #fff;
		border-radius: 50%;
	}
	.circle img {
		width: 68px;
		height: auto;
		margin: 1px 0 0 1px;
	}
*/

				.Conteneur span {
					color: white;
					text-transform : uppercase;
					font-family: Arial, Helvetica, sans-serif;
				}
				.span_traduction {
					font-size: 11px!important;
				}
				
				#conteneur_info_app {
					width: 100%;
					height: 200px;
					display: block;
					border-bottom: white 1px solid;
				}
				
				#conteneur_info_app p {
					padding: 0px 0 0 0;
					color: white;
					text-transform : uppercase;
					font-family: Arial, Helvetica, sans-serif;
				}
				
				#conteneur_info_app img {

					
					
				}
				
				.footernav span {
					font-size: 10px!important;
					color: #AF9588;
					text-transform : uppercase;
					font-family: Arial, Helvetica, sans-serif;
				}
				
				.footernav img {
					padding: 5px 0 0 0;
				}


	
	@media (min-width: 800px) {
		html {
			width: 100%;
			height: 100%;
			background-color: #f0debf;
			margin: 0;
			padding: 0;
		}
		body {
			width: 580px;
			height: 100%;
			background-color: #f0debf;
			margin: 0 auto;
			padding: 0;

		}
		nav.footernav {
/* 			width: 580px; */
			width: 580px;
			height: 60px;position:
			fixed; background-color: #f0debf;
			margin: 0 auto;
			z-index: 10000000000000;
			bottom: 0;
			padding-bottom: 15px;
		}
		


		
	}
/* 	ICI c'est la page SWITCH */