body{background-color:#ffffff;color:#222222;margin:0px;font-family: "VF Sans-Bold", Arial, Georgia, sans-serif;font-size:11px;letter-spacing: 1px;-webkit-text-size-adjust:none;}
*:focus{outline: none;}
.represented {color: #fff;font-size:18px;line-height: 140%;}
.represented a {color: #fff;text-decoration: none;}
.represented a:hover {color: #222;text-decoration: none;}
.iconlogo {margin-top: -10px;}
.photofilm {font-size:16px;font-weight: bold;line-height: 18px; }
.cell {color: #222222;}

a {
  outline: none;
  text-decoration: none;
  padding: 2px 1px 0;
}

a:link {
  color: #222;
}

a:visited {
  color: #222;
}


div {
  text-align: justify;
  text-justify: inter-word;
}


#typing-demo {
  width: 64ch;
  animation: typing 2s steps(31), blink .5s step-end infinite alternate;
  white-space: nowrap;
  overflow: hidden;
  border-right: 3px solid;
  font-family: "VFSans-Light", Arial, Georgia, sans-serif;
  font-size: 2em;
}

@keyframes typing {
  from {
    width: 0
  }
}
    
@keyframes blink {
  50% {
    border-color: transparent
  }
}


#gauche,#droite{background-color: transparent;background-repeat: no-repeat;width: 150px;height: 500px;position:absolute;
top:50%;margin-top:-250px;z-index: 500;opacity: 0.3;-moz-opacity: 0.3;filter:alpha(opacity=30);}
#gauche{left: 0;cursor:w-resize !important;/*background-image: url('/assets/img/gauche.gif');*//*background-position: center left;*/}
#droite{right: 0;cursor:e-resize !important;/*background-image: url('/assets/img/droite.gif');*//*background-position: center right;*/}
#gauche:hover,#droite:hover{background-color: transparent;/*opacity: 0.6;*//*-moz-opacity: 0.6;*//*filter:alpha(opacity=60);*/}
#galerie {width:100%;height:510px;overflow-y: hidden; overflow-x: auto;position:absolute;top:50%;margin-top:-250px;}
#galerieFilm {width:100%;height:410px;overflow-y: hidden;overflow-x: auto;position:absolute;top:50%;margin-top:-205px;}

/*footer*/
#nav {height:50px;position:absolute;top:50%;left:47%;width:545px;/*margin-top: 276px;*/margin-top:300px;margin-left:-200px;
text-align:center;}
/**/
ul{list-style-type:none;margin:0;padding:0;text-align:center;}
li{display:inline;margin:0;padding:0;padding:10px 0 10px 0;}
li a{/*margin:20px 0 10px 0;*/}
li.photos{/*background-image:url('/assets/img/trait_noir.png');*//*background-position:top right;*//*background-repeat:no-repeat;*/}
li.films,li.contact{/*background-image:url('/assets/img/trait_blanc.png');*//*background-position:top left;*//*background-repeat:no-repeat;*/}
li.contact{/*padding-left:30px;*/}
li a {color:#222;padding:0 15px;text-decoration:none;}
li a:hover{text-decoration: none;color: #222;}
table #photosTable {height:500px;margin:0;}
table #filmsTable{
  height:460px;
  margin:0;
}
table tr td img,
table tr td div,
table tr td .video-js-box img,
table tr td .video-js-box video,
table tr td .video-js-box video img {
  display:block;
  margin:0;
  border:none;
}
#videoPlayer{
	width:100%;
	height:100%;
}

#films .films span,
#photos .photosfilms span,
#contact .contact span{
    color: #57636f;
}
#homeContent {
    position: absolute;
    /*top:250px;     */
    top: 46%;
    left: 50%;
    width: 740px;
    height: 310px;
    margin-left: -360px;
    margin-top: -100px;
}
#homeCommit {
    position: absolute;
    /*top:250px;     */
    top: 23%;
    left: 50%;
    width: 720px;
    height: 720px;
    margin-left: -360px;
    margin-top: -100px;
}
#homeCommit2 {
    position: absolute;
    /*top:250px;     */
    top: 23%;
    left: 42%;
    width: 1000px;
    height: 720px;
    margin-left: -360px;
    margin-top: -100px;
}
#homeCommit3 {
    position: absolute;
    /*top:250px;     */
    top: 23%;
    left: 36%;
    width: 1000px;
    height: 720px;
    margin-left: -360px;
    margin-top: -100px;
}
#homeContent h2{
/*font-family: 'HelveticaLightNormalRegular';*/
  /*font-size:60px;*/
  text-align:center;
  font-weight:normal;
	/*color: #fff*/
  /*margin-bottom:20px;*/
}
/*

CONTACT ------------------------------------------------------------------------------------

*/

