@ou-imdt/css/src/native/a.css

The IMDT CSS library styles native elements with light, extendable CSS. It is developed for Interactive Media Developers at the Open University.

:root,
:host {

  /* Links */
  --a-bg: transparent;
  --a-color: #1F55A5;
  --a-decoration: underline;
  --a-cursor: pointer;

  --a-visited-color: var(--core1);
  --a-visited-decoration: underline;

  --a-focus-color: var(--core1);
  --a-focus-decoration: underline;
  /* --a-focus-outline: var(); */

  --a-hover-color: var(--core1);
  --a-hover-decoration: underline;

  --a-active-color: #163B73;
  --a-active-decoration: underline;

  --a-focus-visible-color: var(--core1);
  --a-focus-visible-decoration: underline;
  --a-focus-visible-outline: 2px solid var(--core1);
  --a-focus-visible-shadow: 0 0 0 2px #000000;
  --a-focus-visible-bg: #FDF289;
}


a {
  color: var(--a-color);
  text-decoration: var(--a-decoration);
  cursor: var(--a-cursor);
}

a:visited {
  color: var(--a-visited-color, var(--a-color));
  text-decoration: var(--a-visited-decoration, var(--a-decoration));
}

a:focus {
  color: var(--a-focus-color, var(--a-color));
  text-decoration: var(--a-focus-decoration, var(--a-decoration));
  outline: var(--a-focus-outline);
}

a:focus-visible {
  background: var(--a-focus-visible-bg);
  color: var(--a-focus-visible-color, var(--a-color));
  text-decoration: var(--a-focus-visible-decoration, var(--a-decoration));
  outline: var(--a-focus-visible-outline);
  box-shadow: var(--a-focus-visible-shadow);
}

a:hover {
  color: var(--a-hover-color, var(--a-color));
  text-decoration: var(--a-hover-decoration, var(--a-decoration));
}

a:active {
  color: var(--a-active-color, var(--a-color));
  text-decoration: var(--a-active-decoration, var(--a-decoration));
}