@charset "utf-8";
/* CSS Document */

@import url(https://fonts.googleapis.com/css?family=Lato:400|Raleway:400);

section {
  padding: 60px 0;
}

html,
body {
  overflow-x: hidden;
}

body {
  font-family: 'Roboto';
  font-size: 14px;
  font-weight: 400;
  background-color: #b1e2f5;
}

h2 {
  margin-top: 10px;
  font-size: 150%;
  font-weight: 500;
  color: black;
  border-top: none;
}

.timeline2020 mark {
  background-color: #ede5f5;
}

.timeline-content.right mark {
  background-color: #edf5e5;
}

.lieu {
  padding-bottom: 30px;
}

.timeline2020 h3:first-of-type {
  float: left;
  text-align: right;
  position: relative;
  width: 38%;
  font: 100 300% 'Raleway';
  color: #c4aae0;

}

.timeline2020 h3:last-of-type {
  float: right;
  width: 38%;
  font: 100 300% 'Raleway';
  color: #c6e0aa;
}

.timeline {
  position: relative;
}

.timeline::before {
  content: '';
  background: #C5CAE9;
  width: 5px;
  height: 97%;
  position: absolute;
  left: 50%;
  /* place la ligne verticale au centre de l'écran */
  transform: translateX(-50%);
}

.timeline-item {
  width: 100%;
  margin-bottom: 70px;
}

.timeline:nth-child(even) .timeline-content .date {
  right: auto;
  left: 0;
}

.timeline:nth-child(even) .timeline-content::after {
  /* le petit bitoniau en triangle sur le côté */
  content: '';
  position: absolute;
  border-style: solid;
  width: 0;
  height: 0;
  top: 30px;
  left: -15px;
  border-width: 10px 15px 10px 0;
  border-color: transparent #f5f5f5 transparent transparent;
}

.timeline-item::after {
  content: '';
  display: block;
  clear: both;
}

.timeline-content {
  position: relative;
  width: 45%;
  padding: 10px 30px;
  border-radius: 4px;
  background: #f5f5f5;
  box-shadow: 0 20px 25px -15px rgba(0, 0, 0, 0.3);
}

.timeline-content::after {
  content: '';
  position: absolute;
  border-style: solid;
  width: 0;
  height: 0;
  top: 30px;
  right: -15px;
  border-width: 10px 0 10px 15px;
  border-color: transparent transparent transparent #f5f5f5;
}

.timeline .timeline-content.left {
  text-align: right;
}

.timeline .timeline-content.right {
  float: right;
}

.timeline-img {
  width: 30px;
  height: 30px;
  background: #FF4081;
  border-radius: 50%;
  position: absolute;
  left: 50%;
  margin-top: 25px;
  margin-left: -15px;
}

a:hover,
a:active,
a:focus {
  background: #32408f;
  color: #FFFFFF;
  text-decoration: none;
}

.timeline-card {
  padding: 0 !important;
}

.timeline-card p {
  padding: 0 20px;
}

.timeline-card a {
  margin-left: 20px;
}

.timeline-item .timeline-img-header1 {
  background: linear-gradient(rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.4)), url('http://www.cpias-ile-de-france.fr/images/timeline-photo1.jpg'), center center no-repeat;
  background-size: cover;
}

.timeline-item .timeline-img-header3 {
  background: linear-gradient(rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.4)), url('http://www.cpias-ile-de-france.fr/images/timeline-photo3.jpg'), center center no-repeat;
  background-size: cover;
}

.timeline-item .timeline-img-header4 {
  background: linear-gradient(rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.4)), url('http://www.cpias-ile-de-france.fr/images/timeline-photo4.jpg') center center no-repeat;
  background-size: cover;
}

.timeline-item .timeline-img-header5 {
  background: linear-gradient(rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.4)), url('http://www.cpias-ile-de-france.fr/images/timeline-photoParis2024.png'), center center no-repeat;
  background-size: cover;
}

.timeline-item .timeline-img-header6 {
  background: linear-gradient(rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.4)), url('https://www.cpias-ile-de-france.fr/images/timeline-photo6.jpg') center center no-repeat;
  background-size: cover;
}

.timeline-item .timeline-img-header7 {
  background: linear-gradient(rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.4)), url('https://www.cpias-ile-de-france.fr/images/timeline-photo7.jpg'), center center no-repeat;
  background-size: cover;
}

.timeline-item .timeline-img-header8 {
  background: linear-gradient(rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.4)), url('https://www.cpias-ile-de-france.fr/images/timeline-photo8.jpg') center center no-repeat;
  background-size: cover;
}

.timeline-item .timeline-img-header9 {
  background: linear-gradient(rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.4)), url('https://www.cpias-ile-de-france.fr/images/timeline-photoTours.jpg') center center no-repeat;
  background-size: cover;
}

.timeline-item .timeline-img-header11 {
  background: linear-gradient(rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.4)), url('https://www.cpias-ile-de-france.fr/images/timeline-photoParis2024bis.png') center center no-repeat;
  background-size: cover;
}

.timeline-item .timeline-img-header12 {
  background: linear-gradient(rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.4)), url('https://www.cpias-ile-de-france.fr/images/timeline-photoParis12.png') center center no-repeat;
  background-size: cover;
}

