diff --git a/about.html b/about.html
index c857084..ed39491 100644
--- a/about.html
+++ b/about.html
@@ -13,7 +13,7 @@
     <title>Access Granted | About Us </title>
 </head>
 
-<body class="relative" style="background-color: #fcd9cb;">
+<body class="relative body-background">
 	<a href="#main-content" class="d-none">Skip to main content</a>
 
 	<header class="fixed-top">
@@ -128,21 +128,21 @@ <h5 class="offcanvas-title" id="offcanvasWithBothOptionsLabel">Accessibility Set
 	  <main class="container my-5">
 		<section>
 		  <div class="row align-items-center">
+			<div class="col-md-6">
+				<h2>Our Mission</h2>
+				<p>
+				  Our mission is to create a more inclusive, accessible world for everyone.
+				<br>
+				<br>
+				  We are a team of passionate developers dedicated to bring innovative solutions and foster a community built on values of collaboration and empathy.
+				</p>
+			</div>
 			<div class="col-md-6 mb-4 mb-md-0">
 			  <img src="assets/images/locky.webp" alt="Our Team" class="img-fluid rounded" height="400" width="400">
 			</div>
-			<div class="col-md-6">
-			  <h2>Our Mission</h2>
-			  <p>
-				Our mission is to create a more inclusive, accessible world for everyone.
-			  <br>
-			  <br>
-				We are a team of passionate developers dedicated to bring innovative solutions and foster a community built on values of collaboration and empathy.
-			  </p>
-			</div>
+
 		  </div>
 		</section>
-	  <main class="container my-5">
 		<section>
 			<h2 class="text-center mb-4">Meet Our Team</h2>
 			<div class="row g-4">
@@ -158,14 +158,16 @@ <h5 class="card-title">Vernell Clark</h5>
 								</div>
 							</div>
 							<div class="flip-card-back">
-								<div class="card-body">
-									<p>SCRUM Leader</p>
-									<a href="https://github.com/VCGithubCode" class="btn btn-outline-secondary btn-sm me-2" target="_blank" rel="noopener noreferrer">
-										<i class="bi bi-github"></i> GitHub
-									</a>
-									<a href="https://www.linkedin.com/in/vernell-clark-swe/" class="btn btn-outline-secondary btn-sm" target="_blank" rel="noopener noreferrer">
-										<i class="bi bi-linkedin"></i> LinkedIn
-									</a>
+								<div class="card-body d-flex flex-column align-items-center justify-content-center text-center">
+									<p>Project Management & Coordination</p>
+									<div class="d-flex justify-content-center gap-2">
+										<a href="https://github.com/VCGithubCode" class="btn btn-dark btn-sm" target="_blank" rel="noopener noreferrer">
+											<i class="bi bi-github"></i> GitHub
+										</a>
+										<a href="https://www.linkedin.com/in/vernell-clark-swe/" class="btn btn-outline-primary btn-sm linkedin" target="_blank" rel="noopener noreferrer">
+											<i class="bi bi-linkedin"></i> LinkedIn
+										</a>
+									</div>
 								</div>
 							</div>
 						</div>
@@ -176,21 +178,23 @@ <h5 class="card-title">Vernell Clark</h5>
 					<div class="card shadow-lg text-center flip-card">
 						<div class="flip-card-inner">
 							<div class="flip-card-front">
-								<img src="assets/images/avatars/Nikola.webp" class="card-img-top" alt="Nikola Simic">
+								<img src="assets/images/avatars/Nicola.webp" class="card-img-top" alt="Nikola Simic">
 								<div class="card-body">
 									<h5 class="card-title">Nikola Simic</h5>
 									<p class="card-text">Voice Assistant</p>
 								</div>
 							</div>
 							<div class="flip-card-back">
