@font-face {
  font-family: 'HeadCorps'; /* name you’ll use */
  src: url('../fonts/headcorps.otf') format('opentype');
}

@font-face {
  font-family: 'Comega';
  src: url('../fonts/cgor45w.ttf') format('truetype');
}

body 
{
  font-family: "Montserrat", sans-serif;
}

h1, h2, h3 
{
  font-family:'HeadCorps', sans-serif;
}

a:hover 
{
  text-decoration:none;
}

.top-header 
{
  padding:7px 0px;
}

.top-header 
{
  background:#ba141a;
  color:#fff;
   font-family: "Montserrat", sans-serif;
   font-weight:400;
   text-transform:uppercase;
   font-size:15px;
}

.top-header a 
{
  color:#fff;
  margin-left:10px;
}

.menu-div 
{
  background:#FAD955;
  height:70px;
}

img.main-logo 
{
  height:120px;
  margin-top:-25px;
}

a.navbar-brand 
{
  display:none;
}

.main-menu 
{
  padding-top:15px;
  padding-right:-0px;
}

.main-menu ul li a 
{
  color:#8E0C11;
  font-family: "Montserrat", sans-serif;
  text-transform:uppercase;
  font-size:16px;
  transition:linear 0.1s font-size;
    padding:5px 15px !important;
    font-weight:700;
    margin-top:3px;
}

.main-menu ul li a:hover 
{
  color:#DB1C14;
  font-size:16.5px;
  transition:linear 0.2s font-size;
}

.slider {
  background-image: url('../img/back.png');
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  background-attachment: fixed;
}

/* iPhone Safari fix */
@supports (-webkit-touch-callout: none) {
  .slider {
    background-attachment: scroll;
  }
}

.slider img 
{
  width:100%;
  margin-top:40px;
}

.slider h3 
{
  padding-top:15vh;
  color:#FAD955;
  text-transform:uppercase;
}

.slider h2 
{
  font-size:6.5em;
  color:#fff;
  line-height:0.9em;
}

.slider a 
{
  background:#FAD955;
  border-radius:10px;
  color:#8E0C11;
  padding:5px 15px;
  margin-top:30px;
  font-family: "Montserrat", sans-serif;
  text-transform:uppercase;
  display:inline-block;
  font-weight:400;
  font-size:15px;
}

.news-feature 
{
  margin-top:30px;
  transition:linear 0.1s transform;
}

.news-feature:hover 
{
  transform:scale(1.03);
  transition:linear 0.2s transform;
}

.news-feature img 
{
  width:100%;
  height:180px;
  object-fit:cover;
  border-radius:25px;
}

.news-feature h4 
{
  color:#222;
  font-size:15px;
  margin-top:10px;
  line-height:22px;
  font-weight:600;
}

.first-news 
{
  margin-top:-80px;
}

.first-fixtures 
{
  background:#fff;
  box-shadow:0px 5px 10px #aaa;
  border-radius:25px;
  margin-top:30px;
  padding:25px;
}

.fixture-single img 
{
  height:75px;
  width:auto;
}

.first-fixtures h2 
{
  margin-top:0px;
  color:#DB1C14;
  text-transform:uppercase;
  border-bottom:solid 1px #E0E0E0;
  font-size:26px;
  padding-bottom:10px;
  margin-bottom:0px;
}

a.link-text
{
  color:#DB1C14;
  font-family: "Montserrat", sans-serif;
  font-size:15px;
  text-transform:uppercase;
  display:block;
  font-weight:800;
}

.fixture-single 
{
  padding-top:15px;
  border-bottom:solid 1px #E0E0E0;
  padding-bottom:10px;
  transition:linear 0.1s transform;
}

.fixture-single:hover 
{
  transform:scale(1.05);
  transition:linear 0.2s transform;
}

.fixture-single h3 
{
  margin-top:20px;
  color:#666;
  font-size:38px;
}

.fixture-single h5 
{
  color:#DB1C14;
  font-size:15px;
  font-weight:600;
}

