#header {
		display: -moz-flex;
		display: -webkit-flex;
		display: -ms-flex;
		display: flex;
		-moz-flex-direction: column;
		-webkit-flex-direction: column;
		-ms-flex-direction: column;
		flex-direction: column;
		-moz-align-items: -moz-flex-end;
		-webkit-align-items: -webkit-flex-end;
		-ms-align-items: -ms-flex-end;
		align-items: flex-end;
		-moz-justify-content: space-between;
		-webkit-justify-content: space-between;
		-ms-justify-content: space-between;
		justify-content: space-between;
		background-color: #ffffff; /* couleur du fond ou mettre une image */
		background-attachment: scroll,								scroll;
		background-position: top left,							top left;
		background-repeat: repeat,								no-repeat;
		background-size: auto,								100%;
		color: rgba(255, 255, 255, 0.5);
		height: 100%;
		left: 0;
		padding: 3em 3em;
		position: fixed;
		text-align: center; /*right;*/
		top: 0;
		width: 20%;
	}

	#main {
		margin-left: 20%;
		max-width: 54em;
		padding: 4em 2em 4em 2em;
		width: 80%;
	}

	#barrevert
{
  display: -moz-flex;
    display: -webkit-flex;
    display: -ms-flex;
    display: flex;
    -moz-flex-direction: column;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    -moz-align-items: -moz-flex-end;
    -webkit-align-items: -webkit-flex-end;
    -ms-align-items: -ms-flex-end;
    align-items: flex-end;
    -moz-justify-content: space-between;
    -webkit-justify-content: space-between;
    -ms-justify-content: space-between;
    justify-content: space-between;

    height:100%;
    background-position: top left;
    background-size:contain;
    background-color: #ffffff;
    background-image: url('../../images/site/gilets-verticaux.png');
  background-repeat: repeat-y;
    z-index: 1000;
    position: fixed;
    margin-left:18%;
    width: 30px;