body {
			margin:0; padding:10px 40px; 
			background:#F1EFE2;
			font-size: 1.4em;
			font-family: georgia, "trebuchet ms", arial, serif;
			height: 1000px; /* test fixed + scroll */
		}
		h1 {
			margin-top: 20px; margin-bottom: 40px;
			color: #345;
			text-shadow: 1px 1px 1px #fff;
		}
		h2 {
			color: #678;
			text-shadow: 1px 1px 1px #fff; 
			font-size:1.1em
		}

		/* code du tutoriel ci-dessous */

		#volet {
			width: 250px;
			padding: 10px;
			background: #6B9A49; color: orange;	
		}
		
		#volet a.ouvrir,
		#volet a.fermer {
			padding: 10px 25px;
			background: red;
			color: orange;
			text-decoration: none;
		}

		#volet {
			position: absolute;
			left: -270px;  /* test fixed + scroll, on retire la position top */
			-webkit-transition: all .5s ease-in;
			-moz-transition: all .5s ease-in;
			transition: all .5s ease-in;
		}
		#volet a.ouvrir,
		#volet a.fermer {
			position: absolute;
			right: -150px;                   /* fermeture */
			top: 90px;                      /* hauteur */
			-webkit-transform: rotate(270deg);
			-moz-transform: rotate(270deg);
			-o-transform: rotate(270deg);
			-ms-transform: rotate(270deg);
			-moz-radius: 0 0 8px 8px;
			border-radius: 0 0 8px 8px;
		}
		#volet a.fermer {
			display: none;
		}
		#volet:target {
			left: 10px;
		}

		/* code pour la fermeture */

		#volet:target a.fermer {
			display: block;
		}
		#volet:target a.ouvrir {
			display: none;
		}
		#volet_clos:target #volet {
			left: -250px;                  /* volet cache */
		}
		
		 /* test */
		#volet_clos {
			position: fixed; 
			top: 245px; left: 0;
		}