-								<div class="card-body">
-									<p>Voice Assistant</p>
-									<a href="https://github.com/nlekkerman" class="btn btn-outline-secondary btn-sm me-2" target="_blank" rel="noopener noreferrer">
-										<i class="bi bi-github"></i> GitHub
-									</a>
-									<a href="https://linkedin.com/" class="btn btn-outline-secondary btn-sm" target="_blank" rel="noopener noreferrer">
-										<i class="bi bi-linkedin"></i> LinkedIn
-									</a>
+								<div class="card-body d-flex flex-column align-items-center justify-content-center text-center">
+									<p>Voice Interface Development</p>
+									<div class="d-flex justify-content-center gap-2">
+										<a href="https://github.com/nlekkerman" class="btn btn-dark btn-sm" target="_blank" rel="noopener noreferrer">
+											<i class="bi bi-github"></i> GitHub
+										</a>
+										<a href="https://www.linkedin.com/in/nikola-simic-674862110/" class="btn btn-outline-primary btn-sm linkedin" target="_blank" rel="noopener noreferrer">
+											<i class="bi bi-linkedin"></i> LinkedIn
+										</a>
+									</div>
 								</div>
 							</div>
 						</div>
@@ -204,18 +208,20 @@ <h5 class="card-title">Nikola Simic</h5>
 								<img src="assets/images/avatars/Ben.webp" class="card-img-top" alt="Benjamin Schäfer">
 								<div class="card-body">
 									<h5 class="card-title">Benjamin Schäfer</h5>
-									<p class="card-text">Research & Page Layout & Presentation</p>
+									<p class="card-text">Page Layout & Presentation</p>
 								</div>
 							</div>
 							<div class="flip-card-back">
-								<div class="card-body">
-									<p>Research & Page Layout & Presentation</p>
-									<a href="https://github.com/benschaf" class="btn btn-outline-secondary btn-sm me-2" target="_blank" rel="noopener noreferrer">
-										<i class="bi bi-github"></i> GitHub
-									</a>
-									<a href="https://www.linkedin.com/in/beni-schaefer/" class="btn btn-outline-secondary btn-sm" target="_blank" rel="noopener noreferrer">
-										<i class="bi bi-linkedin"></i> LinkedIn
-									</a>
+								<div class="card-body d-flex flex-column align-items-center justify-content-center text-center">
+									<p>UX Design & Research</p>
+									<div class="d-flex justify-content-center gap-2">
+										<a href="https://github.com/benschaf" class="btn btn-dark btn-sm" target="_blank" rel="noopener noreferrer">
+											<i class="bi bi-github"></i> GitHub
+										</a>
+										<a href="https://www.linkedin.com/in/beni-schaefer/" class="btn btn-outline-primary btn-sm linkedin" target="_blank" rel="noopener noreferrer">
+											<i class="bi bi-linkedin"></i> LinkedIn
+										</a>
+									</div>
 								</div>
 							</div>
 						</div>
@@ -229,18 +235,20 @@ <h5 class="card-title">Benjamin Schäfer</h5>
 								<img src="assets/images/avatars/Angela.webp" class="card-img-top" alt="Angela Siniavskaja">
 								<div class="card-body">
 									<h5 class="card-title">Angela Siniavskaja</h5>
-									<p class="card-text">ReadMe & Documentation Lead</p>
+									<p class="card-text">Documentation Lead</p>
 								</div>
 							</div>
 							<div class="flip-card-back">
