@font-face {
    font-family: 'grotesque6';
    src: url('../fonts/aa_grotesque6black-webfont.eot');
    src: url('../fonts/aa_grotesque6black-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/aa_grotesque6black-webfont.woff2') format('woff2'),
         url('../fonts/aa_grotesque6black-webfont.woff') format('woff'),
         url('../fonts/aa_grotesque6black-webfont.ttf') format('truetype'),
         url('../fonts/aa_grotesque6black-webfont.svg#grotesque6black') format('svg');
    font-weight: 900;
    font-style: normal;

}




@font-face {
    font-family: 'grotesque6';
    src: url('../fonts/aa_grotesque6bold-webfont.eot');
    src: url('../fonts/aa_grotesque6bold-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/aa_grotesque6bold-webfont.woff2') format('woff2'),
         url('../fonts/aa_grotesque6bold-webfont.woff') format('woff'),
         url('../fonts/aa_grotesque6bold-webfont.ttf') format('truetype'),
         url('../fonts/aa_grotesque6bold-webfont.svg#grotesque6bold') format('svg');
    font-weight: bold;
    font-style: normal;

}




@font-face {
    font-family: 'grotesque6';
    src: url('../fonts/aa_grotesque6reg-webfont.eot');
    src: url('../fonts/aa_grotesque6reg-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/aa_grotesque6reg-webfont.woff2') format('woff2'),
         url('../fonts/aa_grotesque6reg-webfont.woff') format('woff'),
         url('../fonts/aa_grotesque6reg-webfont.ttf') format('truetype'),
         url('../fonts/aa_grotesque6reg-webfont.svg#grotesque6regular') format('svg');
    font-weight: normal;
    font-style: normal;

}



/*
html, body 
{
 
  font-variant:normal;
  background-color:#F8F6F1;
  //background-color:#fb00f4;
}*/


@keyframes glitchColor {
   
    0%   {background-color:#FF3AFF;}
    15%  {background-color:#FF5C00;}
    30%  {background-color:#00FFFF;}
    45%  {background-color:#FFFF00;}
    60%  {background-color:#00FF97;}
    75%  {background-color:#000000;}
    90%  {background-color:#FF3AFF;}
    100%  {background-color:#00FF97;}
    
}

@keyframes blackwhite {
   
    0%   {color:#000000;}
    15%  {color:#FFFFFF;}
    30%  {color:#000000;}
    45%  {color:#FFFFFF;}
    60%  {color:#000000;}
    75%  {color:#FFFFFF;}
    90%  {color:#000000;}
    100% {color:#FFFFFF;}
    
}

@keyframes rotate {
   
    0%    {-ms-transform:  rotateY(0deg);-webkit-transform:  rotateY(0deg);transform:  rotateY(0deg)}
    100%  {-ms-transform:  rotateY(360deg);-webkit-transform:  rotateY(360deg);transform:  rotateY(360deg)}
    
}


table,tr,td,img,div,body,html{
	padding-left:0px;
	padding-right:0px;
	padding-top:0px;
	padding-bottom:0px;
	
	margin-left:0px;
	margin-right:0px;
	margin-top:0px;
	margin-bottom:0px;
	
	border-width:0px;
	border-style:none;
	
	border-collapse:collapse;
	font-family: 'grotesque6';
	font-weight: bold;
	color: black;
	
}



div#content {	
	
	margin-left: 0%;
    margin-right: 0%;
    width:100%;min-width:100%;max-width:100%;
}

.menu{
	
	
	font-size:30px;
	line-height:33px;
	
}




.mFlag{
	position:fixed;
	top:200px;
	left:0px;
	width:200px;
	height:450px;
	z-index:2000;
	
}

.mFlag:hover
{
	cursor:move;
}
.mFlag:out
{
	cursor:default;
}



.flag{
	position:absolute;
	right:0px;
}

.pjt{
	text-align:left;
	padding-left:20px;
	font-size:15px;
	line-height:33px;
	text-decoration: none;
}

.pjt:hover{
	
	text-decoration: line-through;
	
}

.pjtSel{
	
	background-color:black;
	color:white;
	
}
.pjtSel:hover{
	
	animation-name: glitchColor;
	animation-duration: 0.5s;
	animation-iteration-count: infinite;
	
}


.icon{
	
	background-color:black;
	
}

.icon:hover{
	
	animation-name: glitchColor;
	animation-duration: 0.5s;
	animation-iteration-count: infinite;
	
}

.loader{
	
	animation-name: rotate;
	animation-timing-function: linear;
	animation-duration: 2s;
	animation-iteration-count: infinite;
	
}

.subpjt{
	background-image:url("");
	background-size:auto 100%;
	background-position:left center;
	background-repeat:no-repeat;
}



.title{
	padding-left:2%;
	font-size:40px;
	line-height:64px;
	position:relative;
	
}

.client{
	padding-left:20px;
	font-size:20px;
	line-height:40px;
	
}

.description{
	
	padding:20px;
	
	font-size:13px;
	line-height:18px;
	font-weight:normal;
    -webkit-column-count: 2; /* Chrome, Safari, Opera */
    -moz-column-count: 2; /* Firefox */
    column-count: 2;
	
}

.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; height: auto; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }

.date{
	
	position:absolute;
	right:0px;
	top:0px;
	padding-left:25px;
	padding-right:25px;
	font-size:20px;
	line-height:40px;
}

.pjtMaj{
	
	max-width:100%;
	max-height:80%;
	
}

.oeuil{
	
	position:absolute;
	left:0px;
	top:0px;
	width:63px;min-width:63px;max-width:63px;
	height:35px;min-height:35px;max-height:35px;
	background-color:white;
}



.nw{
	
	position:absolute;
	left:0;
	top:0px;
	width:100%;min-width:100%;max-width:100%;
	height:35px;min-height:35px;max-height:35px;
	background-color:white;
}

.ft{
	
	position:absolute;
	left:0px;
	top:0px;
	width:35px;min-width:35px;max-width:35px;
	height:35px;min-height:35px;max-height:35px;
	
}

.nw:hover{
	
	animation-name: glitchColor;
	animation-duration: 0.5s;
	animation-iteration-count: infinite;
	
}

.depi{
	
	overflow:hidden;
	padding:20px;

	font-size:15px;
	line-height:20px;
	font-weight:normal;
	height:auto;
}

.bar{
	background-color:black;
	position:relative;
	z-index:1000;
}

.curs:hover
{
	cursor:pointer;
}
.curs:out
{
	cursor:default;
}

.visio
{
		
		margin-bottom:-5px;
}

.stsel{
			
			
	background: url(../imgs/sel.png) no-repeat right bottom  ;
	background-size:auto 100%;
	padding-right: 10px;
	font-size: 15px;
	font-weight:bold;
	line-height: 1;
	border: 0;
	border-radius: 0;
	height: 22px;
	-webkit-appearance: none;
	outline-width: 0;
	outline: none;

}

.stsel option {
    
    background: #FFFF00;
	
}

.visiofull{
	width:100%;max-width:100%;
	-moz-column-count:3;-webkit-column-count: 3;column-count:3;
	-webkit-column-gap:   0px;
    -moz-column-gap:      0px;
    column-gap:           0px;
	
}


.tit
{
	position:absolute;
	left:0px;
	top:0px;
	background-color:white;
	display:none;
	padding:3px;
}

A{
	
	font-weight: normal;
	color:black;
	//text-decoration:none;
}
A:active   {color:black;}
A:hover     {color:grey;} 
A:visited {color:black;}