.jumbotron {background:none;margin-top:130px;}
.jumbotron h1 {background:none;}
.jumbotron h1 span {
    background: none;
    padding: 0;
}
.bgF2 {
	background:#f2f2f2;
}
.bandeauPepites{
	background:#64e61e;
}
.bandeauPepites p{font-size:18px;}
#backgroundVideo {
    position: fixed;
    /*top: 50%;*/
	top:305px;
    left: 50%;
    min-width: 100%;
    min-height: 100%;
    width: auto;
    height: auto;
    z-index: -100;
    -webkit-transform: translateX(-50%) translateY(-50%);
    transform: translateX(-50%) translateY(-50%);
}

video#backgroundVideo {
   background: transparent url('homepage_again_fichiers/bandeauHVideoYeux.jpg') 50% 50% / cover no-repeat ;
 }
video#backgroundVideo[poster] {top:305px;}
.container h1 {
    color: white;
}
.filterBottom{
	background:url(../homepage_again_fichiers/filterBottom.png) repeat-x bottom center;
}
.findUs{
	background:#000000;
	color:#8C8C96;
}

/*animation element sliding left*/

.animation-element.slide-left {
  opacity: 0;
  -moz-transition: all 1000ms ease-in-out;
  -webkit-transition: all 1000ms ease-in-out;
  -o-transition: all 1000ms ease-in-out;
  transition: all 1000ms ease-in-out;
  -moz-transform: translate3d(-200px, 0px, 0px);
  -webkit-transform: translate3d(-200px, 0px, 0px);
  -o-transform: translate(-200px, 0px);
  -ms-transform: translate(-200px, 0px);
  transform: translate3d(-200px, 0px, 0px);
}

.animation-element.slide-left.in-view {
  opacity: 1;
  -moz-transform: translate3d(0px, 0px, 0px);
  -webkit-transform: translate3d(0px, 0px, 0px);
  -o-transform: translate(0px, 0px);
  -ms-transform: translate(0px, 0px);
  transform: translate3d(0px, 0px, 0px);
}

/*animation element sliding right*/

.animation-element.slide-right {
  opacity: 0;
  -moz-transition: all 1000ms ease-in-out;
  -webkit-transition: all 1000ms ease-in-out;
  -o-transition: all 1000ms ease-in-out;
  transition: all 1000ms ease-in-out;
  -moz-transform: translate3d(300px, 0px, 0px);
  -webkit-transform: translate3d(300px, 0px, 0px);
  -o-transform: translate(300px, 0px);
  -ms-transform: translate(300px, 0px);
  transform: translate3d(300px, 0px, 0px);
}

.animation-element.slide-right.in-view {
  opacity: 1;
  -moz-transform: translate3d(0px, 0px, 0px);
  -webkit-transform: translate3d(0px, 0px, 0px);
  -o-transform: translate(0px, 0px);
  -ms-transform: translate(0px, 0px);
  transform: translate3d(0px, 0px, 0px);
}

/*animation element sliding top*/

.animation-element.slide-top {
  opacity: 0;
  -moz-transition: all 400ms ease-in-out;
  -webkit-transition: all 400ms ease-in-out;
  -o-transition: all 400ms ease-in-out;
  transition: all 400ms ease-in-out;
  -moz-transform: translate3d(0px, -200px, 0px);
  -webkit-transform: translate3d(0px, -200px, 0px);
  -o-transform: translate(0px, -200px);
  -ms-transform: translate(0px, -200px);
  transform: translate3d(0px, -200px, 0px);
}

.animation-element.slide-top.in-view {
  opacity: 1;
  -moz-transform: translate3d(0px, 0px, 0px);
  -webkit-transform: translate3d(0px, 0px, 0px);
  -o-transform: translate(0px, 0px);
  -ms-transform: translate(0px, 0px);
  transform: translate3d(0px, 0px, 0px);
}

/*animation element sliding bottom*/

.animation-element.slide-bottom {
  opacity: 0;
  -moz-transition: all 800ms ease-in-out;
  -webkit-transition: all 800ms ease-in-out;
  -o-transition: all 800ms ease-in-out;
  transition: all 800ms ease-in-out;
  -moz-transform: translate3d(0px, 200px, 0px);
  -webkit-transform: translate3d(0px, 200px, 0px);
  -o-transform: translate(0px, 200px);
  -ms-transform: translate(0px, 200px);
  transform: translate3d(0px, 200px, 0px);
}

.animation-element.slide-bottom.in-view {
  opacity: 1;
  -moz-transform: translate3d(0px, 0px, 0px);
  -webkit-transform: translate3d(0px, 0px, 0px);
  -o-transform: translate(0px, 0px);
  -ms-transform: translate(0px, 0px);
  transform: translate3d(0px, 0px, 0px);
}

@media screen and (min-width: 0px) and (max-width: 319px) {
	video#backgroundVideo[poster] {top:140px; width:768px}
	.jumbotron {background:none;margin-top:10px;}
	.jumbotron h1{font-size:18px;}
	.col-xs-6.meaProd{padding:0;width:100%;float:left;}
	.meaProd img{max-width:80%;}
	.bandeauPepites p{font-size:12px;}
	.bandeauPepites .mainPadding{padding:0em 1em;}
	.mapFoot{width:100%;}
	.h1.hashtag {font-size:22px;}
}
@media screen and (min-width: 320px) and (max-width: 767px) {
	video#backgroundVideo[poster] {top:140px; width:768px}
	.jumbotron {background:none;margin-top:10px;}
	.jumbotron h1{font-size:18px;}
	.meaProd{padding:0;text-align:center;}
	.meaProd img{max-width:80%;}
	.bandeauPepites p{font-size:12px;}
	.bandeauPepites .mainPadding{padding:0em 1em;}
	.mapFoot{width:80%;}
	.h1.hashtag {font-size:22px;}
	span.linkEllipse {margin-top:0;}
	.animation-element.slide-top {opacity: 1;transform: translate3d(0px, -3px, 0px);transition: all 400ms ease-in-out 0s;margin-bottom:0.5em;}
}
	

@media screen and (min-width: 768px) and (max-width: 999px) {
		video#backgroundVideo[poster] {top:245px;}
		.jumbotron {background:none;margin-top:60px;}
		.meaProd{padding:0;text-align:center;}
		.meaProd img{max-width:80%;}
		.pictoBloc {float:left;}
}

@media screen and (min-width: 1000px) {
		video#backgroundVideo[poster] {top:420px;}
}	

@media (min-width: 768px) and (max-width: 1199px) {
		video#backgroundVideo[poster] {top:245px;}
}


.chat {
  width: 48px;
  height: 48px;
  background: #1E1E23;
  transition:all .4s ease;
  color:#FFF;
  position:fixed;
  right:0;
  top:50%;
  z-index:9999;
}

.textChat {
  color:#FFF;
  font-family:"Gotham", sans-serif;
  margin-top:15px;
  margin-right:20px;
  display:block;
  float:right;
  display:none;
  animation-name:fadeText;
  animation-duration:2s;
}

@keyframes fadeText {
  0%   { opacity: 0; }
  100% { opacity: 1; }
}

.textChat a{
  text-decoration:none;
  color:#FFF
}
.chat:hover {
  width: 180px;
  cursor:pointer;
}

.chat:hover .textChat{
  display:block;
}
