/*  ==========================================================================
   
    FRAMEWERK
    A system created to fill a specific need that follows a certain way of 
    thinking and adheres to a naming convention that really only makes sense 
    to its author, semantics be damned. "Why not use Bootstrap?", you may think. 
    This may as well be, to be fair. If you found your way here, well, abandon 
    all hope. If this makes sense to you, in the words of Owen Wilson, "Wow". 

    Version: 1
    Create Date: 09/2021
    Modify Date: 
   
    ====================================
    
    TABLE OF CONTENTS

    Desktop
      
    Tablet (max-width: 768.98px)
      
    Mobile (max-width: 414.98px)
      

    ==================


    ==========================================================================  */


/*  ==========================================================================
    
    ==========================================================================  */

/* Vertical Timeline */
.timeline {align-self: center;}

.timeline-inner {background: linear-gradient(#DDDDDD, #DDDDDD) no-repeat center/.07875em 100%;}

.timeline-inner hr {
    height: .07875em;
    border-top: .07875em solid #DDD;
    margin: .07875em 0;
  }

.timeline-inner .card {margin-top: -20%;}
/* Vertical Timeline */




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

  /*  ==========================================================================
   
   ==========================================================================  */
  
  

}

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

  /*  ==========================================================================
   
   ==========================================================================  */
  /* Vertical Timeline */
    .timeline-inner .card {margin-top: 0;}
  /* Vertical Timeline */
  

}

@media only screen and (min-width: 35em) {
  /* Style adjustments for viewports that meet the condition */
}