/* www.volumic.be */
/*
	couleurs:
	gris de fond : #e4e4e4;
*/

/*cursor*/

.CursorHand{
	cursor: url(css_vertscroll.cur),url("http://www.volumic.be/demo/css/css_vertscroll.cur"),default;
}

/* -- Text color --*/
.TxtColorBlack{
	color:black;
}

/* -- Text align --*/
.TxtAlignLeft{
	text-align:left;
}

.TxtAlignRight{
	text-align:right;
}

.TxtAlignCenter{
	text-align:center;
}

/* -- background-color --*/
.BGColorBlack{
	background-color: black;	
}
.BGColorGreyLight{
	background-color: #CCC;	
}
.BGColorGreyMiddle{
	background-color: #e4e4e4;	
}
.BGColorGreyDark{
	background-color: #ADADAD;	
}
/* -- Border --*/
.borderBlack{
	border:solid black 1px;
}

.borderTopBlack{
	border-top:solid black 1px;
}
.borderBottomBlack{
	border-bottom:solid black 1px;
}

.borderLeftBlack{
	border-left:solid black 1px;
}

.borderRightBlack{
	border-right:solid black 1px;
}

/*-- Padding --*/

.padding10{
	padding:10%;	
}

/*-- height --*/
.height55{
	height:55%;	
}


.height100{
	height:100%;	
}

.selected{
	font-weight: bold;
}

.floatLeft
{
	float:left;	
}

.floatRight
{
	float:right;	
}

.clear{
	margin:0;
	padding:0;
	clear: both;
	height:0px;
	line-height:0px;
	font-size:0px;
}

.fix{
	border:1px dotted red;
}


/*-- all  -----------------------------------------------------------------------------------------------------------------*/


*{
	
	margin:0;
	padding:0;
	font-size: 1em;
	font-family:verdena,arial;
}

html{
	background-color: #e7e7e7;
	/*	background-color: #e4e4e4;	*/
}

body{
	background-color: #e4e4e4;
	color: black;
}


p{
	margin:0;
	padding:0;
}

a{
	color:white;
	text-decoration:none;
}
a:hover{
	color:white;
	text-decoration:underline;
}

ul{
	padding-left:15%;
}

li{
	margin-left:0%;
}

img{
	float:left; /* corrige aussi le probleme de pixel en dessous d'image*/
	border:none;
}

table{
	border-collapse:collapse;
	width:100%;
        
}

.content{
    position:absolute;/* En étant en absolut, ceci devient la référence de dimension des enfants.*/

	margin:0px;
	border: 0px dotted black;
	padding:0px;

        /* Ces valeurs de dimension seront changées par javascript si celui-ci est activé*/
        /* Sinon elles resteront fixes.*/
        width: 1000px;
        height: 670px;	
}
li,.titleBarText{
    font-size: .9em;    
}






/* -- Intro  -----------------------------------------------------------------------------------------------------------------*/

#intro{
	padding: 30%;
	padding-top: 15%;
	height:48%;
}



/* Menu -----------------------------------------------------------------------------------------------------------------*/
.menuColumn{
	position:relative;
	background-color: #e4e4e4;/*#a63204;*/
	width:19%;
	height:100%;
	float:left;
}

.logoRow{

	background-color: #e4e4e4;/*green;*/
	border: 0px dotted white;
	width: 100%;
	height: 15.5%;
	float: left;
}

.menu{
	margin-top:7%;
}

.menu a{
        color:#555;
	text-decoration:none;
        
}
.menu a:hover{
        color:black;
	text-decoration:underline;
}

ul.menu{
	list-style-type:none;	
	border-left: 1px solid black;
	margin-left: 9px;
    padding-left: 14px;
}
ul.projets{
	list-style-type:square;
	list-style-position:inside;
	padding-left:0%;
}

.SpacingMenu_01{
	font-size:10px;
	height:23px;
}

.SpacingMenu_02{
	font-size:10px;
	height:56px;
}

.carteVisiteImg
{
    bottom: 17px;
    padding-left: 10px;
    position: absolute;
    width: 110%;
}

/* Project -----------------------------------------------------------------------------------------------------------------*/
.projectColumn{
	background-color: #e4e4e4;/*#4682b4;*/
	width:48%;
	height:100%;
	float:left;
}

.titleBarProjet{
	width:100%;
	height: 12%;
        background-color: #000;
}

.margeRowProject{
	background-color: #e4e4e4;
	border: 0px dotted white;
	width: 100%;
	height: 11%;
	float: left;
}
.titleBarProjet p{
        text-align: right;
        margin:0 2%;
}

.projectImg{
	border: 0px solid black;
	border-bottom-style: none;
	overflow:hidden;
}

.projectImage{
	height:65.5%;
	background-color:#AAA;
}

.descriptionImg{
        height:28.1%;
       	border-right: 1px solid black;
		border-bottom: 1px solid black;
		border-left: 1px solid black;		 
}

