:root {
    /**
     * colors
     */
  
    --ultramarine-blue_10: hsla(235, 70%, 60%, 0.1);
    --ultramarine-blue: hsl(235, 70%, 60%);
    --orange-peel_10: hsla(36, 100%, 55%, 0.1);
    --space-cadet_20: hsla(248, 32%, 23%, 0.2);
    --space-cadet_80: hsla(247, 35%, 19%, 0.8);
    --space-cadet-2: hsl(247, 35%, 19%);
    --old-lavender: hsl(251, 9%, 46%);
    --orange-peel: hsl(36, 100%, 55%);
    --tart-orange: hsl(0, 100%, 63%);
    --light-gray: hsl(0, 0%, 80%);
    --cultured-1: hsl(0, 0%, 96%);
    --cultured-2: hsl(0, 0%, 93%);
    --coral_10: hsla(14, 95%, 66%, 0.1);
    --white_10: hsla(0, 0%, 100%, 0.1);
    --black_80: hsla(0, 0%, 0%, 0.8);
    --pumpkin: hsl(26, 98%, 49%);
    --white: hsl(0, 0%, 100%);
  
    /**
     * typography
     */
  
    --ff-urbanist: 'Urbanist', sans-serif;
  
    --fs-1: 4rem;
    --fs-2: 3.2rem;
    --fs-3: 2.4rem;
    --fs-4: 2rem;
    --fs-5: 1.8rem;
    --fs-6: 1.4rem;
  
    --fw-500: 500;
    --fw-600: 600;
    --fw-700: 700;
    --fw-800: 800;
  
    /**
     * spacing
     */
  
    --section-padding: 80px;
  
    /**
     * box shadow
     */
  
    --shadow-1: 0 8px 20px hsla(0, 0%, 0%, 0.06);
    --shadow-2: 0px 4px 10px hsla(0, 0%, 0%, 0.05);
  
    /**
     * border radius
     */
  
    --radius-4: 4px;
    --radius-6: 6px;
  
    /**
     * transition
     */
  
    --transition-1: 0.25s ease;
    --transition-2: 0.5s ease;
    --cubic-in: cubic-bezier(0.51, 0.03, 0.64, 0.28);
    --cubic-out: cubic-bezier(0.33, 0.85, 0.4, 0.96);
  }

.table {
/*    width: 70%;*/
    margin-bottom: 1rem;
    color: #212529;
    padding-right: 2px;
  }

.table th,
.table td {
  padding: 0.75rem;
  vertical-align: top;
  border-top: 1px solid #dee2e6;
}

.table thead th {
    vertical-align: bottom;
    border-bottom: 2px solid #dee2e6;
  }
  
.table tbody + tbody {
    border-top: 2px solid #dee2e6;
  }

  .header-action-btn2 {
    background-color: var(--white);
    color: var(--ultramarine-blue);
    padding: 12px 13px;
    width: max-content;
    border-radius: var(--radius-4);
    box-shadow: var(--shadow-1);
  }

  .header-action-btn1 {
    background-color: var(--white);
    color: var(--ultramarine-blue);
    padding: 12px 13px;
    width: 70%;
    border-radius: var(--radius-4);
    box-shadow: var(--shadow-1);
  }

  .login-btn {
    display: flex;
    align-items: center;
    gap: 8px;
    background-color: var(--ultramarine-blue);
    color: var(--white);
    min-height: 50px;
    padding-inline: 25px;
    font-weight: var(--fw-700);
    transition: var(--transition-1);

    margin-bottom: 5px;
  }

  .form-field {
    background-color: var(--white);
    color: inherit;
    height: 40px;
    width: 88%;
    padding-inline: 25px 20px;
    border-radius: var(--radius-6);
    margin-block-end: 10px;
  }

  .about-banner3{
    background-color: var(--ultramarine-blue);
    max-width: 79%;
    aspect-ratio: 450 / 590;
    margin-block-end: 10px;
    float: right;
  }