.pad-50 {
  padding-top: 50px;
  padding-bottom: 50px;
}

.mb-30 {
  margin-bottom: 30px;
}

#about {
  h2 {
    text-align: center;
    color: var(--theme-primary-color);
    max-inline-size: revert;
  }
  h5 {
    max-inline-size: revert;
    text-wrap: revert;
    color: var(--theme-primary-color);
  }
}

h2 {
  text-align: center;
  max-inline-size: revert;
}

.teams, .organizers {
  display: flex;
  flex-direction: column;
  flex-wrap: wrap;
  height: auto;
  color: var(--theme-primary-color);
  background-color: white;
  #teams, #organizers {
    display: flex;
    flex-wrap: wrap;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    gap: 30px;
    .card {
      width: 284px;
      height: 220px;
      background-color: white;
      border-radius: 12px;
      padding-top: 24px;
      padding-bottom: 24px;
      border-top: 4px solid #E9BA24;
      box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
      display: flex;
      flex-direction: column;
      justify-content: center;
      align-items: center;
      &:hover {
        border-top: 4px solid #011222;
      }
      a {
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: center;
      }
      img {
        max-width: 120px;
        height: 120px;
      }
      div {
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: center;
        width: 100%;
        max-width: 255px;
        padding: 8px;
        h6 {
          text-align: center;
          color: var(--theme-primary-color);
        }
        p {
          color: #4B5563; 
          font-size: 1rem;
          text-align: center;
        }
      }
    }
  }
}

.organizers {
  background-color: #EBF5FF;
  flex-direction: column;
  #organizers {
    .card {
      img {
        border-radius: 50%;
      }
      div {
        p {
          color: #0055A6;
        }
      }
    }
  }
}

#president-address {
  margin-bottom: 50px;
  h2 {
    text-align: center;
    color: var(--theme-secondary-color);
    max-inline-size: revert;
  }
  h6 {
    max-inline-size: revert;
    font-weight: var(--font-weight-5);
    color: var(--theme-primary-color);
    .name {
      color: var(--theme-secondary-color);
    }
  }
  > img {
    width: 200px;
    height: auto;
    border-radius: 12px;
    border: 2px double mediumvioletred;
  }
}

.flex-column {
  display: flex;
  flex-direction: column;
  align-items: center;
}

.flex-row {
  display: flex;
  justify-content: space-evenly;
  align-items: center;
}

.layout-center {
  display: flex;
  justify-content: center;
  box-sizing: border-box;
  background: #011222;
  padding-top: 32px;
  padding-bottom: 32px;
}

.inner-layout-width {
  width: 100%;
  max-width: 926px;
}

.primary-text-color {
  color: var(--theme-secondary-color);
}

.sub-text {
  font-size: 20px;
}