.fixture-single h6 
{
  color:#555;
  font-size:14px;
  font-weight:600;
}

.squad-team 
{
  padding-top:90px;
}

.player-single 
{
    margin-top:30px;
    display:block;
    position:relative;
    height:420px;
    transition:linear 0.1s transform;
    margin-bottom:60px;
}

.player-single a:hover 
{
    color:#fff;
}

.player-single:hover 
{
    transform:scale(1.07);
    transition:linear 0.2s transform;
}

.player-single img 
{
    width:100%;
}

.back-card
{
    position:absolute;
    top:30px;
    left:0px;
}

.player-card 
{
    position:absolute;
    top:0px;
    left:0px;
    margin-top:10px;
}

img.player-card 
{
    width:100%;
}

.marq-single 
{
    height:480px;
}

.marq-single img 
{
    width:95%;
    margin-left:2.5%;
}


.player-single h3 
{
    position:absolute;
    top:310px;
    width:100%;
    text-align:center;
    text-transform:uppercase;
    letter-spacing:0.3px;
    font-size:26px;
    color:#FFE208;
}

.player-single h5 
{
    position:absolute;
    top:340px;
    width:100%;
    text-align:center;
    text-transform:uppercase;
    font-size:14px;
    color:#fff;
}

.squad-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  color: #d00000;
}


.marq-single h3 
{
    top:360px;
    font-size:42px;
}

.marq-single h5 
{
    top:410px;
}


.squad-title {
  font-weight: bold;
  font-size: 18px;
  letter-spacing: 1px;
  text-transform: uppercase;
}

.squad-title h3 
{
    font-size:34px;
}

.squad-line {
  flex-grow: 1;
  height: 1px;
  background-color: #d00000;
  margin: 0 20px;
  opacity: 0.5;
}

.squad-link {
  font-size: 12px;
  text-transform: uppercase;
  font-weight: bold;
  letter-spacing: 0.5px;
  color: #d00000;
  text-decoration: none;
}

.video-feature 
{
  background:#222;
  padding:90px 0px;
  margin-top:90px;
}

.video-feature h3 
{
  color:#fff;
  text-transform:uppercase;
  font-size:34px;
}

.video-feature h4 
{
    white-space: nowrap;
  overflow: hidden;       /* optional: hides overflow text */
  text-overflow: ellipsis; /* optional: adds "..." when cut */
}

a.link-white 
{
  color:#fff;
}

.big-video-div {
  border-radius: 30px;
  background: #fff;
  margin-top: 30px;
  overflow: hidden;
  position: relative;
  transition:linear 0.1s transform;
}

.big-video-div:hover 
{
  transform:scale(1.03);
  transition:linear 0.2s transform;
}

.video-wrapper {
  position: relative;
}

.big-video-div img {
  border-top-right-radius: 30px;
  border-top-left-radius: 30px;
  width: 100%;
  height: 430px;
  object-fit: cover;
  display: block;
}

.play-button {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  font-size: 80px;
  color: white;
  opacity: 0;
  transition: opacity 0.3s ease;
  pointer-events: none;
  text-shadow: 0 0 10px rgba(0, 0, 0, 0.8);
}

.big-video-div:hover .play-button {
  opacity: 1;
}

.big-video-div h4 {
  color: #222;
  padding: 15px 25px;
  font-size: 16px;
  font-weight:600;
}

.short-video-div img 
{
  height:175px;
  border-top-right-radius: 20px;
  border-top-left-radius: 20px;
}

.short-video-div 
{
  border-radius:20px;
}

.short-video-div h4 
{
  font-size:15px;
  padding:15px;
}

.extra-news 
{
  padding:90px 0px;
}

