/* ------------------ */
	/*  T'aime Graphique  */
	/* -------------- */
	body {
		background-color: rgb(255,255,255);
		color: rgb(255,102,51);
		line-height: 20px;
		margin : 0;
		padding : 0;
	}
	/* 	 ------------------------------------------------------------------------------------------*/
	#viewport {
		position : absolute;
		width : 100%;
		height : 100%;
		margin : 0;
		padding : 0;
	}
	/* 	logo ------------------------------------------------------------------------------------------*/
	#logo-resonances {
		position:absolute;
		width : 100%;
		top : 0px;
		left : 0px;
		height : 150px;
	}
	#logo-resonances  #logo {
		position:relative; 
		width : 350px;
		height : 150px;
		margin : 0;
		padding : 0;
		top : -30px;
		margin-left : auto;
		margin-right : auto;
		background-image:url(../data/imgbank/logo2.png);
			background-position: left bottom; 
		z-index : 10;
		background-size: 100%; 
	}
	/* 	navigation ------------------------------------------------------------------------------------------*/
#navigation {
		position:fixed; 
		top: calc(100% - 35px);
		width: 100%;
		text-align: center;
		z-index : 21;
	}
	#navigation ul{ 	
		margin : 0;
		padding : 0;
		position:relative; 
		text-align: center;
	}
	#navigation li{		
		margin : 0;
		display : inline;
		background-color: rgb(255,102,51);
		border-radius : 5px;
		color : white;
		padding : 5px;
		border : solid 2px white;
		font-family : "FonteDemarche";
	}
	#navigation li:hover {
		background-color: rgb(255,255,255);
		color : rgb(255,102,51);
		border : solid 2px rgb(255,102,51);
		cursor : pointer;
	}
	#navigation #itools{		
		border : solid 2px rgba(0,0,0,0.2);
		background-color: rgba(0,0,0,0.1);
		color :rgba(0,0,0,0.2);
	}
	#navigation #itools:hover {
		border : solid 2px rgba(0,0,0,0.5);
		background-color: rgba(0,0,0,0.3);
		color : rgb(255,255,255);
	}
	/* 	sitemap ------------------------------------------------------------------------------------------*/
	#sitemap {
		position : absolute;
		background-color: rgba(255,255,255,0.1);
		z-index : 10;
		left:20px;
		right:20px;
		top:100px;
		bottom:20px;
		width: auto; 
		height:auto; 
		overflow : hidden;
		margin:0px;
		padding:0px;
		border-radius:14px;
	}
	#sitemap #mapdusite {
		/*width: 100%; 
		height:auto; 
		color : rgba(0,0,0,0.8);
		font-family : "FonteDemarche";
		Font-size : 1.1em;
		overflow : auto;
		margin : 20px;
		background-color: rgba(255,255,255,0.9);
		border-radius : 9px;
		*/
		position : absolute;
		background-color: rgba(255,255,255,0.9);
		border : solid 1px rgba(255,102,51,0.5);
		border-radius:14px;
		z-index : 10;
		left:20px;
		right:20px;
		top:20px;
		bottom:20px;
		width: auto; 
		height:auto; 
		overflow : auto;
		margin:0px;
		padding:0px;
	}
	#deuxcols {
	position : relative;
		margin:0px;
		padding:0px;
		-moz-column-width: 400px;
		-webkit-column-width:  400px;
		-moz-column-gap: 10px;
		-webkit-column-gap: 10px;
	   /* -moz-column-rule: 1px solid #ddccb5;
		-webkit-column-rule: 1px solid #ddccb5;*/
	}
	.closer {
		border-radius : 15px;
		color : white;
		text-align: center;
		position:absolute; 
		top : 5px;
		right : 5px;
		height : 20px;
		width : 20px;
		background-color:rgb(255,102,51);
		padding : 2px;
		margin : 2px;
		cursor:pointer;
	}
	.closer:hover {
		background-color:rgba(255,255,255,0.1);
		background-image:url(../data/back.png);
		background-position: center center; 
		background-size: 100%;
	}
	.up {
		float : right;
		position:relative; 
		height : 20px;
		width : 20px;
		border-radius : 15px;
		color : white;
		text-align: center;
		background-color:rgb(255,102,51);
		padding : 2px;
		margin : 2px;
		margin-right : -22px;
		cursor:pointer;
		background-image:url(../data/back_inv.png);
		background-position: center center; 
		background-size: 100%;
	}
	.up:hover {
		background-color:rgba(0,0,0,0.1);
		background-image:url(../data/back.png);
		background-position: center center; 
		background-size: 100%; 
	}
	.ok {background-color: rgba(0,0,0,0.05);}
	/* ------------------ */
	/*     LAST MINUTE    */
	/* ------------------ */
	#inprogress {
		position : absolute;
		width : 410px;
		height : 50px;
		margin : 20px;
		padding : 5px;
		left : -100px;
		top : 27px;
		-ms-transform: rotate(-30deg); /* IE 9 */
		-webkit-transform: rotate(-30deg); /* Chrome, Safari, Opera */
		transform: rotate(-30deg);
		font-size : 2em;
		border : 2px solid rgba(255,102,51,1);
		color : rgba(255,102,51,1);
		background-color : white;
		text-align:center;
		z-index:50;
	}
	#spinner{
		position : absolute;
		left:0px;
		right:0px;
		top:0px;
		bottom:0px;
		margin:0;
		padding:0;
		background-color: rgba(255,255,255,1);
		z-index:50;
		width:auto;
		height:auto;
	}

			/*
 @media screen and (max-height: 600px) {
	#navigation {
			top : 95px;
			bottom : initial;
	}
			*/
}