-								<div class="card-body">
-									<p>Project lead and git/github expert</p>
-									<a href="https://github.com/Angela-Sin" class="btn btn-outline-secondary btn-sm me-2" target="_blank" rel="noopener noreferrer">
-										<i class="bi bi-github"></i> GitHub
-									</a>
-									<a href="https://www.linkedin.com/in/angela-siniavskaja-a4500a22b/" class="btn btn-outline-secondary btn-sm" target="_blank" rel="noopener noreferrer">
-										<i class="bi bi-linkedin"></i> LinkedIn
-									</a>
+								<div class="card-body d-flex flex-column align-items-center justify-content-center text-center">
+									<p>Documentation & Content Strategy</p>
+									<div class="d-flex justify-content-center gap-2">
+										<a href="https://github.com/Angela-Sin" class="btn btn-dark btn-sm" target="_blank" rel="noopener noreferrer">
+											<i class="bi bi-github"></i> GitHub
+										</a>
+										<a href="https://www.linkedin.com/in/angela-siniavskaja-a4500a22b/" class="btn btn-outline-primary btn-sm linkedin" target="_blank" rel="noopener noreferrer">
+											<i class="bi bi-linkedin"></i> LinkedIn
+										</a>
+									</div>
 								</div>
 							</div>
 						</div>
@@ -258,14 +266,16 @@ <h5 class="card-title">Ashraf Bocktor</h5>
 								</div>
 							</div>
 							<div class="flip-card-back">
-								<div class="card-body">
-									<p>Produce Avatars</p>
-									<a href="https://github.com/PATH-HIVE" class="btn btn-outline-secondary btn-sm me-2" target="_blank" rel="noopener noreferrer">
-										<i class="bi bi-github"></i> GitHub
-									</a>
-									<a href="https://www.linkedin.com/in/abbocktor/" class="btn btn-outline-secondary btn-sm" target="_blank" rel="noopener noreferrer">
-										<i class="bi bi-linkedin"></i> LinkedIn
-									</a>
+								<div class="card-body d-flex flex-column align-items-center justify-content-center text-center">
+									<p>Avatar Design & Creative Direction</p>
+									<div class="d-flex justify-content-center gap-2">
+										<a href="https://github.com/PATH-HIVE" class="btn btn-dark btn-sm" target="_blank" rel="noopener noreferrer">
+											<i class="bi bi-github"></i> GitHub
+										</a>
+										<a href="https://www.linkedin.com/in/abbocktor/" class="btn btn-outline-primary btn-sm linkedin" target="_blank" rel="noopener noreferrer">
+											<i class="bi bi-linkedin"></i> LinkedIn
+										</a>
+									</div>
 								</div>
 							</div>
 						</div>
@@ -279,18 +289,20 @@ <h5 class="card-title">Ashraf Bocktor</h5>
 								<img src="assets/images/avatars/Alison.webp" class="card-img-top" alt="Alison Mossop">
 								<div class="card-body">
 									<h5 class="card-title">Alison Mossop</h5>
-									<p class="card-text">404 Page</p>
+									<p class="card-text">Error Page</p>
 								</div>
 							</div>
 							<div class="flip-card-back">
-								<div class="card-body">
-									<p>Project lead and git/github expert</p>
-									<a href="https://github.com/ali-moss-24" class="btn btn-outline-secondary btn-sm me-2" target="_blank" rel="noopener noreferrer">
-										<i class="bi bi-github"></i> GitHub
-									</a>
-									<a href="https://www.linkedin.com/in/alison-mossop-4658a5253/" class="btn btn-outline-secondary btn-sm" target="_blank" rel="noopener noreferrer">
-										<i class="bi bi-linkedin"></i> LinkedIn
-									</a>
+								<div class="card-body d-flex flex-column align-items-center justify-content-center text-center">
+									<p>Error Page Design & User Engagement</p>
+									<div class="d-flex justify-content-center gap-2">
+										<a href="https://github.com/ali-moss-24" class="btn btn-dark btn-sm" target="_blank" rel="noopener noreferrer">
+											<i class="bi bi-github"></i> GitHub
+										</a>
+										<a href="https://www.linkedin.com/in/alison-mossop-4658a5253/" class="btn btn-outline-primary btn-sm linkedin" target="_blank" rel="noopener noreferrer">
+											<i class="bi bi-linkedin"></i> LinkedIn
+										</a>
+									</div>
 								</div>
 							</div>
 						</div>
