#timeline {position: relative;max-width: 1400px;margin: 0 auto; background-color: #fff;  padding: 20px 0px; }
#timeline * {box-sizing: border-box;}
#timeline::after {content: '';position: absolute;width: 6px;background-color: #3175ac;top: 0;bottom: 0;left: 50%;margin-left: -3px;}
#timeline .containerM368 {padding: 10px 40px;position: relative;background-color: inherit;width: 50%;}
#timeline .containerM368::after {content: '';position: absolute;width: 25px;height: 25px;right: -17px;background-color: #dfdfdf;border: 4px solid #3175ac;top: 15px;border-radius: 50%;z-index: 1;}
#timeline .containerM368:nth-child(odd) { left: 0; }
#timeline .containerM368:nth-child(even) { left: 50%; }
#timeline .containerM368:nth-child(odd)::before {content: " ";height: 0;position: absolute;top: 22px;width: 0;z-index: 1;right: 30px;border: medium solid white;border-width: 10px 0 10px 10px;border-color: transparent transparent transparent #3175ac;}
#timeline .containerM368:nth-child(even)::before {content: " ";height: 0;position: absolute;top: 22px;width: 0;z-index: 1;left: 30px;border: medium solid white;border-width: 10px 10px 10px 0;border-color: transparent #3175ac transparent transparent;}
#timeline .containerM368:nth-child(even)::after {left: -16px;}
#timeline .contentM368 { padding: 20px 40px;background-color: #3175ac; position: relative;border-radius: 6px;}
#timeline .containerM368:nth-child(odd) .contentM368 { box-shadow: -8px 8px 8px #cacaca;}
#timeline .containerM368:nth-child(even) .contentM368 { box-shadow: 8px 8px 8px #cacaca;}
#timeline .M368_title { margin: 0; padding: 0; line-height: 1.8; font-size: 22px; color: #fff; font-family: poppinsbold; }
#timeline .M368_des { margin: 0; padding: 10px 0px; line-height: 1.6; font-size: 14px; color: #fff; font-family: poppinsregular;}
@media screen and (max-width: 768px) {
  #timeline::after {left: 31px;}
  #timeline .containerM368 {width: 100%;padding-left: 70px;padding-right: 25px;}
  #timeline .contentM368 { padding: 20px 30px; }
  #timeline .containerM368:nth-child(odd)::before, #timeline .containerM368:nth-child(even)::before {left: 60px;border: medium solid white;border-width: 10px 10px 10px 0;border-color: transparent #3175ac transparent transparent;}
  #timeline .containerM368:nth-child(odd)::after, #timeline .containerM368:nth-child(even)::after {left: 15px;}
  #timeline .containerM368:nth-child(odd) .contentM368 { box-shadow: 8px 8px 8px #cacaca;}
  #timeline .containerM368:nth-child(even) {left: 0%;}
  #timeline .M368_title { font-size: 20px;}
}
@media screen and (max-width: 600px) {
       #timeline .M368_title { font-size: 18px;}
       #timeline .M368_des { font-size: 13px;}
}

