Image de body background full responsive :

@charset "utf-8";

html {
	overflow: scroll;
}
html, body {
	height: 100 %;
}

body {
	margin: 0 auto;
	width: 100%;
	max-width: 100%;
	/*height: 828px;*/
	height: 100%;
	min-height: 100%;
	background-image: url(/images/fonds/fond-flou-lumineux.jpg);
	background-position: center center;
	background-repeat: no-repeat;
	background-attachment: fixed;
	background-color: #FFF;
	background-size: cover;
	position: relative;
	overflow: scroll;
}
table#table-liens-sociaux,
table#table-titre,
table#table-menu,
table#table-fin {
    width: 100%; 
    margin-left: auto; 
    margin-right: auto;
	border-spacing: 0px;
}
/*
th { 
 border-width:1px;
 border-style:solid; 
 border-color:red;
}
td { 
 border-width:1px;
 border-style:solid; 
 border-color:red;
}
*/
a:link,
a:visited,
a:hover
a:active {
	text-decoration: none;
}
@font-face {
    font-family: 'GeosansLight';
	src: url('GeosansLight.ttf') format('truetype');
}


/*----------Portrait ouverture--------*/
#portrait-container {
	position: fixed;
	height: auto;
	margin: 25px 0px 0px 20px;
	z-index: 110;
}
img.portrait {
	height: auto;
	width: 50px;
	border-radius: 50%;
}



/*----------Liens sociaux----------*/

.sociaux {
	text-align: center;
	letter-spacing: 20px;
	padding: 20px;
}
.sociaux a {
	display: inline-block;
	-moz-transition: all 0.4s ease-out;
	-webkit-transition: all 0.4s ease-out;
	transition: all 0.4s ease-out;
}
.sociaux a:hover,
.sociaux a:focus {
	transform: scale(1.5);
}
.you,
.sound,
.mail,
.twi,
.face {
	opacity:0.3;
}
.you:hover,
.sound:hover,
.mail:hover,
.twi:hover,
.face:hover,
.you:focus,
.sound:focus,
.mail:focus,
.twi:focus,
.face:focus {
	-moz-transition: opacity 0.4s ease-in-out;
	-webkit-transition: opacity 0.4s ease-out;
	transition: opacity 0.4s;
	opacity: 1;
}





/*----------Titre de la page----------*/

#titre {
	color: #666;
	letter-spacing: 7px;
	text-shadow: 4px 10px 12px rgba(0,0,0,0.7);
	padding: 80px 0px 0px 0px;
	font-family: 'GeosansLight', Verdana, Geneva, sans-serif;
	font-size:  60px;
	font-weight: lighter;
	line-height: 20px;
	width: 600px;
	text-align: center;
	margin-left: auto;
	margin-right: auto;
}
#titre a:link,
#titre a:visited,
#titre a:active {
	color:  #666;
}
#titre a:hover {
	color: #fff;
	-webkit-transition-duration: 0.4s; /* Safari */
    transition-duration: 0.4s;
}

.initiale {
	font-size: 1.5em;
	margin-right: -5px;
	margin-left: 0px;
}

.auteur {
	color: #666;
	text-align: center;
	letter-spacing: 15px;
	text-shadow: 2px 5px 6px rgba(0,0,0,0.7);
	padding: 0px 0px 50px 10px;
	font-family: 'GeosansLight', Verdana, Geneva, sans-serif;
	font-size:  28px;
	font-weight: lighter;
	line-height: 0px
}





/*----------Rubriques du menu----------*/


#container-livres {
	padding-top: 30px;
	text-align: center;
}

#livres-menu {
	letter-spacing: 20px;
	padding: 10px;
	display: inline-block;	
}
#livres-menu a {
	display: inline-block;
	-moz-transition: all 0.2s ease-out;
	-webkit-transition: all 0.2s ease-out;
	transition: all 0.2s ease-out;
}
#livres-menu a:hover,
#livres-menu a:focus {
	transform: scale(1.15);
}
/*
.menu-1,
.menu-2,
.menu-3,
.menu-4,
.menu-5,
.menu-6 {
	opacity:0.6;
}
.menu-1:hover,
.menu-2:hover,
.menu-3:hover,
.menu-4:hover,
.menu-5:hover,
.menu-6:hover,
.menu-1:focus,
.menu-2:focus,
.menu-3:focus,
.menu-4:focus,
.menu-5:focus,
.menu-6:focus {
	-moz-transition: all 0.4s ease-in-out;
	-webkit-transition: all 0.4s ease-out;
	transition: all 0.4s;
	opacity: 1;
}
*/