.points-table {
      width: 100%;
      margin: 0 auto;
      border-collapse: separate;
      border-spacing: 0;
      border-radius: 25px;
      overflow: hidden;
      box-shadow: 0 4px 10px rgba(0,0,0,0.1);
    }

  .points-table th {
    background-color: #d92027;
    color: white;
    padding: 15px;
    text-align: left;
    text-transform: uppercase;
    font-size: 14px;
  }

  .points-table td {
    padding: 16px;
    font-size: 15px;
    color: #333;
    transition:linear 0.1s transform;
  }

  .points-table tr 
  {
    transition:linear 0.1s transform;
  }

  .points-table tr:hover 
  {
    transform:scale(1.03);
    transition:linear 0.2s transform;
  }

  .points-table tbody tr:nth-child(even) {
    background-color: #f2f2f2;
  }

  .points-table tbody tr:nth-child(odd) {
    background-color: #fff;
  }

  .points-table th:first-child,
  .points-table td:first-child {
    text-align: center;
    width: 50px;
  }

  .points-table th:last-child,
  .points-table td:last-child {
    text-align: center;
    width: 60px;
  }

  .points-table thead tr {
    border-radius: 10px;
  }

  .points-table td {
    border-bottom: 1px solid #e0e0e0;
  }

  /* Round top corners */
  .points-table thead th:first-child {
    border-top-left-radius: 10px;
  }

  .points-table thead th:last-child {
    border-top-right-radius: 10px;
  }

  h3.div-title 
  {
    color:#DB1C14;
    text-transform:uppercase;
    font-size:34px;
  }

  .perform-stats 
  {
    background:#DB1C14;
    border-radius:25px;
    color:#fff;
    padding-left:20px;
    text-transform:uppercase;
    margin-top:15px;
    transition:linear 0.1s transform;
  }

  .perform-stats:hover 
  {
    transform:scale(1.03);
    transition:linear 0.2s transform;
  }

  .perform-stats img 
  {
    width:100%;
  }

  .perform-stats h4 
  {
    font-size:15px;
    margin-top:20px;
    margin-bottom:0px;
    font-weight:700;
  }

  .perform-stats h3 
  {
    margin-top:0px;
    padding-top:0px;
    font-size:38px;
    color:#FAD955;
  }

  .perform-stats h5 
  {
    margin-top:30px;
    font-size:16px;
  }

  .partners 
  {
    background:#f1f1f1;
    padding:70px 0px;
    margin-top:90px;
  }

  .partners img 
  {
    width:100%;
    transition:linear 0.1s transform;
  }

  .partners img:hover 
  {
    transform:scale(1.05);
    transition:linear 0.2s transform;
  }

  .footer 
  {
    
    background:#ba141a;
    padding:70px 0px;
    color:#fff;
  }

  .footer p 
  {
    font-size:15px;
    line-height:28px;
  }

  .footer-soc a 
  {
    color:#fff;
    margin-right:10px;
    font-size:20px;
  }

  .footer h3 
  {
    font-size:22px;
    text-transform:uppercase;
    margin-top:5px;
  }

  .footer ul 
  {
    margin:0px;
    padding:0px;
    list-style-type:none;
    margin-top:20px;
  }

  .footer ul li a 
  {
    color:#fff;
    display:block;
    padding:0px;
    padding-top:5px;
    margin-top:10px;
  }

  .footer ul li a:before 
  {
    content:'> ';
  }

 p.footer-contact 
  {
    margin-top:20px;
    line-height:22px;
  }

  .footer-credit 
  {
    border-top:solid 1px #777;
    padding-top:30px;
    margin-top:70px;
  }

  .footer-credit a 
  {
    color:#fff;
  }

  .hide-desktop 
  {
    display:none;
  }

  .hide-phone
  {
    display:block;
  }

  .fixture-all-link 
  {
    text-align:center;
  }
  
  .bread-crumb 
  {
      text-align:center;
      padding-top:35px;
      padding-bottom:25px;
      background-image:url('../img/back.png');
      background-size:cover;
      background-attachment:fixed;
  }
  
  .bread-crumb h2, .bread-crumb h1
  {
      text-transform:uppercase;
      font-size:42px;
      
    color:#FFE208;
  }
  
  button.go-back-btn 
  {
      background:none;
      padding:0px;
      color:#DB1C14;
      border:none;
      font-weight:700;
      font-size:14px;
      text-transform:uppercase;
  }
  
  .main-page 
  {
      font-size:16px;
      line-height:28px;
  }
  
  .news-post 
  {
      padding:60px 0px;
  }
  
  .news-post h1 
  {
      font-family:'Poppins', sans-serif;
      font-size:28px;
      font-weight:600;
  }
  
  img.featured-image 
  {
      border-radius:20px;
      width:100%;
      height:auot;
      margin-top:10px;
      margin-bottom:15px;
  }
  
  h3.side-title 
  {
      color:#DB1C14;
      text-transform:uppercase;
  }
  
  .player-profile 
  {
      padding:50px 0px;
  }
  
  .player-profile h1 
  {
      color:#DB1C14;
      font-size:70px;
      text-transform:uppercase;
  }
  
  .player-profile h6 
  {
      color:#DB1C14;
      text-transform:uppercase;
      font-family:'HeadCorps', sans-serif;
      font-size:24px;
  }
  
  .player-profile h5 
  {
      color:#222;
      font-weight:400;
      font-size:17px;
  }
  
  .player-profile p 
  {
      line-height:30px;
  }
  
  .player-profile h2 
  {
      text-align:left;
  }
  
  .stats-num 
  {
      color:#DB1C14;
      font-weight:700;
      font-size:70px;
      font-family:'HeadCorps', sans-serif;
  }
  
  .video-container {
    overflow: hidden;
    position: relative;
    width:100%;
    border-radius:20px;
    margin-top:30px;
}

