Borders

<div class="container">
  <div class="profile-card solid-border">
    <img src="https://ik.imagekit.io/d9mvewbju/Course/BigbinaryAcademy/men-avatar%20(1)_VJe2C64nS.jpeg" alt="Profile 1">
    <h2>Steph Curry</h2>
    <p>Web Developer</p>
  </div>
  <div class="profile-card dashed-border">
    <img src="https://ik.imagekit.io/d9mvewbju/Course/BigbinaryAcademy/gentlemen-avatar_xmq1EJDwU.png" alt="Profile 2">
    <h2>Lebron James</h2>
    <p>Graphic Designer</p>
  </div>
  <div class="profile-card dotted-border">
    <img src="https://ik.imagekit.io/d9mvewbju/Course/BigbinaryAcademy/gentlemen-avatar_xmq1EJDwU.png" alt="Profile 3">
    <h2>Klay Thompson</h2>
    <p>Software Engineer</p>
  </div>
  <div class="profile-card double-border">
    <img src="https://ik.imagekit.io/d9mvewbju/Course/BigbinaryAcademy/men-avatar%20(1)_VJe2C64nS.jpeg" alt="Profile 4">
    <h2>Kobe Bryant</h2>
    <p>UI/UX Designer</p>
  </div>
</div>

/* Update code below */
body {
  margin: 0;
  padding: 0;
  font-family: Arial, sans-serif;
  background-color: #f5f5f5;
  display: flex;
  justify-content: center;
  align-items: center;
  min-height: 100vh;
}

.container {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 20px;
  max-width: 1000px;
  margin: 0 auto;
}

.profile-card {
  width: 250px;
  padding: 20px;
  border-radius: 10px;
  box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.1);
  text-align: center;
  transition: transform 0.3s ease;
}

.profile-card:hover {
  transform: translateY(-10px);
}

.profile-card img {
  width: 100px;
  height: 100px;
  object-fit: cover;
  border-radius: 50%;
  margin-bottom: 10px;
}

.solid-border {
  border-width: 2px;
  border-style: solid;
}

.dashed-border {
  border-width: 2px;
  border-style: dashed;
}

.dotted-border {
  border-width: 2px;
  border-style: dotted;
}

.double-border {
  border-width: 4px;
  border-style: double;
}

/* Update code below */
body {
  margin: 0;
  padding: 0;
  font-family: Arial, sans-serif;
  background-color: #f5f5f5;
  display: flex;
  justify-content: center;
  align-items: center;
  min-height: 100vh;
}

.container {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 20px;
  max-width: 1000px;
  margin: 0 auto;
}

.profile-card {
  width: 250px;
  padding: 20px;
  border-radius: 10px;
  box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.1);
  text-align: center;
  transition: transform 0.3s ease;
}

.profile-card:hover {
  transform: translateY(-10px);
}

.profile-card img {
  width: 100px;
  height: 100px;
  object-fit: cover;
  border-radius: 50%;
  margin-bottom: 10px;
}

.solid-border {
  border-width: 2px;
  border-style: solid;
  border-color: #3498db;
}

.dashed-border {
  border-width: 2px;
  border-style: dashed;
  border-color: #e74c3c;
}

.dotted-border {
  border-width: 2px;
  border-style: dotted;
  border-color: #2ecc71;
}

.double-border {
  border-width: 4px;
  border-style: double;
  border-color: #f39c12;
}