Long headline to turn your visitors into customers

Accent heading

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.

  • It all came down to this...

    Glossier art party VHS disrupt air plant, a vegan in tattooed of subway tile vaporware. Kinfolk a plaid la whatever pink blush. Kombucha vegan, an ethical selvage air plant greenhouse. I’m baby snackwave.

    2018

  • It all came down to this...

    Glossier art party VHS disrupt air plant, a vegan in tattooed of subway tile vaporware. Kinfolk a plaid la whatever pink blush. Kombucha vegan, an ethical selvage air plant greenhouse. I’m baby snackwave.

    2019

  • It all came down to this...

    Glossier art party VHS disrupt air plant, a vegan in tattooed of subway tile vaporware. Kinfolk a plaid la whatever pink blush. Kombucha vegan, an ethical selvage air plant greenhouse. I’m baby snackwave.

    2020

  • It all came down to this...

    Glossier art party VHS disrupt air plant, a vegan in tattooed of subway tile vaporware. Kinfolk a plaid la whatever pink blush. Kombucha vegan, an ethical selvage air plant greenhouse. I’m baby snackwave.

    2021

  • It all came down to this...

    Glossier art party VHS disrupt air plant, a vegan in tattooed of subway tile vaporware. Kinfolk a plaid la whatever pink blush. Kombucha vegan, an ethical selvage air plant greenhouse. I’m baby snackwave.

    2021

<style>
  
.bm-timeline-14-card:last-child {
	padding-block-end: var(--space-xxl);
}


.bm-timeline-14-card:first-child {
	padding-block-start: var(--space-xxl);
}

/* ODD card styling */
.bm-timeline-14-card:nth-child(odd) {
	grid-column: 2 / -1;
}

.bm-timeline-14-card__date-wrapper {
  	position:relative;
}

.bm-timeline-14-card:nth-child(odd) .bm-timeline-14-card__date-wrapper::before {
	content:'';
  position:absolute;
  width: calc(100% + (var(--grid-gap) * 2)) ;
	height:.1rem;
  bottom: calc(-1 * var(--space-xs));
  left: calc((var(--grid-gap) * 2) * -1 );
  background-color: var(--neutral-dark);
  transition: .5s ease;
}



.bm-timeline-14-card:nth-child(odd):hover .bm-timeline-14-card__date-wrapper::before {
  background-color: var(--neutral-light);
}

.bm-timeline-14-card:nth-child(odd) .bm-timeline-14-card__date-wrapper::after {
	content:'';
  position:absolute;
  width: 0 ;
	height:.2rem;
  bottom: calc(-1 * var(--space-xs));
  left: calc((var(--grid-gap) * 2) * -1 );
  background-color: var(--neutral-dark);
  transition: .5s ease, width 1s;
}

.bm-timeline-14-card:nth-child(odd):hover .bm-timeline-14-card__date-wrapper::after {
  width: calc(100% + (var(--grid-gap) * 2)) ;
}

/* EVEN card styling */
.bm-timeline-14-card:nth-child(even) {
	grid-template-columns: var(--grid-2-3);
  grid-column: 1 / 2;
  transform: translateY(-50%);
}

.bm-timeline-14-card:nth-child(even). bm-timeline-14-card__media {
  order:-1;	
}

.bm-timeline-14-card:nth-child(even) .bm-timeline-14-card__date-wrapper::before {
	content:'';
  position:absolute;
  width: calc(100% + (var(--grid-gap) * 2)) ;
	height:.1rem;
  bottom: calc(-1 * var(--space-xs));
  right: calc((var(--grid-gap) * 2) * -1);
  background-color: var(--neutral-dark);
  transition: .5s ease;
}

.bm-timeline-14-card:nth-child(even):hover .bm-timeline-14-card__date-wrapper::before {
  background-color: var(--neutral-light);
}

.bm-timeline-14-card:nth-child(even) .bm-timeline-14-card__date-wrapper::after {
	content:'';
  position:absolute;
  width: 0 ;
	height:.2rem;
  bottom: calc(-1 * var(--space-xs));
  right: calc((var(--grid-gap) * 2) * -1 );
  background-color: var(--neutral-dark);
  transition: .5s ease, width 1s;
}

.bm-timeline-14-card:nth-child(even):hover .bm-timeline-14-card__date-wrapper::after {
  width: calc(100% + (var(--grid-gap) * 2)) ;
}


@media (max-width:991px) {
		
  /* EVEN card styling */
     .bm-timeline-14-card:nth-child(even) {
        grid-template-columns: var(--grid-1);
      }
  
  /* ODD card styling */
      .bm-timeline-14-card:nth-child(odd) {
        grid-template-columns: var(--grid-1);
      }
	
}

@media (max-width:478px) {
		
  .bm-timeline-14-card {
  	padding-inline-start: calc(var(--grid-gap) * 2);
  }
  
  /* EVEN card styling */
      .bm-timeline-14-card:nth-child(even) {
        grid-column: unset;
        transform: translateY(0%);
      }
  
      .bm-timeline-14-card:nth-child(even) .bm-timeline-14-card__date-wrapper::before,
  		.bm-timeline-14-card:nth-child(even) .bm-timeline-14-card__date-wrapper::after{
				 left: calc((var(--grid-gap) * 2) * -1);
    }
  
  .bm-timeline-14-card:nth-child(even) .bm-timeline-14-card__media {
  order:unset;	
}
  
  /* ODD card styling */
      .bm-timeline-14-card:nth-child(odd) {
        grid-column: unset;
      }
	
}
  
</style>