.video-container::after {
    padding-top: 56.25%;
    display: block;
    content: '';
    border-radius:20px;
}

.video-container iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border-radius:20px;
}
  
.fixture-grid 
{
    border:solid 1px #ddd;
    padding:15px 20px;
    border-radius:20px;
    margin-top:30px;
}

.fixture-grid h5 
{
    float:left;
    margin-right:15px;
}

h4.match-loc 
{
    color:#777;
    font-size:13px;
    text-align:center;
    display:block;
    text-transform:uppercase;
    font-weight:600;
}

.fixture-grid img 
{
    margin:0px auto;
}

h4.team-names 
{
    font-size:11px;
    text-transform:uppercase;
    text-align:center; 
    color:#555;
    margin-top:10px;
    font-weight:600;
}

h4.team-scores 
{
    font-size:17px;
    text-transform:uppercase;
    text-align:center; 
    color:#222;
    margin-top:10px;
    font-weight:700;
}

h3.win-status 
{
    font-size:36px;
}

.collapsed-content {
    max-height: 205px; /* Default visible height */
    overflow: hidden;
    transition: max-height 0.4s ease;
}

.expanded-content {
    max-height: none; /* Show full content */
    transition: max-height 0.4s ease;
}

.btn-less-more 
{
    background:none;
    border:none;
    font-family: "Montserrat", sans-serif;
    text-transform:uppercase;
    padding:0px 25px;
    color:#777;
    margin:-10px;
    font-weight:600;
}

.squad-select 
{
    border:solid 1px #DB1C14;
    border-radius:25px;
    padding:5px 5px;
    color:#DB1C14;
    text-transform:uppercase;
    font-weight:700;
    max-width:300px;
}

.gray-bg 
{
    background:#f1f1f1;
}

.gray-bg h4 
{
    white-space: nowrap;
  overflow: hidden;       /* optional: hides overflow text */
  text-overflow: ellipsis; /* optional: adds "..." when cut */
}

.video-carousel {
    transition: transform 0.5s ease-in-out;
    will-change: transform;
}

.video-item {
    flex: 0 0 calc(33.3333% + 10px);
    max-width: calc(33.3333% + 10px);
    padding-right:30px;
}

.video-arrows 
{
    font-size:24px;
    font-weight:700;
    color:#DB1C14;
}

img.matchday-img 
{
    height:300px;
}

