style.css

body {
  font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif;
}

.container {
  padding: 8px;
  font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif;
}

.intro {
  background-color: darkred;
  text-align: center;
  color: white;
  margin: -8px;
  padding: 16px;
}

.photo {
  border-radius: 16px;
  height: 300px;
  width: 300px;
}

.social a {
  text-decoration: none;
}

.socials img {
  height: 40px;
  width: 40px;
  margin: auto 16px;
}

.socials a {
  text-decoration: none;
}

.container > div h2 {
  text-align: center;
}

.about p {
  font-size: 1.5rem;
  line-height: 2rem;
}

.qualifications ol {
  font-size: 1.5rem;
  line-height: 2rem;
}

.hobbies ul {
  font-size: 1.5rem;
  line-height: 2rem;
}

.tech ul {
  font-size: 1.5rem;
  line-height: 2rem;
}
p {
  font-size: 1.5rem;
}

.dynamic-colour {
  color: bisque;
}

.image-row {
  display: flex;
}

.image-row img {
  width: 24%;
  margin: 8px;
  border: 1px;
}

.description {
  text-align: center;
}

h2 {
  text-align: center;
}

#myBtn {
  display: none; /* Hidden by default */
  position: fixed; /* Fixed/sticky position */
  bottom: 20px; /* Place the button at the bottom of the page */
  right: 30px; /* Place the button 30px from the right */
  z-index: 99; /* Make sure it does not overlap */
  border: none; /* Remove borders */
  outline: none; /* Remove outline */
  background-color: red; /* Set a background color */
  color: white; /* Text color */
  cursor: pointer; /* Add a mouse pointer on hover */
  padding: 15px; /* Some padding */
  border-radius: 10px; /* Rounded corners */
  font-size: 18px; /* Increase font size */
}

#myBtn:hover {
  background-color: #555; /* Add a dark-grey background on hover */
}