body {
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
margin: 0;
padding: 0;
display: flex;
justify-content: center;
}
.container {
width: 500px;
height: 100%;
min-height: 100vh;
background-color: #fff;
border: none; position: relative;
box-shadow: 0px 2px 10px rgba(0, 0, 0, 0.2); }
.cover-photo {
position: relative;
width: 100%;
max-width: 500px;
height: 0;
padding-bottom: 38.2%; overflow: hidden;
}
.cover-image {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
object-fit: cover;
object-position: center;
}
.profile {
position: relative;
}
.profile-overlay {
position: absolute;
bottom: -70px;
left: 50%;
transform: translateX(-50%);
}
.profile-photo {
width: 150px;
height: 150px;
border-radius: 50%;
border: 3.5px solid #fff;
}
.company-logo {
position: absolute;
bottom: 38px;
right: -20px;
width: 45px;
height: 45px;
border-radius: 50%;
border: 3px solid #fff;
background-color: #fff; }
.contact-info {
margin-top: 72px;
}
.name {
margin: 0;
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
font-weight: 620;
font-size: 24px;
line-height: 1.5;
text-align: center;
display: flex;
align-items: center;
justify-content: center;
margin-bottom: 5px; }
.position {
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
font-weight: 580;
font-size: 17px;
line-height: 1.43;
text-align: center;
color: #656565;
word-break: break-word;
margin: 0; margin-bottom: 10px; }
.company {
margin: 0;
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
font-weight: 400;
font-size: 16px;
line-height: 1.43;
text-align: center;
color: #818181;
word-break: break-word;
margin-bottom: 10px; margin-top: 2px; }
.button-container {
display: flex;
justify-content: center;
margin: 22px 0px;
}
.capsule-button {
display: inline-block;
align-items: center;
justify-content: center;
box-sizing: border-box;
background-color: #000;
outline: 0;
border: 0;
margin: 0;
border-radius: 100px;
cursor: pointer;
user-select: none;
vertical-align: middle;
appearance: none;
text-decoration: none;
color: #fff;
font-family: "Roboto", "Helvetica", "Arial", sans-serif;
font-weight: bold;
font-size: 18px;
line-height: 1.4;
padding: 20px 96px;
text-transform: capitalize;
width: fit-content;
margin: 0 auto;
letter-spacing: 0.8px;
}
.capsule-button:hover {
background-color: #808080;
}
.links {
list-style: none;
padding: 0px 20px;
display: flex;
justify-content: center;
flex-wrap: wrap; }
.links li {
margin: 10px;
}
.links li a {
text-decoration: none; }
.links li img {
width: 80px; height: 80px; margin: 0px 8px;
border-radius: 10px;
box-shadow: 0px 2px 10px rgba(0, 0, 0, 0.2);
border-radius: 20px; object-fit: cover;
object-position: center;
}
.link-text {
text-align: center;
margin-top: 1px;
font-size: 12px; font-weight: 300; font-family: -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
color: rgb(28, 28, 28); }