@@ -302,20 +314,22 @@ <h5 class="card-title">Alison Mossop</h5>
 						<div class="flip-card-inner">
 							<div class="flip-card-front">
 								<img src="assets/images/avatars/James.webp" class="card-img-top" alt="James Bracken">
-								<div class="card-body">
+								<div class="card-body d-flex flex-column align-items-center justify-content-center">
 									<h5 class="card-title">James Bracken</h5>
 									<p class="card-text">Footer & Support</p>
 								</div>
 							</div>
 							<div class="flip-card-back">
-								<div class="card-body">
-									<p>Footer & Support</p>
-									<a href="https://github.com/JamesBracken" class="btn btn-outline-secondary btn-sm me-2" target="_blank" rel="noopener noreferrer">
-										<i class="bi bi-github"></i> GitHub
-									</a>
-									<a href="https://linkedin.com/in/" class="btn btn-outline-secondary btn-sm" target="_blank" rel="noopener noreferrer">
-										<i class="bi bi-linkedin"></i> LinkedIn
-									</a>
+								<div class="card-body d-flex flex-column align-items-center justify-content-center text-center">
+									<p>Site Navigation & Support Features</p>
+									<div class="d-flex justify-content-center gap-2">
+										<a href="https://github.com/JamesBracken" class="btn btn-dark btn-sm" target="_blank" rel="noopener noreferrer">
+											<i class="bi bi-github"></i> GitHub
+										</a>
+										<a href="https://www.linkedin.com/in/christopher-bracken-0b7263314/" class="btn btn-outline-primary btn-sm linkedin" target="_blank" rel="noopener noreferrer">
+											<i class="bi bi-linkedin"></i> LinkedIn
+										</a>
+									</div>
 								</div>
 							</div>
 						</div>
@@ -326,30 +340,30 @@ <h5 class="card-title">James Bracken</h5>
 					<div class="card shadow-lg text-center flip-card">
 						<div class="flip-card-inner">
 							<div class="flip-card-front">
-								<img src="assets/images/avatars/Vernell.webp" class="card-img-top" alt="Ahmad Al Hindi">
+								<img src="assets/images/avatars/Ahmad.webp" class="card-img-top" alt="Ahmad Al Hindi">
 								<div class="card-body">
 									<h5 class="card-title">Ahmad Al Hindi</h5>
 									<p class="card-text">About Page</p>
 								</div>
 							</div>
 							<div class="flip-card-back">
-								<div class="card-body">
-									<p>Project lead and git/github expert</p>
-									<a href="https://github.com/Ahmadalhindi" class="btn btn-outline-secondary btn-sm me-2" target="_blank" rel="noopener noreferrer">
-										<i class="bi bi-github"></i> GitHub
-									</a>
-									<a href="https://www.linkedin.com/in/ahmad-al-hindi-899877108/" class="btn btn-outline-secondary btn-sm" target="_blank" rel="noopener noreferrer">
-										<i class="bi bi-linkedin"></i> LinkedIn
-									</a>
+								<div class="card-body d-flex flex-column align-items-center justify-content-center text-center">
+									<p>Content Creation & Page Design</p>
+									<div class="d-flex justify-content-center gap-2">
+										<a href="https://github.com/Ahmadalhindi" class="btn btn-dark btn-sm" target="_blank" rel="noopener noreferrer">
+											<i class="bi bi-github"></i> GitHub
+										</a>
+										<a href="https://www.linkedin.com/in/ahmad-al-hindi-899877108/" class="btn btn-outline-primary btn-sm linkedin" target="_blank" rel="noopener noreferrer">
+											<i class="bi bi-linkedin"></i> LinkedIn
+										</a>
+									</div>
 								</div>
 							</div>
 						</div>
 					</div>
 				</div>
-
 			</div>
 		</section>
-	  </main>
 	</main>
 
 	<footer class="text-muted py-5">
