html {
    color: #000;
}

body {
  max-width: 480px;
  margin-left: auto;
  margin-right: auto;
  padding-top: 175px;
  font-family: "Noto Sans Mono", monospace;
  font-optical-sizing: auto;
  font-weight: <weight>;
  font-style: normal;
  font-variation-settings:
    "wdth" 100;
}

p {
  font-size:12pt;
}

a, a:visited {
  color: #e97f2b;
  text-decoration-style: double;
  font-style: italic;
}

a#cloudflare::after,
a#vercel::after,
a#mabl::after,
a#acquia::after,
a#linkedin::after {
  content: "";
  width: 11px;
  height: 11px;
  margin-left: 4px;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='currentColor' viewBox='0 0 16 16'%3E%3Cpath fill-rule='evenodd' d='M8.636 3.5a.5.5 0 0 0-.5-.5H1.5A1.5 1.5 0 0 0 0 4.5v10A1.5 1.5 0 0 0 1.5 16h10a1.5 1.5 0 0 0 1.5-1.5V7.864a.5.5 0 0 0-1 0V14.5a.5.5 0 0 1-.5.5h-10a.5.5 0 0 1-.5-.5v-10a.5.5 0 0 1 .5-.5h6.636a.5.5 0 0 0 .5-.5z'/%3E%3Cpath fill-rule='evenodd' d='M16 .5a.5.5 0 0 0-.5-.5h-5a.5.5 0 0 0 0 1h3.793L6.146 9.146a.5.5 0 1 0 .708.708L15 1.707V5.5a.5.5 0 0 0 1 0v-5z'/%3E%3C/svg%3E");
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
  display: inline-block;
}

a:hover {
  text-decoration:underline;
}

.homepage {
  background-image: url("../images/gingerbear.png");
  background-repeat: no-repeat;
  background-position: center 8%;
  color: #36342F;
}

.dark-mode {
  background-color: #170D01 ;
  color: #EEAB30 ;
}

.company {
  color: #eeab30;
}

.company span {
  color: #e97f2b;
  text-decoration-style: dotted;
}

#acquia {
  color: rgba(38, 163, 221, 1);
}

#vercel {
  color: #666;
}

#cloudflare {
  color: rgb(246, 130, 31);
}

#linkedin {
  color: #0073b1;
}

#mabl {
  color: #e84fd9;
}

.footer {
  color: #8B7854;
  padding-top:100px;
}

// <uniquifier>: Use a unique and descriptive class name
// <weight>: Use a value from 100 to 900

.noto-sans-mono-p{
  font-family: "Noto Sans Mono", monospace;
  font-optical-sizing: auto;
  font-weight: <weight>;
  font-style: normal;
  font-variation-settings:
    "wdth" 100;
}
