@charset "UTF-8";
/* CSS Document */

html, body {
 margin: 0;
 padding: 0;
 }
 
 body {
    background-color: ; 
    font-family: Arial; 
    font-size: 100%;
 }
	
 body.accueuil{
	 background: radial-gradient(circle at  right bottom, #171ab0 20%, white 80%);
	 margin: 0;
	 padding: 0;
	 background-size: cover;
	 background-attachment: fixed;
	 background-repeat:no-repeat;
 }
 div#table{
	 height:     auto;       /* These two lines were the key. */
    min-height: 100%
    /*overflow:   hidden;*/ /* Do not use this, it crops in small browsers. */
    margin:     0px auto;
    padding:    0px auto;
 }
 
div#sidebar {
	position: relative;
	float:left;
 	margin-top:10px;
 	margin-left:10px;
 	width:220px;
 	height:650px;
	overflow: hidden; 
	background-image:url(http://tristangac.com/wp-content/uploads/2017/03/sidebar-2.png);
	background-repeat: no-repeat;
	background-size: 100% 100%;
	
	
}

div#works {
	
	position: absolute;
	top: 85px;
	left: 10px;
	width:auto;
	height:auto;

}

div#bio {
	position: absolute;
	top: 165px;
	left: 80px;
	width:auto;
	height:auto;
	}
	
div#others {
	position: absolute;
	top:355px;
	left:10px;
	width:auto;
	height:auto;
	}
	

	

div#contentbio{
	position:absolute;
	float:right;
	height:100%;
	width: calc(100% - 240px);
	display:inline-block;
	margin-top:20px;
	margin-left:10px;
	overflow-y:auto;
	background-image:url(http://tristangac.com/wp-content/uploads/2017/03/tristanmod.png);
	background-size: 100% 100%;
	background-repeat: no-repeat;
	background-position:right ;
	font-family:"Times New Roman", Times, serif;
	color:white;
	text-shadow: 2px 2px 4px #000;
	font-size:18px
}
div#contentworks {
	position:absolute;
	float:right;
	height:100%;
	width: calc(100% - 240px);
	display:inline-block;
	margin-top:20px;
	margin-bottom:20px;
	margin-left:10px;
	padding-right:20px;
	overflow-x:scroll;
	overflow-y:hidden;
	font-family:"Times New Roman", Times, serif;
	color:white;
	font-size:18px;
	white-space: nowrap;
}

div#boutonworks1{
	float:right;
	height:auto;
	width: 50%;
	display:inline-block;
	margin-top:20px;
	margin-left:10px;
	overflow-y:auto;
	font-family:"Times New Roman", Times, serif;
	color:white;
	text-shadow: 2px 2px 4px #000;
	font-size:18px
}
div#boutonworks2{
	float:left;
	height:auto;
	width: 50%;
	display:inline-block;
	margin-top:20px;
	margin-left:10px;
	overflow-y:auto;
	font-family:"Times New Roman", Times, serif;
	color:white;
	text-shadow: 2px 2px 4px #000;
	font-size:18px
}
div#boutonworks3{
	float:left;
	height:auto;
	width: 80%;
	display:inline-block;
	margin-top:20px;
	margin-left:10px;
	overflow-y:auto;
	font-family:"Times New Roman", Times, serif;
	color:white;
	text-shadow: 2px 2px 4px #000;
	font-size:18px
}
div#boutonworks4{
	float:right;
	height:auto;
	width: 80%;
	display:inline-block;
	margin-top:20px;
	margin-left:10px;
	overflow-y:auto;
	font-family:"Times New Roman", Times, serif;
	color:white;
	text-shadow: 2px 2px 4px #000;
	font-size:18px;
	text-align:left;
}
div#txt{
	font-family:"Times New Roman", Times, serif;
	color:white;
	text-shadow: 2px 2px 4px #000;
	font-size:18px;
	position:absolute;
	position:absolute;
     bottom:0;
     right:0;
	 margin-bottom:15px;
	 margin-right:10px;
	
}
img.works {
    max-width: 100%;
    height: auto;
}
img.works2 {
	margin-bottom:20px;
	margin-left:20px;
    width: auto;
    height:95%;
	box-shadow: 6px 6px 8px #666 ;
	
	
}
navigation {
  width: 200px;
  list-style: none;
  margin: 0;
  padding: 0;
}