/*----------fin----------*/

.fin {
	height: 100px;
	margin: 0px auto;
	color: #666;
	text-align: center;
	letter-spacing: 5px;
	text-shadow: 2px 5px 6px rgba(0,0,0,0.7);
	padding: 0px 0px 30px 0px;
	font-family: 'GeosansLight', Verdana, Geneva, sans-serif;
	font-size:  14px;
	font-weight: lighter;
	vertical-align: bottom;
	line-height: 0px
}




@media only screen
	and (max-width : 480px)
	and (orientation : portrait) {
	/*Smartphone Galaxy S4 mini (portrait)*/

body {
	height: 828px;
}

table#table-liens-sociaux,
table#table-titre,
table#table-menu,
table#table-fin {
    width: 100%; 
	border-spacing: 0px;
}

/*----------Portrait ouverture--------*/
#portrait-container {
	position: absolute;
	height: auto;
	margin: 5px 0px 0px 15px;
	z-index: 110;
}
img.portrait {
	height: auto;
	width: 40px;
	border-radius: 50%;
}


.sociaux {
	letter-spacing: 0px;
	padding: 0px;
}
.sociaux img {
	width: 42px;
	height: auto;
}

#titre {
	letter-spacing: 0px;
	padding: 0px 0px 0px 0px;
	font-size:  40px;
	line-height: 20px;
	width: 300px;
}

#titre a:hover {
	color: #666;
}

.initiale {
	margin-right: 0px;
}

.auteur {
	letter-spacing: 5px;
	padding: 0px 0px 50px 10px;
	font-size:  20px;
	line-height: 0px
}

#livres-menu {
	letter-spacing: 20px;
	padding: 10px;
}

.menu-1,
.menu-2,
.menu-3,
.menu-4,
.menu-5,
.menu-6 {
	opacity: 1;
}

.fin {
	letter-spacing: 0px;
}
}


@media only screen
	and (max-width : 800px)
	and (orientation : landscape) {
	/*Smartphone Galaxy S4 mini (paysage)*/
body {
	/*height: 828px;*/
	height: 360px;
}

table#table-liens-sociaux,
table#table-titre,
table#table-menu,
table#table-fin {
    width: 100%; 
	border-spacing: 0px;
}

		/*----------Portrait ouverture--------*/
#portrait-container {
	position: fixed;
	height: auto;
	margin: 20px 0px 0px 30px;
	z-index: 110;
}
img.portrait {
	height: auto;
	width: 50px;
	border-radius: 50%;
}

.sociaux {
	letter-spacing: 20px;
	padding: 20px;
}

#titre {
	letter-spacing: 7px;
	padding: 0px 0px 0px 0px;
	font-size:  48px;
	line-height: 20px;
	width: 600px;
}

#titre a:hover {
	color: #666;
}

.auteur {
	letter-spacing: 10px;
	padding: 0px 0px 50px 10px;
	font-size:  28px;
	line-height: 0px
}

#livres-menu {
	letter-spacing: 20px;
	padding: 10px;
}

.menu-1,
.menu-2,
.menu-3,
.menu-4,
.menu-5,
.menu-6 {
	opacity: 1;
}
}


@media only screen
	and (min-width : 480px)
	and (max-width : 800px)
	and (orientation : portrait) {
	/*Tablette Surface RT (Portrait)*/

table#table-liens-sociaux,
table#table-titre,
table#table-menu,
table#table-fin {
    width: 100%; 
	border-spacing: 0px;
}

