/* v0.0.1 */

/* ==========================================================================
   Theme color variables
   ========================================================================== */

   :root {
	--theme-primary-color: #990000;
	--theme-primary-text-color: #222;
	--theme-primary-background-color: #FFF;
	--theme-primary-accent-color: #515151;
	--theme-secondary-color: #EEE;
	--theme-secondary-text-color: #FFF;
	--theme-secondary-background-color: #990000;
	--theme-secondary-accent-color: #DDD;
	--theme-tertiary-color: #DDD;
	--theme-tertiary-text-color: #990000;
	--theme-tertiary-background-color: #FFF;
	--theme-tertiary-accent-color: #515151;
	--theme-highlight-text: #b3d4fc;
	color-scheme: light;
  }
  
  /* Dark Color Scheme (System Preference) */
  @media (prefers-color-scheme: dark) {
	:root {
	  --theme-primary-color: #ff3333;
	  --theme-primary-text-color: #FFF;
	  --theme-primary-background-color: #222;
	  --theme-primary-accent-color: #DDD;
	  --theme-secondary-color: #111;
	  --theme-secondary-text-color: #FFF;
	  --theme-secondary-background-color: #5f1111;
	  --theme-secondary-accent-color: #515151;
	  --theme-tertiary-color: #DDD;
	  --theme-tertiary-text-color: #FFF;
	  --theme-tertiary-background-color: #222;
	  --theme-tertiary-accent-color: #515151;
	  --theme-highlight-text: #526377;
	  color-scheme: dark;
	}
  }
  
  /* Fonts */
  /* pt-serif-caption-regular - cyrillic_cyrillic-ext_latin_latin-ext */
  @font-face {
	font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
	font-family: 'PT Serif Caption';
	font-style: normal;
	font-weight: 400;
	src: url('../fonts/pt-serif-caption-v17-cyrillic_cyrillic-ext_latin_latin-ext-regular.eot'); /* IE9 Compat Modes */
	src: url('../fonts/pt-serif-caption-v17-cyrillic_cyrillic-ext_latin_latin-ext-regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
		 url('../fonts/pt-serif-caption-v17-cyrillic_cyrillic-ext_latin_latin-ext-regular.woff2') format('woff2'), /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
		 url('../fonts/pt-serif-caption-v17-cyrillic_cyrillic-ext_latin_latin-ext-regular.woff') format('woff'), /* Chrome 5+, Firefox 3.6+, IE 9+, Safari 5.1+, iOS 5+ */
		 url('../fonts/pt-serif-caption-v17-cyrillic_cyrillic-ext_latin_latin-ext-regular.ttf') format('truetype'), /* Chrome 4+, Firefox 3.5+, IE 9+, Safari 3.1+, iOS 4.2+, Android Browser 2.2+ */
		 url('../fonts/pt-serif-caption-v17-cyrillic_cyrillic-ext_latin_latin-ext-regular.svg#PTSerifCaption') format('svg'); /* Legacy iOS */
  }
  /* pt-serif-caption-italic - cyrillic_cyrillic-ext_latin_latin-ext */
  @font-face {
	font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
	font-family: 'PT Serif Caption';
	font-style: italic;
	font-weight: 400;
	src: url('../fonts/pt-serif-caption-v17-cyrillic_cyrillic-ext_latin_latin-ext-italic.eot'); /* IE9 Compat Modes */
	src: url('../fonts/pt-serif-caption-v17-cyrillic_cyrillic-ext_latin_latin-ext-italic.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
		 url('../fonts/pt-serif-caption-v17-cyrillic_cyrillic-ext_latin_latin-ext-italic.woff2') format('woff2'), /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
		 url('../fonts/pt-serif-caption-v17-cyrillic_cyrillic-ext_latin_latin-ext-italic.woff') format('woff'), /* Chrome 5+, Firefox 3.6+, IE 9+, Safari 5.1+, iOS 5+ */
		 url('../fonts/pt-serif-caption-v17-cyrillic_cyrillic-ext_latin_latin-ext-italic.ttf') format('truetype'), /* Chrome 4+, Firefox 3.5+, IE 9+, Safari 3.1+, iOS 4.2+, Android Browser 2.2+ */
		 url('../fonts/pt-serif-caption-v17-cyrillic_cyrillic-ext_latin_latin-ext-italic.svg#PTSerifCaption') format('svg'); /* Legacy iOS */
  }
  
  /*! HTML5 Boilerplate v8.0.0 | MIT License | https://html5boilerplate.com/ */
  
  /* main.css 3.0.0 | MIT License | https://github.com/h5bp/main.css#readme */
  /*
	* What follows is the result of much research on cross-browser styling.
	* Credit left inline and big thanks to Nicolas Gallagher, Jonathan Neal,
	* Kroc Camen, and the H5BP dev community and team.
	*/
  
  /* ==========================================================================
	  Base styles: opinionated defaults
	  ========================================================================== */
  html {
	color: var(--theme-primary-text-color);
	background: var(--theme-primary-background-color);
	font-size: 1em;
	line-height: 1.4;
  }
  
  /*
	* Remove text-shadow in selection highlight:
	* https://twitter.com/miketaylr/status/12228805301
	*
	* Customize the background color to match your design.
	*/
  
  ::-moz-selection {
	background: var(--theme-highlight-text);
	text-shadow: none;
  }
  
  ::selection {
	background: var(--theme-highlight-text);
	text-shadow: none;
  }
  
  /*
	* A better looking default horizontal rule
	*/
  
  hr {
	display: block;
	height: 1px;
	border: 0;
	border-top: 1px solid var(--theme-primary-accent-color);
	margin: 1em 0;
	padding: 0;
  }
  
  /*
	* Remove the gap between audio, canvas, iframes,
	* images, videos and the bottom of their containers:
	* https://github.com/h5bp/html5-boilerplate/issues/440
	*/
  
  audio,
  canvas,
  iframe,
  img,
  svg,
  video {
	vertical-align: middle;
  }
  
  /*
	* Remove default fieldset styles.
	*/
  
  fieldset {
	border: 0;
	margin: 0;
	padding: 0;
  }
  
  /*
	* Allow only vertical resizing of textareas.
	*/
  
  textarea {
	resize: vertical;
  }
  
  /* ==========================================================================
	Author's custom styles
	========================================================================== */
  
  *,
  *:before,
  *:after {
	box-sizing: border-box;
  }
  
  body {
	color: var(--theme-primary-text-color);
	background: var(--theme-primary-background-color);
	font-family: 'PT Serif Caption', serif;
	margin: 0;
	min-height: 100vh;
	display: flex;
	flex-direction: column;
  }
  body > header {
	flex-grow: 1;
	display: flex;
	flex-direction: column;
	align-items: center;
  }
  body > header h1 {
	position: relative;
	top: 0.5em;
	font-size: 4em;
	white-space: nowrap;
  }
  body > header h1 a {
	text-decoration: none;
  }
  body > footer {
	background: var(--theme-secondary-background-color);
	color: var(--theme-secondary-text-color);
	border-top: 0.5em solid var(--theme-secondary-accent-color);
	margin-top: auto;
	padding: 0.5em 1em;
	text-align: right;
  }
  body > main {
	padding: 1em;
	flex-grow: 1;
	display: flex;
	flex-direction: column;
	align-items: center;
  }
  ul {
	list-style-type: none;
	padding-left: 0;
  }
  li {
	padding: 0.2em 0
  }
  .rawk {
	color: var(--theme-primary-accent-color);
	position: relative;
	top: -0.2em;
	left: 0.4em;
	letter-spacing: -0.1em;
	padding-right: 0.1em;
	z-index: 5;
	opacity: 0.8;
  }
  .star {
	color: var(--theme-primary-color);
	position: relative;
	top: 0.3em;
	left: -0.4em;
	letter-spacing: -0.1em;
	padding-right: 0.1em;
	z-index: 10;
	opacity: 0.8;
  }
  .therawkstar {
	position: relative;
	top: -1em;
	left: -2.5em;
	font-size: 0.8em;
	opacity: 0.2;
  }
  .point {
	position: absolute;
	top: -0.3em;
	left: -0.6em;
	border-right: 0.6em solid transparent;
	border-bottom: 1.4em solid var(--theme-primary-color);
	border-left: 0.6em solid transparent;
  }
  .therawkstar:before, .therawkstar:after {
	content: '';
	position: absolute;
	top: 0.9em;
	left: -2em;
	border-right: 2em solid transparent;
	border-bottom: 1.4em solid var(--theme-primary-color);
	border-left: 2em solid transparent;
	transform: rotate(-35deg);
  }
  .therawkstar:after {
	transform: rotate(35deg);
  }
  
  /* ==========================================================================
	  Helper classes
	  ========================================================================== */
  
  /*
	* Hide visually and from screen readers
	*/
  
  .hidden,
  [hidden] {
	display: none !important;
  }
  
  /*
	* Hide only visually, but have it available for screen readers:
	* https://snook.ca/archives/html_and_css/hiding-content-for-accessibility
	*
	* 1. For long content, line feeds are not interpreted as spaces and small width
	*    causes content to wrap 1 word per line:
	*    https://medium.com/@jessebeach/beware-smushed-off-screen-accessible-text-5952a4c2cbfe
	*/
  
  .visually-hidden {
	border: 0;
	clip: rect(0, 0, 0, 0);
	height: 1px;
	margin: -1px;
	overflow: hidden;
	padding: 0;
	position: absolute;
	white-space: nowrap;
	width: 1px;
	/* 1 */
  }
  
  /*
	* Extends the .visually-hidden class to allow the element
	* to be focusable when navigated to via the keyboard:
	* https://www.drupal.org/node/897638
	*/
  
  .visually-hidden.focusable:active,
  .visually-hidden.focusable:focus {
	clip: auto;
	height: auto;
	margin: 0;
	overflow: visible;
	position: static;
	white-space: inherit;
	width: auto;
  }
  
  /*
	* Hide visually and from screen readers, but maintain layout
	*/
  
  .invisible {
	visibility: hidden;
  }
  
  /*
	* Clearfix: contain floats
	*
	* The use of `table` rather than `block` is only necessary if using
	* `::before` to contain the top-margins of child elements.
	*/
  
  .clearfix::before,
  .clearfix::after {
	content: "";
	display: table;
  }
  
  .clearfix::after {
	clear: both;
  }
  /* ==========================================================================
	  Print styles.
	  Inlined to avoid the additional HTTP request:
	  https://www.phpied.com/delay-loading-your-print-css/
	  ========================================================================== */
  
  @media print {
  
	*,
	*::before,
	*::after {
	  background: var(--secondary-theme-color) !important;
	  color: #000 !important;
	  /* Black prints faster */
	  box-shadow: none !important;
	  text-shadow: none !important;
	}
  
	a,
	a:visited {
	  text-decoration: underline;
	}
  
	a[href]::after {
	  content: " (" attr(href) ")";
	}
  
	abbr[title]::after {
	  content: " (" attr(title) ")";
	}
  
	/*
	  * Don't show links that are fragment identifiers,
	  * or use the `javascript:` pseudo protocol
	  */
	a[href^="#"]::after,
	a[href^="javascript:"]::after {
	  content: "";
	}
  
	pre {
	  white-space: pre-wrap !important;
	}
  
	pre,
	blockquote {
	  border: 1px solid #999;
	  page-break-inside: avoid;
	}
  
	tr,
	img {
	  page-break-inside: avoid;
	}
  
	p,
	h2,
	h3 {
	  orphans: 3;
	  widows: 3;
	}
  
	h2,
	h3 {
	  page-break-after: avoid;
	}
  }