.about-page img 
{
    width:100%;
    border-radius:25px;
    margin-top:15px;
}

.about-page
{
    line-height:28px;
}

.about-page h1, .about-page h2 
{
    color:#DB1C14;
    text-transform:uppercase;
}


.btn-load-more 
{
    padding:10px 30px;
    border-radius:10px;
    background:#DB1C14;
    border:none;
    color:#fff;
    font-family: "Montserrat", sans-serif;
    text-transform:uppercase;
    font-size:14px;
    margin-top:20px;
    transition:linear 0.1s background;
    font-weight:700;
}

.btn-load-more:hover 
{
    background:#FAD955;
    transition:linear 0.2s background;
}




@media (min-width: 768px) {
    .col-five {
        -ms-flex: 0 0 20%;
        flex: 0 0 20%;
        max-width: 20%;
        padding:10px;
    }
}

a.online-btn 
{
    background:#BA141A;
    color:#FAD955 !important;
    border-radius:25px;
    display:inline-block;
    margin-top:-3px;
    margin-left:20px;
    letter-spacing:1px;
}

a.online-btn:hover
{
    font-size:14px;
}
  
.about-slider img 
{
    border-radius:30px;
    width:100%;
    height:540px;
    object-fit:cover;
}

.timeline-about img 
{
    width:100%;
    border-radius:25px;
    height:150px;
    margin-top:15px;
    object-fit:cover;
    border-bottom:solid 3px #BA141A;
}

.about-times h6 
{
    font-size:20px;
    color:#555;
    font-weight:700;
    margin-top:30px;
}

.timeline-about h4 
{
    color:#BA141A;
    font-size:20px;
    margin-top:5px;
    font-weight:700;
    margin-bottom:0px;
    padding-bottom:0px;
}

.timeline-about h5 
{
    font-size:15px;
    margin-top:5px;
    padding-top:0px;
    color:#333;
}

.about-times h3 
{
    color:#BA141A;
    font-family:'Montserrat', sans-serif;
    font-weight:700;
    margin-top:20px;
}

.about-times p 
{
    font-weight:500;
}

.time-single:hover 
{
    transition:linear 0.2s transform;
    transform:scale(1.05);
}

.timeline-about h2 
{
    font-size:16px;
    margin-top:80px;
    color:#BA141A;
}