#contact #fiche {
  position:absolute;
  width:300px;
  height:500px;
  top:53%;
  left:50%;
  margin-left:-123px;
  margin-top:-230px;
}
/*
#contact #fiche {
  position:absolute;
  width:300px;
  height:500px;
  top:53%;
  left:50%;
  margin-left:-110px;
  margin-top:-230px;
  font-size:18px;
  line-height:22px;
  overflow:visible;
	font-family: 'HelveticaLightNormalRegular';
	letter-spacing:1px;
}
#contact h2{
  color:#fff;
  font-size:20px;
  text-align:left;
  margin-bottom:20px;
  font-weight: normal;
}
#contact .adresse{
  font-size:20px;
  text-align:justify;
  color:#666;
  margin-bottom:20px;
}
#contact .mail{
  font-size:20px;
  text-align:justify;
  color:#fff;
  margin-bottom:20px;
}
#contact .represent{
  text-align:justify;
  color:#ccc;
  font-size:20px;
  margin-bottom:20px;
}
#contact #fiche a{
  color:#fff;
  text-decoration:none;
}
#contact #fiche a:hover{
  color:#fff;
  text-decoration:underline;
}
*/
#contact #signature{
  /*position:absolute;*/
  /*top:50%;*/
  /*left:20px;*/
  /*margin-top:-250px;*/
}
#contact .copyright{
  /*font-size:14px;*/
  /*text-align:justify;*/
  /*color:#666;*/
  /*margin-bottom:20px;*/
	position:absolute;
	right:0px;
	width:30px;
	height:86px;
    margin-top:131px;
    top:50%;
}
/*

ADMIN ------------------------------------------------------------------------------------

*/
#admin{
  font-family: "HelveticaLTStdCondensed", Helvetica, Arial, sans-serif;
  background-color:#fff;
  color:#666;
  font-size:60px;
}
#admin #header,
#admin #assets{
  padding:30px;
  position:relative;
}
#admin #header{
  background-color:#eee;
}
#admin #save_link{
  position: absolute;
  top:30px;
  right:230px;
}
#admin #logout_link{
  position: absolute;
  top:30px;
  right:30px;
}
#admin h2{
  margin-bottom:20px;
}
#admin h2 span{
  font-weight: bold;
  font-style: italic;
  color:#333;
}
#random_photo,
#random_video{
  font-size:14px;
  margin-bottom:20px;
}
#admin #assets img{
  /*height:128px;*/
  height:100px;
  float: left;
}
#admin #assets #assets_off,
#admin #assets #assetsVideo_off{
  padding-top:20px;
  border-bottom:1px solid #ddd;
  clear:both;
  overflow: auto;
}
#admin #assets #assets_on{
  border-bottom:1px solid #ddd;
  overflow: auto;
}
#admin #assets #assetsVideo_on{
  padding-top:20px;
  border-bottom:1px solid #ddd;
  overflow: auto;
}
#admin #assets #assets_on .div,
#admin #assets #assets_off .div,
#admin #assets #assetsVideo_on .div,
#admin #assets #assetsVideo_off .div{
  position: relative;
  float:left;
  border: 1px solid #fff;
}
#admin #assets #assets_off .div{
  background-image: url('traitement.jpg');
  background-position: top left;
  background-repeat: no-repeat;
  min-width: 75px;
}
#admin #assets #assetsVideo_off .div{
  background-image: url('traitement.jpg');
  background-position: top left;
  background-repeat: no-repeat;
  min-width: 100px;
}
#admin #assets #assets_on .last,
#admin #assets #assets_off .last,
#admin #assets #assetsVideo_on .last,
#admin #assets #assetsVideo_off .last{
  margin-bottom: 30px;
}
#admin div.last .toRight,
#admin div.first .toLeft{
  display: none;
}
#admin .toLeft{
  font-size:12px;
  display:block;
  position:absolute;
  top:20px;
  width:30px;
  height:100px;
  left:0;
  background-position:center center;
  background-repeat: no-repeat;
  text-indent: -9000px;
}
#admin .toLeft:hover{
  background-image: url("arrow_left.gif");
}
#admin .toRight{
  font-size:12px;
  display:block;
  position:absolute;
  top:20px;
  width:30px;
  height:100px;
  right:0;
  background-position:center center;
  background-repeat: no-repeat;
  text-indent: -9000px;
}
#admin .toRight:hover{
  background-image: url("arrow_right.gif");
}
#admin .tools{
  background-color:#333;
  font-family:Arial, sans-serif;
  font-weight:bold;
  display: block;
  font-size:12px;
  line-height: 20px;
  /*clear:both;*/
  height:20px;
}
#admin .tools .toOff{
  display:block;
  float:left;
  color:#fff;
  line-height: 20px;
  height:20px;
  width: 40%;
  margin:0 0 0 5px;
}
#admin .tools .toHell{
  display:block;
  color:#fff;
  float:right;
  /*line-height: 20px;*/
  /*height:20px;*/
  /*width: 40%;*/
  /*margin:0 5px 0 0;*/
  /*text-align: right;*/
  margin-right:5px;
}
#admin .tools .toPoster{
  /*display:block;*/
  /*color:#fff;*/
  /*float:right;*/
  /*line-height: 20px;*/
  /*height:20px;*/
  /*width: 40%;*/
  /*margin-right:5px;*/
  /*text-align: right;*/
}
#admin .tools .toHell:link,
#admin .tools .toHell:visited,
#admin .tools .toHell:hover,
#admin .tools .toOff:link,
#admin .tools .toOff:visited,
#admin .tools .toOff:hover,
#admin .tools .toPoster:link,
#admin .tools .toPoster:visited,
#admin .tools .toPoster:hover{
  color:#fff;
  text-decoration: none;
}
/*#admin .toOff,*/
/*#admin .toOn{*/
  /*background-color:#333;*/
  /*color:#fff;*/
  /*font-family:Arial, sans-serif;*/
  /*font-weight:bold;*/
  /*display: block;*/
  /*position: absolute;*/
  /*bottom:2%;*/
  /*left:15px;*/
  /*right:15%;*/
  /*[>width:96%;<]*/
  /*height:20px;*/
  /*font-size:12px;*/
  /*text-decoration:none;*/
  /*text-align: center;*/
  /*line-height: 20px;*/
  /*-moz-border-radius: 5px;*/
  /*-webkit-border-radius: 5px;*/
  /*-khtml-border-radius: 5px;*/
  /*border-radius: 5px;*/