.timeline-item .timeline-img-header13 {
  background: linear-gradient(rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.4)), url('https://www.cpias-ile-de-france.fr/images/timeline-photoParis13.png') center center no-repeat;
  background-size: cover;
}

.timeline-item .timeline-img-header14 {
  background: linear-gradient(rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.4)), url('https://www.cpias-ile-de-france.fr/images/timeline-photoParis14.png') center center no-repeat;
  background-size: cover;
}

.timeline-item .timeline-img-header15 {
  background: linear-gradient(rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.4)), url('https://www.cpias-ile-de-france.fr/images/timeline-photoParis15.png') center center no-repeat;
  background-size: cover;
}

.timeline-item .timeline-img-header17 {
  background: linear-gradient(rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.4)), url('https://www.cpias-ile-de-france.fr/images/timeline-photoParis16.png') center center no-repeat;
  background-size: cover;
}

.timeline-item .timeline-img-header18 {
  background: linear-gradient(rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.4)), url('https://www.cpias-ile-de-france.fr/images/timeline-photoMain.png') center center no-repeat;
  background-size: cover;
}

.timeline-item .timeline-img-header19 {
  background: linear-gradient(rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.4)), url('https://www.cpias-ile-de-france.fr/images/timeline-photoParis19.png') center center no-repeat;
  background-size: cover;
}

.timeline-item .timeline-img-header20 {
  background: linear-gradient(rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.4)), url('https://www.cpias-ile-de-france.fr/images/timeline-photoNancy.png') center center no-repeat;
  background-size: cover;
}

.timeline-item .timeline-img-header21 {
  background: linear-gradient(rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.4)), url('https://www.cpias-ile-de-france.fr/images/timeline-ssp24.png') center center no-repeat;
  background-size: cover;
}

.timeline-item .timeline-img-header22 {
  background: linear-gradient(rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.4)), url('https://www.cpias-ile-de-france.fr/images/timeline-photoMarseille.png') center center no-repeat;
  background-size: cover;
}

.timeline-item .timeline-img-header23 {
  background: linear-gradient(rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.4)), url('https://www.cpias-ile-de-france.fr/images/timeline-photoAsiem.png') center center no-repeat;
  background-size: cover;
}

.timeline-item .timeline-img-header24 {
  background: linear-gradient(rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.4)), url('https://www.cpias-ile-de-france.fr/images/timeline-photoParis2025.png') center center no-repeat;
  background-size: cover;
}

.timeline-img-header1,
.timeline-img-header3,
.timeline-img-header4,
.timeline-img-header5,
.timeline-img-header6,
.timeline-img-header7,
.timeline-img-header8,
.timeline-img-header9,
.timeline-img-header11,
.timeline-img-header12,
.timeline-img-header13,
.timeline-img-header14,
.timeline-img-header15,
.timeline-img-header17,
.timeline-img-header18,
.timeline-img-header19,
.timeline-img-header20,
.timeline-img-header21,
.timeline-img-header22,
.timeline-img-header23,
.timeline-img-header24 {
  height: 200px;
  position: relative;
  margin-bottom: 20px;
}

.timeline-img-header1 h2,
.timeline-img-header3 h2,
.timeline-img-header4 h2,
.timeline-img-header5 h2,
.timeline-img-header6 h2,
.timeline-img-header7 h2,
.timeline-img-header8 h2,
.timeline-img-header9 h2,
.timeline-img-header11 h2,
.timeline-img-header12 h2,
.timeline-img-header13 h2,
.timeline-img-header14 h2,
.timeline-img-header15 h2,
.timeline-img-header17 h2,
.timeline-img-header18 h2,
.timeline-img-header19 h2,
.timeline-img-header20 h2,
.timeline-img-header21 h2,
.timeline-img-header22 h2,
.timeline-img-header23 h2,
.timeline-img-header24 h2 {
  color: #FFFFFF;
  position: absolute;
  bottom: 5px;
  left: 20px;
}

blockquote {
  margin-top: 30px;
  color: #757575;
  border-left-color: #3F51B5;
  padding: 0 20px;
}

.dateleft {
  background: #aa85d2;
  display: inline-block;
  color: #FFFFFF;
  padding: 5px;
  position: absolute;
  top: 0;
  right: 0;
}

.dateright {
  background: #a0cc72;
  display: inline-block;
  color: #FFFFFF;
  padding: 5px;
  position: absolute;
  top: 0;
  right: 0;
}

@media screen and (max-width: 768px) {
  .timeline::before {
    left: 50px;
  }

  .timeline .timeline-img {
    left: 50px;
  }

  .timeline .timeline-content {
    max-width: 100%;
    width: auto;
    margin-left: 70px;
  }

  .timeline .timeline-item:nth-child(even) .timeline-content {
    float: none;
  }

  .timeline .timeline-item:nth-child(odd) .timeline-content::after {
    content: '';
    position: absolute;
    border-style: solid;
    width: 0;
    height: 0;
    top: 30px;
    left: -15px;
    border-width: 10px 15px 10px 0;
    border-color: transparent #f5f5f5 transparent transparent;
  }

  .lieu {
    display: none;
  }
}