@media only screen and (max-width: 600px) {

  .hide-desktop 
  {
    display:block;
  }
  
  .col-five {
        -ms-flex: 0 0 50%;
        flex: 0 0 50%;
        max-width: 50%;
        padding:10px;
    }

  .hide-phone
  {
    display:none;
  }

  a.navbar-brand 
  {
    display:block;
  }

  img.main-logo 
  {
    display:none;
  }

  .mobile-logo 
  {
    height:115px;
    margin-top:-10px;
  }
  
  button.go-back-btn
  {
      margin-bottom:10px;
  }
  
  .news-post 
  {
      padding-top:30px;
  }
  
  .news-post h1 
  {
      line-height:26px;
      font-size:22px;
  }
  
  .play-button 
  {
      opacity:0.7;
  }

  .points-table 
  {
    width:calc(100% + 30px);
    margin:0px -15px;
    border-radius:0px;
    margin-bottom:50px;
  }

  .points-table thead th:first-child
  {
    border-radius:0px;
  }

   .points-table thead th:last-child
  {
    border-radius:0px;
  }

  .main-menu 
  {
    padding-top:0px;
    padding-right:5px;
    margin:0px -15px;
    margin-top:-15px;
  }

  .navbar-collapse
  {
    background:#FAD955;
    z-index:3000;
    margin:-20px -35px;
    padding:15px 25px;
    margin-top:-35px;
    padding-left:35px;
    margin-right:-5px;
  }

  .navbar-toggler-icon
  {
    margin-top:-10px;
  }

  .slider h3
  {
    padding-top:7vh;
    font-size:27px;
  }

  .slider h2 
  {
    font-size:62px;
  }

  .first-news 
  {
    margin-top:15px;
  }

  .news-feature img 
  {
    width:40%;
    float:left;
    height:120px;
    margin-right:15px;
    border-radius:15px;
  }

  .news-feature h4 
  {
    padding-top:5px;
    line-height:18px;
    font-size:15px;
  }

  .first-fixtures 
  {
    background:#f1f1f1;
    border-radius:0px;
    margin:0px -15px;
    margin-top:40px;
    box-shadow:none;
  }

  .squad-title {
  font-weight: bold;
  font-size: 16px;
  letter-spacing: 0px;
  text-transform: uppercase;
  text-align:center;
  width:100%;
}

.squad-title h3 
{
  font-size:32px;
  text-align:center;
  display:block;
}

.squad-line {
  display:none;
}

.squad-link {
  display:none !important;
  }

  .back-card
  {
    height:265px;
    width:100%;
  }
  

  .player-card 
  {
    height:207px;
    width:auto !important;
    margin:0px auto !important;
  }
  
  img.marq-back-card 
  {
     height:360px;
     width:100% !important;
     margin-left:0px !important;
  }
  
  img.marq-player-card 
  {
     height:275px;
    width:auto !important;
    margin-left:auto !important;
    margin-right:auto !important;
    margin:0px auto !important;
  }
  
.player-single h3 {
    position: absolute;
    top: 208px;
    width: 100%;
    text-align: center;
    text-transform: uppercase;
    font-size: 23px;
    color:#FFE208;

    /* Ellipsis settings */
    white-space: nowrap;       /* Prevent wrapping */
    overflow: hidden;          /* Hide overflowing text */
    text-overflow: ellipsis;   /* Add "..." at the end */
    padding-left:10px;
    padding-right:10px;
}
.player-single h5 
{
    position:absolute;
    top:235px;
    width:100%;
    text-align:center;
    color:#fff;
    text-transform:uppercase;
    font-size:11px;
    /* Ellipsis settings */
    white-space: nowrap;       /* Prevent wrapping */
    overflow: hidden;          /* Hide overflowing text */
    text-overflow: ellipsis;   /* Add "..." at the end */
    padding-left:15px;
    padding-right:15px;
}

.marq-single h3 
{
    top:280px;
    font-size:30px;
}

.marq-single h5 
{
    top:315px;
}


.player-single 
{
  height:260px;
  margin-top:5px;
}

.marq-single 
{
    height:300px;
}

.player-profile h1 
{
    font-size:50px;
    line-height:50px;
}

.big-video-div 
{
  border-radius:15px;
}

.big-video-div img
{
  border-top-right-radius:15px;
  border-top-left-radius:15px;
  height:200px;
}

.video-feature h4 
{
    font-size:15px;
}

.points-table td
{
  padding:10px 5px;
}

.perform-stats h3 
{
  font-size:32px;
}

.news-feature 
{
  margin-top:15px;
  display:inline-block;
  width:100%;
}

.perform-stats 
{
  border-radius:15px;
}

.footer 
{
  text-align:center;
  padding-top:40px;
  padding-bottom:70px;
  background:#ba141a;
}

.footer a 
{
  font-size:14px;
  color:#FFE208;
  margin:0px 10px;
  text-transform:uppercase;
  margin-top:10px;
  display:inline-block;
  font-weight:600;
}

.footer-credit 
{
  font-size:14px;
  margin-top:30px;
}

.first-fixtures h2 
{
  text-align:center;
  padding-bottom:30px;
  font-size:32px;
}

.fixture-all-link 
{
  padding-top:30px !important;
  padding-bottom:20px !important;
  text-align:center;
  display:inline-block;
}

.squad-team{
  padding-top:50px;
}

.news-page-features img 
{
    width:100%;
    height:200px;
    margin-bottom:10px;
}

.squad-select 
{
    max-width:100%;
}

.squad-header 
{
    display:block;
    width:100%;
}

.gray-bg 
{
    margin-top:15px !important;
}

.player-profile h6 
{
    margin-top:15px;
    padding:0px;
    margin-bottom:0px;
    font-size:22px;
}

.stats-num 
{
    display:block;
    line-height:60px;
    margin-top:15px;
}

.news-main-body 
{
    font-size:15px;
    line-height:28px;
    font-weight:500;
}

#contentBox
{
    font-size:15px;
    line-height:20px;
}

h3.side-title 
{
    font-size:32px;
}

.bread-crumb 
{
    padding-top:20px;
    padding-bottom:15px;
}

.bread-crumb h2, .bread-crumb h1
{
    font-size:28px;
}

.main-menu ul li a
{
    padding-top:10px !important;
    padding-bottom:10px !important;
}
.about-page
{
    line-height:24px;
    font-size:15px;
}

.main-page 
{
    font-size:15px;
    line-height:24px;
}

a.online-btn 
{
    background:#BA141A;
    color:#FAD955 !important;
    border-radius:25px;
    display:inline-block;
    margin-top:10px !important;
    margin-left:20px;
    letter-spacing:1px;
    text-align:center;
    width:90%;
}

.timeline-about img 
{
    width:100%;
    border-radius:15px;
    height:200px;
    margin-top:15px;
    object-fit:cover;
    border-bottom:solid 3px #BA141A;
}

.about-slider img 
{
    height:40vh;
}

.timeline-about h4 
{
    margin-top:10px;
}


}