/*----------Portrait ouverture--------*/
#portrait-container {
	position: fixed;
	height: auto;
	margin: 20px 0px 0px 30px;
	z-index: 110;
}
img.portrait {
	height: auto;
	width: 50px;
	border-radius: 50%;
}


.sociaux {
	letter-spacing: 20px;
	padding: 20px;
}

#titre {
	letter-spacing: 7px;
	padding: 40px 0px 0px 0px;
	font-size:  46px;
	line-height: 20px;
	width: 600px;
}

.auteur {
	letter-spacing: 10px;
	padding: 0px 0px 50px 10px;
	font-size:  24px;
	line-height: 0px
}

#livres-menu {
	letter-spacing: 20px;
	padding: 10px;
}

.menu-1,
.menu-2,
.menu-3,
.menu-4,
.menu-5,
.menu-6 {
	opacity: 1;
}
}


@media only screen
	and (min-width : 800px)
	and (max-width : 1200px) {
	/*Tablette Surface RT (paysage)*/
	/*écrans jusqu'à 1200px de large*/

table#table-liens-sociaux,
table#table-titre,
table#table-menu,
table#table-fin {
    width: 100%; 
	border-spacing: 0px;
}

/*----------Portrait ouverture--------*/
#portrait-container {
	position: fixed;
	height: auto;
	margin: 20px 0px 0px 30px;
	z-index: 110;
}
img.portrait {
	height: auto;
	width: 60px;
	border-radius: 50%;
}


.sociaux {
	letter-spacing: 20px;
	padding: 20px;
}

#titre {
	letter-spacing: 7px;
	padding: 40px 0px 0px 0px;
	font-size:  54px;
	line-height: 20px;
	width: 600px;
}

.auteur {
	letter-spacing: 12px;
	padding: 0px 0px 50px 10px;
	font-size:  26px;
	line-height: 0px
}

#livres-menu {
	letter-spacing: 20px;
	padding: 10px;
}

.menu-1,
.menu-2,
.menu-3,
.menu-4,
.menu-5,
.menu-6 {
	opacity: 1;
}
}


@media only screen
	and (min-width : 1200px)
	and (max-width : 1600px) {
	/*écrans jusquà 1600 px de large*/

table#table-liens-sociaux,
table#table-titre,
table#table-menu,
table#table-fin {
    width: 100%; 
	border-spacing: 0px;
}

		/*----------Portrait ouverture--------*/
#portrait-container {
	position: fixed;
	height: auto;
	margin: 20px 0px 0px 50px;
	z-index: 110;
}
img.portrait {
	height: auto;
	width: 60px;
	border-radius: 50%;
}


.sociaux {
	letter-spacing: 20px;
	padding: 20px;
}

#titre {
	letter-spacing: 7px;
	padding: 80px 0px 0px 0px;
	font-size:  60px;
	font-weight: lighter;
	line-height: 20px;
	width: 600px;
}

.auteur {
	letter-spacing: 15px;
	padding: 0px 0px 50px 10px;
	font-size:  28px;
	line-height: 0px
}

#livres-menu {
	letter-spacing: 20px;
	padding: 10px;
}
}


@media only screen
	and (min-width : 1600px) {
	/*écrans d'une largeur supérieure à 1600 px*/

table#table-liens-sociaux,
table#table-titre,
table#table-menu,
table#table-fin {
    width: 100%; 
	border-spacing: 0px;
}

		/*----------Portrait ouverture--------*/
#portrait-container {
	position: fixed;
	height: auto;
	margin: 20px 0px 0px 50px;
	z-index: 110;
}
img.portrait {
	height: auto;
	width: 60px;
	border-radius: 50%;
}


.sociaux {
	letter-spacing: 20px;
	padding: 20px;
}

#titre {
	letter-spacing: 7px;
	padding: 80px 0px 0px 0px;
	font-size:  60px;
	line-height: 20px;
	width: 600px;
}

.auteur {
	letter-spacing: 15px;
	padding: 0px 0px 50px 10px;
	font-size:  28px;
	line-height: 0px
}

#container-livres {
	padding-top: 60px;
}

#livres-menu {
	letter-spacing: 20px;
	padding: 10px;
}
}


