@charset "utf-8";
/* CSS Document */
/* Normal Sobriquet*/
/* Fonds des époques */
.vapeurs {
	background-image: url(../../_media/img/documentation/paysage_0.jpg);
}
.autorails {
	background-image: url(../../_media/img/documentation/paysage_2.jpg);
}
.special {
	background-image: url(../../_media/img/documentation/paysage_3.jpg);
}
.diesels {
	background-image: url(../../_media/img/documentation/paysage_4.jpg);
}
.electriques {
	background-image: url(../../_media/img/documentation/paysage_6.jpg);
}
.tgv {
	background-image: url(../../_media/img/documentation/paysage_6.jpg);
}
.vitesse {
	padding-top: 34px;
}	/* Déclaration des vitesses sans caténaire */

/* Vitesse des convois responsives*/

/* Si la taille de l'écran est de 577px de large ou plus */
@media (min-width: 577px) {
	/* Déclaration des hauteurs */
	.scroll {
		height: 200px;
		overflow: hidden;
		position: relative;
		background-size: cover;
		background-repeat: repeat-x;
		background-position: bottom;
	}
	/* Scroll vers la gauche */
	.v40_left {
		animation: scroll_image_left 18s infinite linear;
	}
	.v60_left {
		animation: scroll_image_left 15s infinite linear;
	}
	.v80_left {
		animation: scroll_image_left 12.5s infinite linear;
	}
	.v100_left {
		animation: scroll_image_left 10s infinite linear;
	}
	.v120_left {
		animation: scroll_image_left 9s infinite linear;
	}
	.v140_left {
		animation: scroll_image_left 8.5s infinite linear;
	}
	.v160_left {
		animation: scroll_image_left 8s infinite linear;
	}
	.v160_left_long {
		animation: scroll_image_left_tgv 8s infinite linear;
	}
	.v180_left {
		animation: scroll_image_left 7.5s infinite linear;
	}
	.v200_left {
		animation: scroll_image_left 7s infinite linear;
	}
	.v220_left {
		animation: scroll_image_left 6.8s infinite linear;
	}
	.v240_left {
		animation: scroll_image_left 6.5s infinite linear;
	}
	.v260_left {
		animation: scroll_image_left_tgv 6s infinite linear;
	}
	.v300_left {
		animation: scroll_image_left_tgv 5s infinite linear;
	}
	/* Scroll vers la droite */
	.v40_right {
		animation: scroll_image_right 18s infinite linear;
	}
	.v60_right {
		animation: scroll_image_right 15s infinite linear;
	}
	.v80_right {
		animation: scroll_image_right 12.5s infinite linear;
	}
	.v100_right {
		animation: scroll_image_right 10s infinite linear;
	}
	.v120_right {
		animation: scroll_image_right 9s infinite linear;
	}
	.v140_right {
		animation: scroll_image_right 8.5s infinite linear;
	}
	.v160_right {
		animation: scroll_image_right 8s infinite linear;
	}
	.v160_right_long {
		animation: scroll_image_left_tgv 8s infinite linear;
	}
	.v180_right {
		animation: scroll_image_right 7.5s infinite linear;
	}
	.v200_right {
		animation: scroll_image_right 7s infinite linear;
	}
	.v220_right {
		animation: scroll_image_right 6.8s infinite linear;
	}
	.v240_right {
		animation: scroll_image_right 6.5s infinite linear;
	}
	.v260_right {
		animation: scroll_image_right_tgv 6s infinite linear;
	}
	.v300_right {
		animation: scroll_image_right_tgv 5s infinite linear;
	}
	@keyframes scroll_image_left {
	  from {
		transform: translateX(100%);
	  }
	  to {
		transform: translateX(-200%);
	  }
	}
	@keyframes scroll_image_right {
	  from {
		transform: translateX(-100%);
	  }
	  to {
		transform: translateX(200%);
	  }
	}
	@keyframes scroll_image_left_tgv {
	  from {
		transform: translateX(300%);
	  }
	  to {
		transform: translateX(-600%);
	  }
	}
	@keyframes scroll_image_right_tgv {
	  from {
		transform: translateX(300%);
	  }
	  to {
		transform: translateX(-600%);
	  }
	}

}

/* Si la taille de l'écran est inférieure à 577px */
@media (max-width: 576.98px) {
	/* Déclaration des hauteurs */
	.scroll {
		height: 200px;
		overflow: hidden;
		position: relative;
		background-size: cover;
		background-repeat: repeat-x;
		background-position: bottom;
	}
	/* Scroll vers la gauche */
	.v40_left {
		animation: scroll_image_left 18s infinite linear;
	}
	.v60_left {
		animation: scroll_image_left 15s infinite linear;
	}
	.v80_left {
		animation: scroll_image_left 12.5s infinite linear;
	}
	.v100_left {
		animation: scroll_image_left 10s infinite linear;
	}
	.v120_left {
		animation: scroll_image_left 9s infinite linear;
	}
	.v140_left {
		animation: scroll_image_left 8.5s infinite linear;
	}
	.v160_left {
		animation: scroll_image_left 8s infinite linear;
	}
	.v160_left_long {
		animation: scroll_image_left_tgv 8s infinite linear;
	}
	.v180_left {
		animation: scroll_image_left 7.5s infinite linear;
	}
	.v200_left {
		animation: scroll_image_left 7s infinite linear;
	}
	.v220_left {
		animation: scroll_image_left 6.8s infinite linear;
	}
	.v240_left {
		animation: scroll_image_left 6.5s infinite linear;
	}
	.v260_left {
		animation: scroll_image_left_tgv 6s infinite linear;
	}
	.v300_left {
		animation: scroll_image_left_tgv 5s infinite linear;
	}
	/* Scroll vers la droite */
	.v40_right {
		animation: scroll_image_right 18s infinite linear;
	}
	.v60_right {
		animation: scroll_image_right 15s infinite linear;
	}
	.v80_right {
		animation: scroll_image_right 12.5s infinite linear;
	}
	.v100_right {
		animation: scroll_image_right 10s infinite linear;
	}
	.v120_right {
		animation: scroll_image_right 9s infinite linear;
	}
	.v140_right {
		animation: scroll_image_right 8.5s infinite linear;
	}
	.v160_right {
		animation: scroll_image_right 8s infinite linear;
	}
	.v160_right_long {
		animation: scroll_image_right_tgv 8s infinite linear;
	}
	.v180_right {
		animation: scroll_image_right 7.5s infinite linear;
	}
	.v200_right {
		animation: scroll_image_right 7s infinite linear;
	}
	.v220_right {
		animation: scroll_image_right 6.8s infinite linear;
	}
	.v240_right {
		animation: scroll_image_right 6.5s infinite linear;
	}
	.v260_right {
		animation: scroll_image_right_tgv 6s infinite linear;
	}
	.v300_right {
		animation: scroll_image_right_tgv 5s infinite linear;
	}
	@keyframes scroll_image_left {
	  from {
		transform: translateX(100%);
	  }
	  to {
		transform: translateX(-200%);
	  }
	}
	@keyframes scroll_image_right {
	  from {
		transform: translateX(-100%);
	  }
	  to {
		transform: translateX(200%);
	  }
	}
	@keyframes scroll_image_left_tgv {
	  from {
		transform: translateX(300%);
	  }
	  to {
		transform: translateX(-600%);
	  }
	}
	@keyframes scroll_image_right_tgv {
	  from {
		transform: translateX(-600%);
	  }
	  to {
		transform: translateX(300%);
	  }
	}

}