style.css

body {
  font-family: nunito;
  margin: 0;
  padding-left: 0rem;
}

header {
  text-align: left;
  font-style: italic;
  margin-left: 8.5vw;
  font-size: 90%;
  font-weight: normal;
}

main {
  font-size: 200%;
  text-align: left;
  margin-bottom: 5rem;
  margin-left: 8.5vw;
  margin-top: 4rem;
  font-weight: normal;
  line-height: 1.15;
}

em {
  font-style: normal;
  font-weight: Bold;
  font-size: 120%
}

.advert {
  text-align: center;
  justify-content: center;
  align-items: center;
  margin-left: -8.5vw;
  line-height: 1;
  font-size: 50%;
}

.signal:link {color: #90F2FB;} .signal:hover {filter: brightness(75%);} .signal:visited {color: #90F2FB;}

.email:link {color: #90F2FB;} .email:hover {filter: brightness(75%);} .email:visited {color: #90F2FB;}

footer {
  text-align: center;
  justify-content: center;
  align-items: center;
  line-height: 1;
}

img {
  width: 25px; /* Adjust width as needed */
  height: 25px; /* Adjust height as needed */
  filter: brightness(0) contrast(200);
  image-rendering: optimizeSpeed; /* Force rasterization */
  transform: scale(1.2) scale(1/1.2); /* Render at 2x, scale down to 0.5x */
  object-fit: cover;
}

@keyframes grow {
  from { transform: scale(1); }
  to { transform: scale(1.2); }
}

img:hover {
	animation: grow 0.3s ease-in-out;
	animation-fill-mode: forwards;
	filter: none;
}

icons {
  display: flex; /* Or arrange as desired */
}

name {
  font-family: 'Open Sans', sans-serif;
  font-size: 80%;
  font-weight: normal;
  text-align: center;
  margin-top: 1rem;
  filter: brightness(100%);
}

@font-face {
  font-family: 'nunito';
  src: url('Nunito-Regular.ttf') format('truetype');  /* Include additional formats for wider compatibility */
		font-weight: normal; /* Optional: specify font weight */
		font-stype: normal;  /* Optional: specify font style */
}

@font-face {
  font-family: 'nunito';
  src: url('Nunito-Bold.ttf') format('truetype');
		font-weight: Bold;
		font-style: normal;
}

@font-face {
	font-family: 'nunito';
	src: url('Nunito-BoldItalic.ttf') format('truetype');
		font-weight: normal;
		font-style: italic;
}

:root {
  --background-color: #fff; /* Light mode background color */
  --text-color: #000; /* Light mode text color */
}

/* Styles for dark mode */
@media (prefers-color-scheme: dark) {
  :root {
    --background-color: #181A1B;
    --text-color: #fff;
  }
  
  body {
    background-color: var(--background-color);
    color: var(--text-color);
  }
  
  /* Apply dark mode styles to other elements */
}

/* Default styles for light mode */
body {
  background-color: var(--background-color);
  color: var(--text-color);
}

/* Apply light mode styles to other elements */

a {
	text-decoration: none;
}