@charset "UTF-8";

/* ---------  FONT DEFINITIONS  ----------- */

@font-face {
  font-family: 'HKGrotesk';
  src: url('../fonts/HKGrotesk-Regular.otf');
  font-weight: 400;
  font-style: normal;
}

@font-face {
  font-family: 'HKGrotesk';
  src: url('../fonts/HKGrotesk-Italic.otf');
  font-weight: 400;
  font-style: italic;
}

@font-face {
  font-family: 'HKGrotesk';
  src: url('../fonts/HKGrotesk-Medium.otf');
  font-weight: 500;
  font-style: normal;
}

@font-face {
  font-family: 'HKGrotesk';
  src: url('../fonts/HKGrotesk-MediumItalic.otf');
  font-weight: 500;
  font-style: italic;
}

@font-face {
  font-family: 'HKGrotesk';
  src: url('../fonts/HKGrotesk-SemiBold.otf');
  font-weight: 600;
  font-style: normal;
}

@font-face {
  font-family: 'HKGrotesk';
  src: url('../fonts/HKGrotesk-SemiBoldItalic.otf');
  font-weight: 600;
  font-style: italic;
}

@font-face {
  font-family: 'HKGrotesk';
  src: url('../fonts/HKGrotesk-Bold.otf');
  font-weight: 700;
  font-style: normal;
}

@font-face {
	font-family: 'HKGrotesk';
	src: url('../fonts/HKGrotesk-BoldItalic.otf');
	font-weight: 700;
	font-style: italic;
}

/* -----  TYPOGRAPHY ------------ */

html {
	color: black;
	font-family: HKGrotesk;
	font-weight: 400;
	font-size: 1em;
	font-display: block !important;
	font-feature-settings: "kern", "liga", "tnum";
	-moz-font-feature-settings: "kern", "liga", "tnum";
	/* Prevent adjustments of font size after orientation changes in IE and iOS. */
	-webkit-text-size-adjust: 100%;
	-ms-text-size-adjust: 100%;
}

@media all and (max-width: 30em) {
	html {
		font-size: 0.75em; /* Decrease the font-size a little-bit for tiny screens */
	}
}

body, h1, h2, h3, h4, h5, h6, ul, ol, figure, pre {
	font-size: 16px;
	line-height: 32px;
	margin: 0 0;
}

/* Headings */
h1, h2, h3, h4, h5, h6, h1 a {
	font-family: HKGrotesk, Helvetica, sans-serif;
	font-weight: 700;
}

b, strong {
	font-weight: 700;
}

.text pre, .text code {
	background-color: #eee;
	font-family: Courier, monospace;
}

/* -----  SELECTION  ----------------- */

::-moz-selection {
	background: yellow;
	color: black;
}

::selection {
	background: yellow;
	color: black;
}

/* ------------ BODY ---------------------*/


pre {
	margin-top: 16px;
	margin-bottom: 16px;
	font-size: 0.9em;
	line-height: 24px;
	white-space: pre-wrap;       /* css-3 */
	white-space: -moz-pre-wrap;  /* Mozilla, since 1999 */
	white-space: -pre-wrap;      /* Opera 4-6 */
	white-space: -o-pre-wrap;    /* Opera 7 */
	word-wrap: break-word;       /* Internet Explorer 5.5+ */
}

gba {
	font-size: 11pt;
}

.masthead {
	text-transform: lowercase;
	overflow-wrap: break-word;
	word-wrap: break-word;
	font-size: 55vw;
	font-weight: 700;
}

.copyright {
	text-transform: uppercase;
	text-align: left;
	font-size: 0.75em;
}

.language ul {
	text-align: center;
}

header.entry-info h2.date, header.post-info h2.date, header.lesson-info h2.date, ul.news-list h2.date, ul.latest-list h2.date {
	/* font-size: 0.8em; */
}

ul.thumbnails li.postlink a h3 {
	word-break: break-word;
	/* font-size: 0.95em !important; */
	line-height: 1.5em;
	text-align: center;
}

@media (min-width:768px) {

	ul.thumbnails li.postlink a h3 {
		/* font-size: 0.95em !important; */
	}
}

/* ##Device = Most of the Smartphones Mobiles (Portrait) ##Screen = B/w 320px to 479px */
@media (min-width: 320px) and (max-width: 479px) and (orientation: portrait) {

	ul.thumbnails li.postlink a h3 {
		font-size: 0.6em !important;
	}
}

select {
	font-family: 'HKGrotesk';
	/* font-size: 1em; */
}


option {
	font-family: 'HKGrotesk';
	/* font-size: 1em; */
}

.footer {
	font-weight: 700;
}

/* ------- BIOGRAPHY -------*/

h1.biography-title {
	text-transform: lowercase;
	font-weight: normal;
}

h1.biography-title::after {
	content: " / ";
	font-weight: bold;
}