p {
  text-align: justify;
}

.abstract {
  text-align: justify;
}

.grid-layout {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
  gap: 20px;
  padding: 20px;
}

.grid-item {
  text-align: center; /* Centers the content: images, names, and bios */
  padding-bottom: 20px; /* Adds space below each grid item */
}

.grid-item img {
  display: block;
  margin: 0 auto; /* Centers the image horizontally */
  margin-bottom: 10px; /* Adds space directly below the image */
}

.grid-item a {
  color: #1DA1F2; /* Twitter's brand color, can be changed */
  text-decoration: none; /* Optional: removes underline from links */
  font-weight: bold; /* Makes the Twitter handle bold */
}

.grid-item img.twitter-icon {
  height: 1em; /* Sets the icon's height relative to the font size */
  width: auto; /* Maintains the aspect ratio of the icon */
  vertical-align: middle; /* Aligns the icon with the text */
  margin-right: 5px; /* Space between the icon and text */
}

.grid-item a, .grid-item a img {
  display: inline;
  vertical-align: middle; /* Keeps text and image aligned in the middle */
}



.grid-item a, .grid-item a img, .grid-item span {
  display: inline;
  vertical-align: middle; /* Ensures everything is aligned in the middle */
}

.grid-item img.twitter-icon, .grid-item img.ltu-logo {
  height: 1em; /* Sets initial icon size relative to font */
  width: auto; /* Maintains aspect ratio */
  margin-right: 5px; /* Space between icon and text */
}

.grid-item .ltu-logo {
  height: 1.5em; /* Larger size for the LTU logo */
  width: auto; /* Maintains aspect ratio */
  margin-right: 5px; /* Space between the logo and the link text */
}



.grid-item a, .grid-item a img, .grid-item span {
  display: inline;
  vertical-align: middle; /* Ensures vertical alignment in the middle */
}

.grid-item img.twitter-icon, .grid-item img.ltu-logo, .grid-item img.linkedin-logo {
  height: 1em; /* Consistent size for all icons */
  width: auto; /* Maintains aspect ratio */
  margin-right: 5px; /* Space between icon and text */
}

.grid-item .linkedin-logo {
  height: 1.5em; /* Slightly larger, can be adjusted */
}







/* Center the header specifically on the SPEEDS Team page */
.speeds-team-page h1 {
  margin-top: 5px;
  text-align: center;
}
.speeds-team-page h2,
.speeds-team-page h3,
.speeds-team-page h4,
.speeds-team-page h5,
.speeds-team-page h6 {
  text-align: center;
}

/* Set maximum width for the entire page content and center it */
.speeds-team-page {
  max-width: 900px; 
  margin: 0 auto; /* Centers the content on the page */
}

/* Adjust grid layout */
.speeds-team-page .grid-layout {
  display: block;
}

/* Center all content within each grid item */
.speeds-team-page .grid-item {
  text-align: center;
}

/* Justify paragraphs within each grid item */
.speeds-team-page .grid-item p {
  max-width: 100%; /* Ensures it spans the full width of .speeds-team-page */
  text-align: justify;
  margin: 0 auto;
}

/* Display social links in a row with spacing */
.speeds-team-page .grid-item .social-links {
  display: flex;
  justify-content: center;
  gap: 10px;
}

.speeds-team-page .social-links a {
  margin-right: 10px;
}

.speeds-team-page .social-links a:last-child {
  margin-right: 0;
}

/* Ordered list styling for grid items */
.speeds-team-page .grid-item ol {
  list-style-position: inside; /* Places the number inside the list item */
  padding-left: 25px; /* Adds slight indentation for ordered list */
  margin-left: 0; /* Removes extra margin */
  text-align: justify; /* Justifies the text within each list item */
  max-width: 100%; /* Ensures it spans the full width of .speeds-team-page */
}

.speeds-team-page .grid-item ol li {
  text-align: justify; /* Ensures justification for each list item */
  margin-bottom: 10px; /* Adds space between items */
}

/* Style bold text and add colon within ordered list items */
.speeds-team-page .grid-item ol li strong {
  font-weight: bold;
  margin-right: 5px; /* Adds a small space between the bold text and the colon */
}

.speeds-team-page .grid-item ol li strong::after {
  content: ": ";
}

/* Inline display for additional text in list items */
.speeds-team-page .grid-item ol li span {
  display: inline;
}

/* Center the name/title under the image */
.speeds-team-page .grid-item .name-title {
  text-align: center;
  margin-top: 10px; 
}

/* Adjust vertical spacing between each person's block */
.speeds-team-page .grid-item {
  text-align: center;
  margin-bottom: 50px; 
}








/* Reset default padding and margin for html and body */
html, body {
  margin: 0;
  padding: 0;
  height: 100%;
}

/* About page layout */
.about-page {
  max-width: 850px;
  margin: 0 auto;
  text-align: center;
}

/* Center the header specifically on the About page */
.about-page h1 {
  margin-top: 5px;
  text-align: center;
}

/* GitHub and Gmail link styling */
.github-link {
  display: inline-flex; /* Display icons inline with space between them */
  gap: 50px; /* Space between the icons */
  align-items: center;
  margin-top: 20px;
  text-decoration: none;
}

.about-page ul {
    text-align: left;
    margin-left: 20px;
}

.about-page h2 {
    border: none;
}

.about-page h2 {
    margin-bottom: 0.5px;
}














/* Center the header specifically on the LTU Master of Sport Analytics page */
.ltu-msa-page h1 {
  margin-top: 5px;
  text-align: center;
}