@font-face {
  font-family: 'OpenDyslexicMono';
  src: url(https://onetruesentenc.es/OpenDyslexicMono-Regular.woff2) format('woff');
}

/* Regular */
@font-face {
    font-family: 'OpenDyslexic';
    src: url('https://onetruesentenc.es/OpenDyslexic-Regular.woff2') format('woff2');
    font-weight: 400; /* Normal weight */
    font-style: normal;
    font-display: swap; /* Optional for better performance */
}

/* Bold */
@font-face {
    font-family: 'OpenDyslexic';
    src: url('https://onetruesentenc.es/OpenDyslexic-Bold.woff2') format('woff2');
    font-weight: 700; /* Bold weight */
    font-style: normal;
    font-display: swap;
}

/* Italic */
@font-face {
    font-family: 'OpenDyslexic';
    src: url('https://onetruesentenc.es/OpenDyslexic-Italic.woff2') format('woff2');
    font-weight: 400;
    font-style: italic;
    font-display: swap;
}

/* Bold Italic */
@font-face {
    font-family: 'OpenDyslexico';
    src: url('https://onetruesentenc.es/OpenDyslexic-Bold-Italic.woff2') format('woff2');
    font-weight: 700;
    font-style: italic;
    font-display: swap;
}

.centered {
	text-align: center;
	margin: 0 auto;
	display: block;
}

body {
	font-family: 'OpenDyslexic';
	font-size: 1.45em;
	word-wrap: break-word;
}

h1, h2, h3 {
	line-height: 1.4em;
}

p, ul, li {
	line-height: 2em;
}

code { 
	font-family: 'OpenDyslexicMono';
	-webkit-border-radius: 4px;
	-moz-border-radius: 4px;
	border-radius: 4px;
	padding: .25em;
}

@media (prefers-color-scheme: light) {
	h1, h2, h3, { color: black; }
	code { background-color: rgb(255, 241, 191); }
	a {
   color: #0054ff;
   border-bottom-color: #0054ff;
   border-bottom: 2px solid;
   text-decoration-line: none;
   font-weight: bold;
  }
  a:hover,
  a:active {
  	color: #0054ff;
  	border-bottom-color: transparent;
  }

  a:visited {
      color: #0054ff;
      border-bottom: 2px solid #0054ff;
  }
  a:visited:hover {
    color: #000;
    border-bottom: 2px solid #000;
    border-bottom-color: transparent;
		text-decoration-line: none;
  }
}

@media (prefers-color-scheme: dark) {  
  body { background-color: rgb(20, 20, 20); /*#141414*/ }
  h1, h2, h3 { 
		/* color: #080; */
  	color: #7547ad;
  	/* color: #ad4747; */
  	/* color: #ad476d; */
  	/* color: #e0e054; */
  	/* color: #226bff; */
  }
  p, ul {	color: #226bff; /*#91caff*/ /*#9abbff*/ /*#75a1fb*/ /*#ccc*/ }
  code {
  	background: #453c2b !important;
  	color: #faf785 !important;
  	-webkit-border-radius: 50%;
		-moz-border-radius: 50%;
		border-radius: 50%;
  }
  a {
   color: #75a1fb;
   border-bottom-color: #75a1fb;
   border-bottom: 2px solid;
   text-decoration-line: none;
   font-weight: bold;
  }
  a:hover,
  a:active {
  	color: #75a1fb;
  	border-bottom-color: transparent;
  }

  a:visited {
      color: #75a1fb;
      border-bottom: 2px solid #75a1fb;
  }
  a:visited:hover {
    color: #faf785;
    border-bottom: 2px solid #faf785;
    border-bottom-color: transparent;
		text-decoration-line: none;
  }
}