/*}*/
/*#admin .toOff:hover,*/
/*#admin .toOn:hover{*/
  /*text-decoration:underline;*/
/*}*/
.clear{
  clear: both;
}
#admin #assets #upload_asset{
  overflow: hidden;
  margin-bottom:0;
  border-bottom:1px solid #ddd;
}
#admin #assets #upload_asset h2{
  margin:20px 0 0 0;
}
#admin #upload_asset form{
  margin: 0 0 0 0;
}
#admin #upload_asset form input{
  margin: 0 0 0 0;
}
#admin #upload_asset form iframe{
  position: absolute;
  top:0;
  right:0;
}
#admin a {
  color:#000;
  text-decoration:none;
}
#admin a:hover{
  text-decoration:underline;
}


#lock{
  font-family: "VF Sans-Bold", Arial, Georgia, sans-serif;
  background-color:#fff;
  text-align:center;
}
#lock form{
  display: block;
  position: absolute;
  width:256px;
  height:180px;
  top:50%;
  left:50%;
  margin-left:-128px;
  margin-top:-90px;
  color:#666;
}
#lock h1{
  font-size:60px;
  margin-bottom:20px;
  font-weight:bold;
}
#lock label{
  display: block;
  margin-bottom:10px;
}
#lock #username_field,
#lock #password_field{
  font-size:20px;
  font-family: "VF Sans-Bold", Arial, Georgia, sans-serif;
  margin-bottom:20px;
  width:156px;
}
#lock p{
  margin-bottom:20px;
}