@media (min-width: 1200px) {
    .container, .container-lg, .container-md, .container-sm, .container-xl {
        max-width: 1390px;
    }
}

/* Timeline base */
.timeline {
  position: relative;
  max-width: 1100px;
  margin: auto;
  padding: 20px 0;
}

/* central vertical line */
.timeline::after {
  content: '';
  position: absolute;
  width: 4px;
  background: #BA141A;
  top: 0;
  bottom: 0;
  left: 50%;
  transform: translateX(-50%);
  z-index: 1;
}

/* timeline item */
.timeline-item {
  position: relative;
  margin: 60px 0;
}

/* central dots */
.timeline-dot {
  position: absolute;
  top: 20px;
  left: 50%;
  transform: translateX(-50%);
  width: 22px;
  height: 22px;
  background: #BA141A;
  border: 4px solid #fff;
  border-radius: 50%;
  z-index: 2;
  box-shadow: 0 0 12px rgba(186,20,26,0.6);
}

/* content box */
.timeline-content {
  background: #fff;
  padding: 25px;
  border-radius: 12px;
  box-shadow: 0px 8px 20px rgba(0,0,0,0.1);
  transition: transform 0.3s ease;
  position: relative;
  z-index: 2;
}
.timeline-content:hover {
  transform: translateY(-5px);
}

/* date style */
.timeline-date {
  font-weight: 800;
  color: #BA141A;
  display: block;
  margin-bottom: 10px;
}

/* images */
.timeline-img {
  border-radius: 25px;
  transition: transform 0.4s ease, box-shadow 0.4s ease;
}

.timeline-img:hover {
  transform: scale(1.05);
  box-shadow: 0 10px 30px rgba(186,20,26,0.4);
}

.timeline-content h4 
{
    font-weight:700;
    font-size:20px;
}

.timeline-content p 
{
    font-size:15px;
    color:#555;
}

/* ==================== */
/* Responsive fix below */
/* ==================== */
@media (max-width: 767.98px) {
  /* move line + dots to the left */
  .timeline::after {
    left: 20px;
  }
  .timeline-dot {
    left: 20px;
  }

  /* force stacked layout */
  .timeline-item .row {
    flex-direction: column !important;
  }

  /* content full width */
  .timeline-item .col-md-6 {
    max-width: 100%;
    flex: 0 0 100%;
    text-align: left !important;
    padding-left: 50px; /* keeps gap from line */
    padding-right: 15px;
    margin-top: 20px;
  }

  .timeline-item img {
    margin-left: 0px; /* aligns with content */
    margin-bottom: 15px;
    width:100%;
    border-radius:25px;
  }
}