.titleBarDescription{
	width:100%;
	height: 12%;
	color:white;
    background-color: #000;
}

.tabledescription{
        height:88%;
       	overflow:auto;
        border: 0px solid black;
        border-top-style: none;
		padding-bottom: 0px;
}

.tabledescription p {

        margin:2%;
        font-size: 1em;
}

.tabledescription a{
	color:black;
	font-weight:bold;
	text-decoration:underline;	
}
.tabledescription a:hover{
	color: #333;
	font-weight:bold;

}
/* présentation -----------------------------------------------------------------------------------------------------------------*/
.presentationColumn{
	background-color: #e4e4e4;/*#4682b4;*/
	width:74%;
	height:100%;
	float:left;
}

.presentationTopName{

	float:left;
}

.presentationBackground{
	background-color: #adadad;/*#4682b4;*/
	width:96%;
	height: 89.2%;
	float:left;
	border: 2px solid white;
}

#contactContent{	
	position:relative;
	margin-top:-10%; 
	margin-left:5%;
	margin-right:5%; 
	padding:2%;"
	

}

#presentationContent{
	position:relative; 
	margin-left:15%;
	margin-right:14.5%; 
	height : 50%;
	/**/
	background-color: #e4e4e4;
	border:solid black 1px;
}

#presentationTitre{
	height:10%; 
	overflow: hidden;
}

#presentationText{
	height:100%; 
	overflow: auto;
	text-align:justify;
	padding-right: 1%;
	padding-left:4%;
	padding-right:4%;
}

#LayoutBlackColumn{
	height:55%;
	background-color: black;	
}

/* login page -----------------------------------------------------------------------------------------------------------------*/

.loginColumn{
	background-color: #e4e4e4;/*#4682b4;*/
	width:50%;
	height:100%;
	float:left;
}

.title{
	background-color:#333;
	color:white;
	padding:2%;
}

/* //-- Liste des fichiers -----------------------------------------------------------------------------------------------------------------*/


.tablelist{
	border-collapse:collapse;
}

.tablelist tr.TableListHeader{

	font-weight:bold;
}

.tablelist td{
	border: 1px solid black;
	padding:5px;
}

.colName{
	text-align:right;
}

/* multi -----------------------------------------------------------------------------------------------------------------*/
.margeColumn{
	background-color: #e4e4e4;/*#f68204;*/
	width:3%;
	height:100%;
	float:left;
}

.margeRow{
	background-color: #e4e4e4;/*blue;*/
	border: 0px dotted white;
	width: 100%;
	height: 3%; /*12.3*/
	float: left;
}

.titleBarText{
	color:white;
	margin : 0 2%;
	padding: 3px 0;        
}




/* Gallery -----------------------------------------------------------------------------------------------------------------*/
.galleryColumn{
	
	float:left;

	width:26%;
	height:100%;

	background-color: #e4e4e4;/*4682b4;*/	
}


.spaceScroll
{
	width:8%;
	float:left;
	clear:both;
}

.spaceContent
{
	width:92%;
	float:left;	
	background-color: #333;	
}

.titleBarGallery{
	color:white;
	background-color: #000;
}

.galleryImg{
	/*font-size: 1em;  supprime les pixels en bas des images: mettre à 0. !! pas de texte ici alors !? chercher une autre solution!*/
	/*  corrige le probleme ! mais d'autres peuvent apparaitres je suppose?
	img{
		float:left;
	}	
	*/
	border: 1px solid black;
}


#gallery{   
    width : 100%;
    height : 300px;
}

#gallery .joxscrollbar{
    height:66.66%;
    float:left;
    background-color: #aaaaaa;
    border-left: 0px solid black;
    border-top: 0px solid black;
    border-bottom: 0px solid black;
	overflow:hidden;
}

#gallery .joxscrollHandle{
    width:100%;
    height:4%;
    background-color: black;
}

#arrowup{

}

#gallery .joxcontent{
    position:relative;
    height:100%;
    float:left;
    border: 0px solid black;
    overflow: hidden;
}

#gallery .joxcontentitems{
    width:100%;	
	
}

#gallery .joxitem{
    width:33.33%;
	float:left;
}


a.thumb{
	border: 1px solid black;
	border-width:1px;
	display:block;
}

a.thumbSelected{
	border: 1px solid black;
	border-width:1px;
	display:block;
}

a.thumbYear{
	border: 1px solid black;
	border-width:1px;
	display:block;
}

a:hover.thumb {
	border: 1px solid white;
	border-width:1px;
	display:block;
}

#gallery .joxitem img{
	
}




/*-------------------------------------*/
/* UserText */
.UserText ol,  .UserText ul{
	padding:0;
	list-style-position:inside;	
}

#FullScreen{
	float:right;	
	font-weight:bold;
	padding-right: 4.5%;
	Color: #AAA;
}

#FullScreen a{
	Color: #AAA;
}
#FullScreen a:hover{	
	Color:black;
}