Profile Card — Charles Locko

A simple personal profile card built with HTML and CSS.

Preview

Displays a centered card showing a profile photo, name, title, and location.

Project Structure

project/
├── index.html
├── styles.css
└── Images/
    └── Charles.jpg

Features

• Flexbox layout centered on the page
• Profile image sized to 150px width
• Warm brown background (#d4a373) with dark navy text (#0A192F)
• Bottom border accent in soft purple (#d8cefe)
• Georgia serif font

How to Run

1. Clone or download the project folder
2. Make sure Charles.jpg is inside an Images/ folder one level up (../ID_CARD_MAKING/Images/)
3. Open index.html in any browser — no server needed

Customisation

What	Where
Change name / title / location	index.html — edit the h2, p, h4 tags
Change photo	Replace Charles.jpg in the Images folder
Change colors	styles.css — .main background-color and color
Change card width	styles.css — .main width property

Built With

• HTML5
• CSS3 (Flexbox)