.grandtitre {
  font-size: 100px;
	color: #ffffff;
	margin-top: 250px;
	animation: textanim 5s;
  animation-delay: 1s;
  animation-fill-mode: both;
}

.titre {
	font-size: 30px;
	color: #ffffff;
  margin-top: -20px;
	animation: textanim2 4.7s;
  animation-delay: 1.2s;
  animation-fill-mode: both;
}

.soustitre {
	font-size: 30px;
	color: #ffffff;
	animation: textanim3 3s;
  animation-delay: 3s;
  animation-fill-mode: both;
}

.logo {
  margin-top: -333px;
  animation: logo 3s;
  animation-delay: 5.8s;
  animation-fill-mode: both;
}

.roboto {
  font-family: "Roboto-Light";
}

.robotomed {
  font-family: "Roboto-Medium";
}

@keyframes textanim {
  0% {
  	transform:translateY(0px);	
    opacity:0;
  }
  30% {
  	transform:translateY(5px);
    opacity:1;
  }
  70% {
    transform:translateY(5px);
    opacity:1;
  }
  100% {
    transform:translateY(5px);
    opacity:0;
  }
}

@keyframes textanim2 {
  0% {
    transform:translateY(0px);  
    opacity:0;
  }
  30% {
    transform:translateY(5px);
    opacity:0.4;
  }
  70% {
    transform:translateY(5px);
    opacity:0.4;
  }
  100% {
    transform:translateY(5px);
    opacity:0;
  }
}

@keyframes textanim3 {
  0% {
    opacity:0;
  }
  30% {
    opacity:0.4;
  }
  50% {
    opacity:0.4;
  }
  100% {
    opacity:0;
  }
}

@keyframes logo {
  0% {
    opacity:0;
    transform: scale(1.00);
  }
  100% {
    opacity:1;
    transform: scale(0.97);
  }
}

@font-face {
	font-family: "Roboto-Medium";
	src: url(Roboto-Medium.ttf) format('truetype');
}

@font-face {
	font-family: "Roboto-Light";
	src: url(Roboto-Light.ttf) format('truetype');
}

body {
	background: #1E1E1E
}