diff --git a/assets/css/style.css b/assets/css/style.css
index ae18648..a940047 100644
--- a/assets/css/style.css
+++ b/assets/css/style.css
@@ -547,6 +547,25 @@ nav li {
   text-align: center;
 }
 
+/* About page background */
+.body-background {
+  background-image: url('../images/shiny1.webp');
+  background-position: bottom center;
+  background-size: cover;
+  background-repeat: no-repeat;
+  height: 100vh;
+  position: relative;
+}
+
+/* Linkedin buttons */
+.linkedin {
+  background: #0d6efd;
+  color: #ffffff;
+} 
+
+.linkedin:hover {
+  background: #ffffff;
+  color: #0d6efd;
 
 /* Error-background */
 .error-background {
@@ -564,7 +583,6 @@ nav li {
   border-radius: 12px;
   padding: 1em; 
   font-weight: 900;
-  
 }
 
 /* Responsiveness */
@@ -596,4 +614,4 @@ nav li {
   .flip-card-front img {
     height: 150px;
   }
-}
\ No newline at end of file
+}
diff --git a/assets/images/avatars/Ahmad.jpg b/assets/images/avatars/Ahmad.jpg
deleted file mode 100644
index e33949e..0000000
Binary files a/assets/images/avatars/Ahmad.jpg and /dev/null differ
diff --git a/assets/images/avatars/Nicola.webp b/assets/images/avatars/Nicola.webp
new file mode 100644
index 0000000..d057b21
Binary files /dev/null and b/assets/images/avatars/Nicola.webp differ
diff --git a/assets/images/readme./body.png b/assets/images/readme/body.png
similarity index 100%
rename from assets/images/readme./body.png
rename to assets/images/readme/body.png
diff --git a/assets/images/readme./colorblind.png b/assets/images/readme/colorblind.png
similarity index 100%
rename from assets/images/readme./colorblind.png
rename to assets/images/readme/colorblind.png
diff --git a/assets/images/readme./contrast.png b/assets/images/readme/contrast.png
similarity index 100%
rename from assets/images/readme./contrast.png
rename to assets/images/readme/contrast.png
diff --git a/assets/images/readme./dislecsic.png b/assets/images/readme/dislecsic.png
similarity index 100%
rename from assets/images/readme./dislecsic.png
rename to assets/images/readme/dislecsic.png
diff --git a/assets/images/readme./dyslecsik.png b/assets/images/readme/dyslecsik.png
similarity index 100%
rename from assets/images/readme./dyslecsik.png
rename to assets/images/readme/dyslecsik.png
diff --git a/assets/images/readme./main.png b/assets/images/readme/main.png
similarity index 100%
rename from assets/images/readme./main.png
rename to assets/images/readme/main.png
diff --git a/assets/images/readme./mobile.png b/assets/images/readme/mobile.png
similarity index 100%
rename from assets/images/readme./mobile.png
rename to assets/images/readme/mobile.png
diff --git a/assets/images/readme./resourses.png b/assets/images/readme/resourses.png
similarity index 100%
rename from assets/images/readme./resourses.png
rename to assets/images/readme/resourses.png
diff --git a/assets/images/readme./responcive.png b/assets/images/readme/responcive.png
similarity index 100%
rename from assets/images/readme./responcive.png
rename to assets/images/readme/responcive.png
diff --git a/assets/images/readme./side-bar.png b/assets/images/readme/side-bar.png
similarity index 100%
rename from assets/images/readme./side-bar.png
rename to assets/images/readme/side-bar.png
diff --git a/assets/images/readme./voice-asistant.png b/assets/images/readme/voice-asistant.png
similarity index 100%
rename from assets/images/readme./voice-asistant.png
rename to assets/images/readme/voice-asistant.png
diff --git a/assets/images/readme./voice.png b/assets/images/readme/voice.png
similarity index 100%
rename from assets/images/readme./voice.png
rename to assets/images/readme/voice.png
