/* ============================================================
   VARIÁVEIS CSS (Custom Properties)
   ============================================================ */
:root {
	--color-primary: #7100ff;
	--color-primary-light: #cea4eb;
	--color-secondary: #efb102;
	--color-dark: #000000;
	--color-light: #ffffff;
	--color-text: #333333;
	--color-text-light: #c1c2c3;
	--color-text-muted: rgba(0, 0, 0, 0.6);
	--color-border: #dadada;
	--color-border-light: #f2f2f2;
	--color-bg-light: #f5f5f5;
	--color-code: #615576;
	--color-success: #00ff44;
	--color-highlight: #ff0;

	--font-primary: courier, courier new, serif;
	--font-sans: sans-serif;

	--spacing-xs: 0.125rem;
	--spacing-sm: 0.25rem;
	--spacing-md: 0.625rem;
	--spacing-lg: 1rem;
	--spacing-xl: 1.875rem;
	--spacing-2xl: 3.125rem;

	--transition-base: all 0.25s ease;
	--transition-fast: all 0.2s;
	--transition-slower: all 0.5s;
	--transition-smooth: all 200ms 100ms cubic-bezier(0, 0.6, 0.4, 1);

	--border-radius-sm: 0.188rem;
	--border-radius-md: 0.313rem;
	--border-radius-full: 50%;

	--max-width-content: 1100px;
	--max-width-post: 50rem;
	--max-width-wide: 800px;
}

/* ============================================================
   RESET & NORMALIZAÇÃO
   ============================================================ */
html {
	font-family: var(--font-sans);
	-ms-text-size-adjust: 100%;
	-webkit-text-size-adjust: 100%;
}

body {
	margin: 0;
	left: 0;
	right: 0;
}

html,
body {
	height: 100%;
}

html,
body {
	height: 100%;
}

* {
	box-sizing: border-box;
}

*,
*:before,
*:after {
	box-sizing: border-box;
}

body {
	margin: auto;
}

a,
aside,
.overlay,
body {
	transition: var(--transition-base);
}

/* ============================================================
   ELEMENTOS SEMÂNTICOS
   ============================================================ */
article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
main,
nav,
section,
summary {
	display: block;
}

audio,
canvas,
progress,
video {
	display: inline-block;
	vertical-align: baseline;
}

audio:not([controls]) {
	display: none;
	height: 0;
}

[hidden],
template {
	display: none;
}

figure {
	margin: 1em 40px;
}

/* ============================================================
   TIPOGRAFIA
   ============================================================ */
@font-face {
	font-family: 'Open Sans';
	font-style: normal;
	font-weight: 300;
	src: local('Open Sans Light'), local('OpenSans-Light'), url("https://fonts.gstatic.com/s/opensans/v10/DXI1ORHCpsQm3Vp6mXoaTRampu5_7CjHW5spxoeN3Vs.woff2") format('woff2');
}

@font-face {
	font-family: 'Open Sans';
	font-style: normal;
	font-weight: 800;
	src: local('Open Sans Extrabold'), local('OpenSans-Extrabold'), url("https://fonts.gstatic.com/s/opensans/v10/EInbV5DfGHOiMmvb1Xr-hiYtBUPDK3WL7KRKS_3q7OE.woff2") format('woff2');
}

a {
	background: transparent;
	-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
	text-decoration: none;
}

a:active,
a:hover {
	outline: 0;
}

a:link {
	color: inherit;
}

abbr[title] {
	border-bottom: 1px dotted;
}

b,
strong {
	font-weight: bold;
}

dfn {
	font-style: italic;
}

mark {
	background: var(--color-highlight);
	color: var(--color-dark);
}

small {
	font-size: 80%;
}

sub,
sup {
	font-size: 75%;
	line-height: 0;
	position: relative;
	vertical-align: baseline;
}

sup {
	top: -0.5em;
}

sub {
	bottom: -0.25em;
}

code,
kbd,
pre,
samp {
	font-family: 'Monaco', 'Consolas', 'Menlo', monospace;
	font-size: 1em;
}

h1,
h2,
h3,
h4 {
	font-family: var(--font-primary);
	font-weight: 800;
	font-style: normal;
	margin: 0;
}

h1 {
	font-size: 1em;
	margin: 0.67em 0;
}

/* ============================================================
   IMAGENS & MÍDIA
   ============================================================ */
img {
	border: 0;
	max-width: 100%;
	height: auto;
	display: block;
}

svg:not(:root) {
	overflow: hidden;
}

svg {
	fill: currentColor;
}

/* ============================================================
   FORMULÁRIOS & INPUTS
   ============================================================ */
button,
input,
optgroup,
select,
textarea {
	color: inherit;
	font: inherit;
	margin: 0;
}

button {
	overflow: visible;
	cursor: pointer;
}

button,
select {
	text-transform: none;
}

button,
html input[type="button"],
input[type="reset"],
input[type="submit"] {
	-webkit-appearance: button;
	cursor: pointer;
}

button[disabled],
html input[disabled] {
	cursor: default;
}

button::-moz-focus-inner,
input::-moz-focus-inner {
	border: 0;
	padding: 0;
}

input {
	line-height: normal;
}

input[type="checkbox"],
input[type="radio"] {
	box-sizing: border-box;
	padding: 0;
}

input[type="number"]::-webkit-inner-spin-button,
input[type="number"]::-webkit-outer-spin-button {
	height: auto;
}

input[type="search"] {
	-webkit-appearance: textfield;
	-ms-box-sizing: content-box;
	box-sizing: content-box;
}

input[type="search"]::-webkit-search-cancel-button,
input[type="search"]::-webkit-search-decoration {
	-webkit-appearance: none;
}

fieldset {
	border: 1px solid #c0c0c0;
	margin: 0 2px;
	padding: 0.35em 0.625em 0.75em;
}

legend {
	border: 0;
	padding: 0;
}

textarea {
	overflow: auto;
}

optgroup {
	font-weight: bold;
}

/* ============================================================
   TABELAS
   ============================================================ */
table {
	display: table;
	width: 100%;
	border-collapse: collapse;
}

tr {
	display: table-row;
}

td,
th {
	display: table-cell;
	vertical-align: top;
}

th.idiom {
	font-size: 1.5rem;
}

tbody#posts-idiom {
	vertical-align: top;
}

.talks-table {
	width: 50%;
	max-width: var(--max-width-wide);
	border-collapse: collapse;
	margin: 1rem auto;
}

.talks-table th, .talks-table td {
	border: 1px solid #ccc;
	padding: 0.5rem;
	text-align: left;
	font-family: courier, courier new, serif;
	font-weight: 300;
	font-size: 1.125rem;
	line-height: 1.5;
}

.talks-table th {
	background-color: #f2f2f2;
	font-weight: 800;
}

.talks-table tr:nth-child(even) {
	background-color: #f9f9f9;
}

/* Mobile: transformar tabela em blocos empilhados para evitar overflow */
@media (max-width: 600px) {
	.talks-table {
		width: 100%;
		border: 0;
	}

	.talks-table thead {
		display: none; /* esconder cabeçalho */
	}

	.talks-table tbody,
	.talks-table tr {
		display: block;
		width: 100%;
		margin-bottom: 0.75rem;
		background: transparent;
		border: 1px solid var(--color-border-light);
		border-radius: var(--border-radius-sm);
		padding: 0.35rem;
	}

	.talks-table td {
		display: flex;
		justify-content: space-between;
		align-items: flex-start;
		padding: 0.4rem 0.5rem;
		border: 0;
		border-bottom: 1px dashed var(--color-border);
		white-space: normal;
		font-size: 1rem;
	}

	.talks-table td:last-child {
		border-bottom: 0;
	}

	/* rótulos à esquerda usando nth-child — não requer alteração no HTML */
	.talks-table td:nth-child(1):before { content: "Event"; font-weight: 700; margin-right: .5rem; }
	.talks-table td:nth-child(2):before { content: "Year"; font-weight: 700; margin-right: .5rem; }
	.talks-table td:nth-child(3):before { content: "Title"; font-weight: 700; margin-right: .5rem; }

	.talks-table td:before {
		display: inline-block;
		min-width: 5.5rem;
		color: var(--color-text-muted);
	}

	.talks-table td a {
		display: inline-block;
		text-decoration: none;
		color: inherit;
		overflow-wrap: anywhere;
		word-break: break-word;
		max-width: calc(100% - 6rem);
		text-align: right;
	}
}

/* Ajustes finos de tipografia para manter alinhamento em mobile */
@media (max-width: 600px) {
	.talks-table td,
	.talks-table th {
		font-size: 0.95rem;
		line-height: 1.35;
	}

	.talks-table td a {
		font-size: 0.95rem;
		line-height: 1.35;
	}
}

@media (max-width: 420px) {
	.talks-table td,
	.talks-table th {
		font-size: 0.9rem;
		line-height: 1.25;
	}

	.talks-table td a {
		font-size: 0.9rem;
		line-height: 1.25;
	}

	.talks-table td:before {
		min-width: 4.5rem; /* reduz espaço reservado para rótulos */
	}
}

/* ============================================================
   TALKS TABLE — RESPONSIVIDADE
   Ajustes para evitar overflow horizontal em telas pequenas
   ============================================================ */
.talks-table {
	table-layout: auto;
	max-width: 100%;
}

.talks-table th,
.talks-table td {
	white-space: normal; /* permitir quebra de linha dentro das células */
}

.talks-table td a {
	overflow-wrap: anywhere; /* quebra URLs longas quando necessário */
	word-break: break-word;
}

@media (max-width: 900px) {
	.talks-table {
		width: 100%;
		margin: 0.75rem auto;
	}

	.talks-table th,
	.talks-table td {
		padding: 0.5rem 0.625rem;
		font-size: 1rem;
		line-height: 1.4;
	}
}

@media (max-width: 420px) {
	/* Em telas muito pequenas, reduzir espaçamentos para caber melhor */
	.talks-table th,
	.talks-table td {
		padding: 0.4rem 0.5rem;
		font-size: 0.95rem;
	}
}

/* ============================================================
   ELEMENTOS DE LISTA
   ============================================================ */
hr {
	box-sizing: content-box;
	height: 0;
	border: 1px solid var(--color-border-light);
	margin: 50px auto;
}

/* ============================================================
   ANIMAÇÕES
   ============================================================ */
@-webkit-keyframes animateGradient {
	0% {
		background-position: 100% 90%;
	}
	99% {
		background-position: 0% 90%;
	}
	100% {
		background-position: 0% 90%;
		background-size: 200% 7px;
	}
}

@keyframes animateGradient {
	0% {
		background-position: 100% 90%;
	}
	99% {
		background-position: 0% 90%;
	}
	100% {
		background-position: 0% 90%;
		background-size: 200% 7px;
	}
}

@-webkit-keyframes pulse {
	0%,
	100% {
		opacity: 1;
	}
	50% {
		opacity: 0.7;
	}
}

@keyframes pulse {
	0%,
	100% {
		opacity: 1;
	}
	50% {
		opacity: 0.7;
	}
}

/* ============================================================
   COMPONENTES: NAVEGAÇÃO
   ============================================================ */
.nav {
	display: flex;
	flex-wrap: wrap;
	padding-left: 0;
	margin-bottom: 0;
	list-style: none;
}

.nav-link {
	display: block;
	color: var(--color-dark);
	padding: 0.5rem 1rem;
	transition: var(--transition-base);
}

.nav-link:focus,
.nav-link:hover {
	text-decoration: none;
	background-color: var(--color-primary-light);
}

.nav-item {
	margin-bottom: -1px;
}

.nav-menu {
	background-color: var(--color-bg-light);
}

.ul-menu {
	display: flex;
	justify-content: center;
	margin-top: 20px;
}

/* ============================================================
   COMPONENTES: ÍCONES
   ============================================================ */
.icons-home {
	text-align: center;
}

.icons-home a {
	display: inline-block;
	padding: 0.938rem;
	margin: 0.125rem;
	border-radius: var(--border-radius-full);
	border: var(--spacing-xs) solid var(--color-dark);
	line-height: 0;
	transition: var(--transition-base);
}

.icons-home a .icon {
	fill: var(--color-dark);
	width: 18px;
	height: 18px;
}

.icons-home a:hover {
	background: var(--color-primary-light);
}

.icons-home a:hover .icon {
	fill: var(--color-dark);
}

.icon-menu {
	cursor: pointer;
	padding: 0.313rem;
	border-radius: var(--border-radius-sm);
	background: var(--color-dark);
	width: 2.5rem;
	height: 2.5rem;
	fill: var(--color-light);
}

.icon-search {
	width: 2.188rem;
	height: 2.188rem;
}

.icon-arrow-menu {
	vertical-align: bottom;
	width: 18px;
	height: 15px;
}

/* ============================================================
   COMPONENTES: BOTÕES & CONTROLES
   ============================================================ */
.slideButton,
.dosearch {
	position: absolute;
	display: block;
	width: 40px;
	height: 40px;
	top: 10px;
	z-index: 31;
}

.slideButton {
	left: 10px;
}

.dosearch {
	right: 10px;
	background: var(--color-dark);
	border-radius: var(--border-radius-sm);
	padding: var(--spacing-xs) 0.188rem;
}

a.slideButton,
.dosearch {
	cursor: pointer;
}

a.slideButton.slide {
	pointer-events: none;
}

.down {
	position: absolute;
	bottom: 50px;
	width: 100%;
	display: block;
	text-align: center;
}

.down .icon {
	position: absolute;
	-webkit-transform-style: preserve-3d;
	transform-style: preserve-3d;
	top: 50%;
	left: 50%;
	-webkit-transform: translate(-50%, -50%);
	transform: translate(-50%, -50%);
	width: 100px;
	height: 100px;
	fill: var(--color-light);
	-webkit-animation: pulse 1.3s infinite;
	animation: pulse 1.3s infinite;
}

aside {
	position: fixed;
	height: 163px;
	width: 100%;
	bottom: -100%;
	background: #7100ff;
	z-index: 20;
	box-shadow: inset -10px -1px 15px -9px rgba(0, 0, 0, 0.5);
}

aside li {
	margin: 0;
	list-style-type: none
}

aside ul {
	margin: 0;
	padding: 0
}

aside #topmenu {
	background-color: #000000;
	border: 2px solid #000000;
	*zoom: 1;
}

aside #topmenu:before,
aside #topmenu:after {
	content: '';
	display: table
}

aside #topmenu:after {
	clear: both
}

aside #topmenu ul {
	*zoom: 1;
	float: left;
	clear: none;
	text-align: inherit;
	width: 63.95%;
	margin-left: 0%;
	margin-right: 3%;
}

aside #topmenu ul:before,
aside #topmenu ul:after {
	content: '';
	display: table
}

aside #topmenu ul:after {
	clear: both
}

aside #topmenu ul:last-child {
	margin-right: 0%
}

aside #topmenu ul:nth-child(2) {
	*zoom: 1;
	float: left;
	clear: none;
	text-align: inherit;
	width: 33.05%;
	margin-left: 0%;
	margin-right: 3%;
	display: none;
	text-align: right;
}

aside #topmenu ul:nth-child(2):before,
aside #topmenu ul:nth-child(2):after {
	content: '';
	display: table
}

aside #topmenu ul:nth-child(2):after {
	clear: both
}

aside #topmenu ul:nth-child(2):last-child {
	margin-right: 0%
}

aside #topmenu ul:nth-child(2) li:first-child {
	background: transparent;
}

aside #topmenu ul:nth-child(2) li:first-child span {
	background: transparent;
	border-radius: 0;
	color: #fff;
	width: 45px
}

aside #topmenu ul:nth-child(2) li:nth-child(2) {
	padding-left: 20px;
	padding-right: 20px
}

aside #topmenu ul:nth-child(2) li:nth-child(3) {
	margin-right: -10px;
	padding-left: 10px
}

aside #topmenu ul li {
	-webkit-transform: skewx(-20deg);
	transform: skewx(-20deg);
	padding: 3px 4px 6px 4px;
	background: #000000;
	display: inline-block;
}

aside #topmenu ul li:first-child {
	background: #efb102;
	padding: 4px 10px 4px 20px;
	margin-left: -10px;
}

aside #topmenu ul li:first-child span {
	border-radius: 100%;
	width: 20px;
	height: 20px;
	text-align: center;
	background-color: #000;
	color: #efb102;
	font-weight: 300
}

aside #topmenu ul li:nth-child(3) {
	background: #7100ff;
	padding-right: 30px;
	padding-left: 30px;
}

aside #topmenu ul li:nth-child(3) span {
	color: #fff
}

aside #topmenu ul li span {
	-webkit-transform: skewx(20deg);
	transform: skewx(20deg);
	display: block;
	font-family:courier, courier new, serif;
	font-weight: 800;
	font-style: normal;
	font-size: .813rem;
	color: #7100ff;
}

aside nav ul {
	padding: 10px 0 0 10px;
	float: left;
	margin-right: 80px;
}

aside nav ul .counter-menu {
	color: #fff;
	font-weight: 800;
	margin-right: 4px
}

aside nav ul a {
	width: 100%;
	cursor: pointer;
	text-decoration: none;
	font-family:courier, courier new, serif;
	font-weight: 300;
	font-style: normal;
	color: #00ff44;
}

aside nav ul a:hover {
	background: #fff;
	color: #cea4eb;
}

aside.slide {
	bottom: 0
}

a.slideButton.slide {
	pointer-events: none
}

.overlay {
	position: fixed;
	width: 100%;
	height: 100%;
	bottom: 0;
	left: 0;
	pointer-events: none;
	background: transparent;
	z-index: 30;
}

.overlay.slide {
	pointer-events: auto;
	bottom: 162px;
	background: rgba(0, 0, 0, 0.6)
}

input[type="search"] {
	-ms-box-sizing: content-box;
	box-sizing: content-box;
	-webkit-appearance: textfield
}

input[type="search"]::-webkit-search-decoration,
input[type="search"]::-webkit-search-cancel-button {
	-webkit-appearance: none
}

.search-wrapper {
	-webkit-transform: translateY(-400px);
	transform: translateY(-400px);
	z-index: 9999;
}

.search-wrapper.active {
	-webkit-transform: translateY(0);
	transform: translateY(0)
}

.search-form {
	position: relative;
	top: 0;
	-webkit-transform: translateX(-200px);
	transform: translateX(-200px);
	z-index: 9999;
	width: 100%;
	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
	filter: alpha(opacity=0);
	opacity: 0;
	transition: all 200ms 100ms cubic-bezier(0, .6, .4, 1);
}

.search-form h4 {
	margin: .625rem 0
}

.search-form .search-field {
	width: 100%;
	font-family:courier, courier new, serif;
	font-weight: 300;
	font-style: normal;
	font-size: 1.625rem;
	color: #fff;
	background-color: transparent;
	border: 0;
	border-bottom: 1px solid #fff;
	border-radius: 0;
	box-shadow: none;
	background-clip: padding-box;
	-webkit-appearance: none;
}

.search-form .search-field:focus {
	outline: 0;
	box-shadow: none
}

.search-form.active {
	top: 0;
	-webkit-transform: translateX(0);
	transform: translateX(0);
	-ms-filter: none;
	-webkit-filter: none;
	filter: none;
	opacity: 1
}

.search-form.hidden {
	display: none
}

.search-form .icon-remove-sign {
	position: absolute;
	top: 0;
	right: 0;
	z-index: 1;
	display: block;
	fill: #fff;
	width: 30px;
	height: 30px;
	text-align: center;
	cursor: pointer
}

.search-form::-webkit-input-placeholder {
	font-size: 1.625rem
}

.search-form .search-field::-webkit-search-decoration,
.search-form .search-field::-webkit-search-cancel-button,
.search-form .search-field::-webkit-search-results-button,
.search-form .search-field::-webkit-search-results-decoration {
	display: none
}

.search-form .search-list {
	position: absolute;
	width: 100%;
	font-family:courier, courier new, serif;
	font-weight: 300;
	font-style: normal
}

.search-form h4,
.search-form li,
.search-form p,
.search-form a,
.search-form a:hover {
	color: #fff
}

body.search-overlay {
	overflow: hidden;
}

body.search-overlay:after {
	position: absolute;
	top: 0;
	left: 0;
	z-index: 9001;
	width: 100%;
	height: 100%;
	min-height: 100%;
	background-color: rgba(0, 0, 0, 0.6);
	content: '';
}

.search-wrapper {
	position: absolute;
	top: 50px;
	width: 100%;
	padding-right: 10%;
	padding-left: 10%;
}

.search-wrapper *zoom 1:after,
.search-wrapper *zoom 1:before {
	display: table;
	line-height: 0;
	content: ""
}

.search-wrapper *zoom 1:after {
	clear: both
}

.search-wrapper:before,
.search-wrapper:after {
	display: table;
	line-height: 0;
	content: ""
}

.search-list {
	padding: 0;
	margin: 0;
	list-style-type: none;
}

.search-list .entry-date {
	float: right;
	display: none;
	font-size: 14px;
	text-transform: uppercase
}

.search-list a {
	text-decoration: none;
	display: block;
	padding: .938rem 0;
	width: 100%;
	border-bottom: 1px solid #fff;
}

.search-list a:hover {
	color: #cea4eb;
	border-bottom: 1px solid #b3b3b3
}

.tags {
	margin-top: 1.875rem;
}

.tags a {
	font-size: .875rem;
	color: #000000;
	display: inline-block;
	border: 1px solid #000000;
	border-radius: .313rem;
	padding: .25rem .625rem;
	margin-right: .125rem;
	margin-bottom: .5rem;
	text-decoration: none;
}

.tags a:hover {
	color: #cea4eb;
	border: 1px solid #cea4eb
}

.img-rounded {
	border-radius: 50%
}

html,
body {
	height: 100%
}

.header-site,
.page-header {
	background: #ffffff;
	min-height: 100vh;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 2rem 0;
}

.header-site .content,
.page-header .content {
	width: 75%;
	max-width: 1100px;
	position: relative;
	-webkit-transform: none;
	transform: none;
	top: auto;
	left: auto;
	text-align: center;
	box-sizing: border-box;
	margin: 0 auto;
}

.header-post {
	background: #000000;
  	min-height: 0vh;
}

.header-site li {
	margin-left: 30px;
	list-style-type: none;
	font-size: 1.2rem;
	font-family: courier, courier new, serif;
	font-weight: bolder;
}

.ul-menu {
	display: flex;
	justify-content: center;
	margin-top: 20px;
}

.header-site .person img {
	width: 130px;
	height: 130px;
	border-radius: 100%;
	display: block;
	margin: 0 auto;
}

.header-site .recent {
	*
	zoom: 1;
	width: auto;
	max-width: 600px;
	float: none;
	display: block;
	margin-right: auto;
	margin-left: auto;
	padding-left: 0;
	padding-right: 0;
}

.header-site .recent:before,
.header-site .recent:after {
	content: '';
	display: table
}

.header-site .recent:after {
	clear: both
}

.header-site .recent p {
	text-align: left;
	color: #000000;
	font-family: courier, courier new, serif;
	font-size: 1.2rem;
}

.header-site .recent a {
	text-decoration: none;
}

.header-site .recent a h2 {
	text-align: left;
	margin: 0;
	font-weight: 300;
	font-size: 1.2rem;
	border-bottom: 1px solid #000000;
}

.header-site .recent a h2:hover {
	background: #cea4eb;
}

.header-site h1,
.header-site h2 {
	color: #000000;
	text-align: center
}

.header-site .site-title {
	font-size: 2rem;
	line-height: 1;
	display: block;
	-webkit-font-variant-ligatures: none;
	-moz-font-variant-ligatures: none;
	font-variant-ligatures: none;
	letter-spacing: 0px;
}

.site-occupation {
	font-size: 1.2rem;
}

.header-site .site-description {
	font-size: 1.2rem;
	display: block;
	margin: 1.5rem 0;
}

.header-post {
	height: 60px;
}

.header-post-nav {
	display: flex;
	gap: 2rem;
	align-items: center;
	justify-content: center;
	height: 100%;
	padding: 0 1rem;
}

/* Header-post nav responsivo: empilha e reduz fonte em telas pequenas */
@media (max-width: 600px) {
	.header-post-nav {
		flex-direction: column;
		gap: 0.35rem;
		padding: 0.5rem 0.75rem;
	}

	.header-post-nav a {
		padding: 0;
		width: 100%;
		text-align: center;
	}

	.header-post-nav a p {
		margin: 0;
		font-size: 0.95rem;
		line-height: 1.2;
		white-space: nowrap;
		overflow: hidden;
		text-overflow: ellipsis;
	}

	header.header-post {
		height: auto;
		padding: 0.5rem 0;
	}
}

@media (max-width: 420px) {
	.header-post-nav a p {
		font-size: 0.9rem;
	}
}

.header-post-nav a {
	color: #fff;
	text-decoration: none;
	transition: all 0.25s ease;
}

.header-post-nav a:hover {
	color: #cea4eb;
}

.header-post p {
	margin: 0;
	text-align: center;
	color: #fff;
	font-weight: 500;
}

.page-header {
	height: 62px;
}

.page-header h1 {
	text-align: center;
	text-transform: uppercase;
	font-size: 1.875rem;
	margin: 0 0 30px;
	padding-top: 10px;
	color: #fff;
	font-weight: 300;
}

.page_posts #search {
	background: transparent;
}

.page_posts #search svg {
	background-color: transparent
}

.post h1:before,
.post h2:before,
.post h3:before {
	color: #000000;
	font-weight: 300;
	margin-right: 10px
}

.post h1 {
	text-align: center;
	margin: 0;
	font-size: 1.875rem;
}

.post h1:before {
	color: #000000;
	font-size: 2.5rem
}

.post .time {
	text-align: center;
	margin-top: 30px;
	font-family:courier, courier new, serif;
	font-weight: 300;
	font-style: normal
}

.post .music-read {
	text-align: center
}

.post-content {
	padding: 1rem 0;
}

.post-content img {
	max-width: 100%;
	margin: 1.875rem auto;
	display: block
}

.post-content p,
.post-content h1,
.post-content h2,
.post-content h3,
.post-content h4,
.post-content ul,
.post-content ol,
.post-content .tags,
.post-content iframe {
	max-width: 50rem;
	padding: 0 1.25rem;
	margin: 0 auto 1.875rem;
	font-family:courier, courier new, serif;
	font-weight: 300;
	font-style: normal;
	font-size: 1.125rem;
	line-height: 2;
	letter-spacing: .01rem;
}

.post-content p,
.post-content li {
	color: #333;
}

.post-content p code,
.post-content li code {
	color: #615576
}

.post-content a {
	font-family:courier, courier new, serif;
	font-weight: 300;
	font-style: normal;
	color: #000000;
	text-decoration: none;
	border-bottom: 2px solid #000000;
}

.post-content a:hover {
	background-color: #cea4eb
}

.post-content iframe {
	margin-top: 1.875rem;
	width: 100%
}

.post-content #twitter-widget-0 {
	margin: auto !important
}

.post-content h1,
.post-content h2,
.post-content h3,
.post-content h4,
.post-content h5 {
	font-family:courier, courier new, serif;
	font-weight: 800;
	font-style: normal
}

.post-content h1 {
	font-size: 1.875rem;
	line-height: 1.4;
}

.post-content h2 {
	font-size: 1.375rem;
	line-height: 1.4;
	text-align: center;
}

.post-content h2:before {
	font-size: 1.563rem
}

.post-content h3 {
	font-size: 1.125rem;
	line-height: 1.4;
}

.post-content ul,
.post-content ol {
	padding-left: 2.5rem
}

.post-content ul.post-list {
	padding: 0;
}

.post-content blockquote {
	*zoom: 1;
	width: auto;
	max-width: 45.625rem;
	float: none;
	display: block;
	margin-right: auto;
	margin-left: auto;
	padding-left: 0;
	padding-right: 0;
	border-left: .313rem solid #000000;
	padding: 0 1.875rem;
	margin: 3.125rem auto;
}

.post-content blockquote:before,
.post-content blockquote:after {
	content: '';
	display: table
}

.post-content blockquote:after {
	clear: both
}

.post-content blockquote p {
	color: rgba(0, 0, 0, 0.6);
	margin: 0;
}

.post-content hr {
	*zoom: 1;
	width: auto;
	max-width: 47.5rem;
	float: none;
	display: block;
	margin-right: auto;
	margin-left: auto;
	padding-left: 0;
	padding-right: 0;
	border: 1px solid #f2f2f2;
	margin: 50px auto
}

.post-content hr:before,
.post-content hr:after {
	content: '';
	display: table
}

.post-content hr:after {
	clear: both
}

.post-content .about_perfil {
	width: 100px
}

/* ============================================================
   COMPONENTE: ABOUT CONTENT
   ============================================================ */
.about-content {
	padding: 1rem 0;
}

.about-content img {
	max-width: 100%;
	margin: 1.875rem auto;
	display: block
}

.about-content p,
.about-content h1,
.about-content h2,
.about-content h3,
.about-content h4,
.about-content ul,
.about-content ol,
.about-content .tags,
.about-content iframe {
	max-width: 50rem;
	padding: 0 1.25rem;
	margin: 0 auto 1.875rem;
	font-family:courier, courier new, serif;
	font-weight: 300;
	font-style: normal;
	font-size: 1.2rem;
	line-height: 1.8;
}

.about-content p,
.about-content li {
	color: #333;
}

.about-content p code,
.about-content li code {
	color: #615576
}

.about-content a {
	font-family:courier, courier new, serif;
	font-weight: 300;
	font-style: normal;
	color: #000000;
	text-decoration: none;
	border-bottom: 1px solid #000000;
}

.about-content a:hover {
	background-color: #cea4eb
}

.about-content iframe {
	margin-top: 1.875rem;
	width: 100%
}

.about-content #twitter-widget-0 {
	margin: auto !important
}

.about-content h1,
.about-content h2,
.about-content h3,
.about-content h4,
.about-content h5 {
	font-family:courier, courier new, serif;
	font-weight: 800;
	font-style: normal
}

.about-content h1 {
	font-size: 1.875rem;
	line-height: 1.4;
}

.about-content h2 {
	font-size: 1.375rem;
	line-height: 1.4;
	text-align: center;
}

.about-content h2:before {
	font-size: 1.563rem
}

.about-content h3 {
	font-size: 1.125rem;
	line-height: 1.4;
}

.about-content ul,
.about-content ol {
	padding-left: 2.5rem
}

.about-content ul.post-list {
	padding: 0;
}

.about-content blockquote {
	*zoom: 1;
	width: auto;
	max-width: 45.625rem;
	float: none;
	display: block;
	margin-right: auto;
	margin-left: auto;
	padding-left: 0;
	padding-right: 0;
	border-left: .313rem solid #000000;
	padding: 0 1.875rem;
	margin: 3.125rem auto;
}

.about-content blockquote:before,
.about-content blockquote:after {
	content: '';
	display: table
}

.about-content blockquote:after {
	clear: both
}

.about-content blockquote p {
	color: rgba(0, 0, 0, 0.6);
	margin: 0;
}

.about-content hr {
	*zoom: 1;
	width: auto;
	max-width: 47.5rem;
	float: none;
	display: block;
	margin-right: auto;
	margin-left: auto;
	padding-left: 0;
	padding-right: 0;
	border: 1px solid #f2f2f2;
	margin: 50px auto
}

.about-content hr:before,
.about-content hr:after {
	content: '';
	display: table
}

.about-content hr:after {
	clear: both
}

.about-content .about_perfil {
	width: 100px
}

.share {
	*zoom: 1;
	width: auto;
	max-width: 800px;
	float: none;
	display: block;
	margin-right: auto;
	margin-left: auto;
	padding-left: 0;
	padding-right: 0;
	text-align: center;
	border-top: 1px solid #f2f2f2;
	padding-top: 1.25rem;
}

.share:before,
.share:after {
	content: '';
	display: table
}

.share:after {
	clear: both
}

.share svg {
	margin: .938rem;
	width: 35px;
	height: 35px
}

.share a {
	text-decoration: none;
}

.share a:hover svg {
	fill: #000000
}

.tag-title {
	font-family:courier, courier new, serif;
	font-weight: 300;
	font-style: normal;
	font-size: 2.25rem;
	margin-top: 3.75rem;
	*zoom: 1;
	width: auto;
	max-width: 50rem;
	float: none;
	display: block;
	margin-right: auto;
	margin-left: auto;
	padding-left: 0;
	padding-right: 0;
}

.tag-title:before,
.tag-title:after {
	content: '';
	display: table
}

.tag-title:after {
	clear: both
}

.post-list {
	list-style: none;
	margin: 1.563rem auto;
}

.post-list a {
	display: block;
	border-bottom: 1px solid #dadada;
	padding: .625rem 0;
	text-decoration: none;
	transition: all .5s;
}

.post-list a:hover {
	color: #cea4eb
	border-bottom: 1px solid #2e273d
}

.post-list .entry-date {
	float: right;
}

pre {
	width: 100%;
	padding: 1.25rem 0;
	color: #fff;
	margin: 1.875rem 0;
	font-size: .875rem;
}

pre code {
	*zoom: 1;
	width: auto;
	max-width: 50rem;
	float: none;
	display: block;
	margin-right: auto;
	margin-left: auto;
	padding-left: 0;
	padding-right: 0;
	padding: 0 1.25rem;
}

pre code:before,
pre code:after {
	content: '';
	display: table
}

pre code:after {
	clear: both
}

pre span {
	line-height: 1.5rem;
	font-family: 'Monaco', 'Consolas', 'Menlo', monospace
}

.highlight {
	white-space: pre;
	overflow: auto;
	word-wrap: normal;
	border-radius: 0;
	padding: 20px;
	background-color: #000000;
	color: #c1c2c3;
	margin: 0;
	margin-bottom: 30px
}

.highlight .hll {
	background-color: #ffc
}

.highlight .gd {
	color: #2e3436;
	background-color: #0e1416
}

.highlight .gr {
	color: #eeeeec;
	background-color: #c00
}

.highlight .gi {
	color: #babdb6;
	background-color: #1f2b2d
}

.highlight .go {
	color: #2c3032;
	background-color: #2c3032
}

.highlight .kt {
	color: #e3e7df
}

.highlight .ni {
	color: #888a85
}

.highlight .c,
.highlight .cm,
.highlight .c1,
.highlight .cs {
	color: #8d9684
}

.highlight .err,
.highlight .g,
.highlight .l,
.highlight .n,
.highlight .x,
.highlight .p,
.highlight .ge,
.highlight .gp,
.highlight .gs,
.highlight .gt,
.highlight .ld,
.highlight .s,
.highlight .nc,
.highlight .nd,
.highlight .ne,
.highlight .nl,
.highlight .nn,
.highlight .nx,
.highlight .py,
.highlight .ow,
.highlight .w,
.highlight .sb,
.highlight .sc,
.highlight .sd,
.highlight .s2,
.highlight .se,
.highlight .sh,
.highlight .si,
.highlight .sx,
.highlight .sr,
.highlight .s1,
.highlight .ss,
.highlight .bp {
	color: #c1c2c3
}

.highlight .k,
.highlight .kc,
.highlight .kd,
.highlight .kn,
.highlight .kp,
.highlight .kr,
.highlight .nt {
	color: #729fcf
}

.highlight .cp,
.highlight .gh,
.highlight .gu,
.highlight .na,
.highlight .nf {
	color: #e9a94b
}

.highlight .m,
.highlight .nb,
.highlight .no,
.highlight .mf,
.highlight .mh,
.highlight .mi,
.highlight .mo,
.highlight .il {
	color: #8ae234
}

.highlight .o {
	color: #989daa
}

.highlight .nv,
.highlight .vc,
.highlight .vg,
.highlight .vi {
	color: #fff
}


.comments {
	*zoom: 1;
	width: auto;
	max-width: 50rem;
	float: none;
	display: block;
	margin-right: auto;
	margin-left: auto;
	padding-left: 0;
	padding-right: 0;
	padding: 0 1.25rem;
}

.comments:before,
.comments:after {
	content: '';
	display: table
}

.comments:after {
	clear: both
}

.comments h3 {
	margin: 0 0 1.875rem;
	font-size: 1.875rem
}

.aboutme {
	text-align: justify;
}

footer {
	background: #000000;
	padding: 1.563rem 0;
	margin-top: 100px;
	clear: both;
	font-family: courier, courier new, serif;
	font-weight: 300;
	font-style: normal;
	color: #fff;
	text-align: center;
	margin: 0
}

footer a,
	footer a:link,
	footer a:visited {
		color: #fff;
		text-decoration: none;
	}

	footer a:hover,
	footer a:focus {
		color: #fff;
		text-decoration: underline;
	}

tbody#posts-idiom {
	vertical-align: top;
}

ul.recent {
	margin-top: 15px;
}

th.idiom {
	font-size: 1.5rem;
}

@media only screen and (min-width: 300px) and (max-width: 900px) {
	aside {
		height: 230px;
	}
	html, body {
		height: 100%;
	}
	.icons-home {
		text-align: center;
		font-size: 0px;
	}
	.ul-menu {
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: center;
		gap: 0.5rem;
		margin-top: 15px;
	}
	.header-site li {
		margin-left: 1px;
	}
	.site-occupation {
		font-size: 0.9rem;
	}
	.overlay.slide {
		bottom: 230px;
	}
	/* .header-site .content {
		margin-top: 80px;
	} */
	.header-site .person img {
		margin-top: 0;
		margin-left: auto;
		margin-right: auto;
		display: block;
		width: 100px;
		height: 100px;
		border-radius: 100%;
	}
	.header-site .site-title {
		font-size: 1.3rem;
	}
	.icons-home a .icon {
		width: 20px;
		height: 20px;
	}
	.recent,
	.nav {
		font-size: 0.8em;
	}
	.header-site .recent a h2 {
		font-size: 0.875rem;
	}

	.icons-home a {
		display: inline-block;
		padding: 0.3rem;
		margin: .125rem;
		border-radius: 50%;
		border: .125rem solid #000000;
		line-height: 0;
		transition: all .7s;
	}

	table.table-posts tr th{
		text-align: center;
		padding-left: 0;
		width: 25%;
	}

	#posts-title {
		text-align: left;
	}
}

@media only screen and (max-width:320px) {
	.header-site .recent:last-child {
		display: none
	}
}

@media only screen and (min-width:600px) {
	.icons-home a .icon {
		width: 30px;
		height: 30px
	}
	.header-site .site-title {
		letter-spacing: 4px;
		margin-bottom: 0;
		font-size: 2.25rem;
	}
	.header-site .site-description {
		font-size: 2.5rem
	}
	.page-header h1 {
		font-size: 1.875rem
	}
	.post h1 {
		font-size: 2.5rem
	}
	.post-content p,
	.post-content h1,
	.post-content h2,
	.post-content h3,
	.post-content h4,
	.post-content ul,
	.post-content ol,
	.post-content .tags,
	.post-content iframe {
		font-size: 1rem
	}
	.post-content h1 {
		font-size: 2.813rem
	}
	.post-content h2 {
		font-size: 2.188rem
	}
	.post-content h3 {
		font-size: 1.563rem
	}
	pre {
		font-size: 1rem;
		padding: 1.25rem 0;
		margin: 1.25rem 0
	}
}

@media only screen and (max-width:600px) {
	aside #topmenu ul li:nth-child(3),
	aside #topmenu ul li:nth-child(4) {
		display: none
	}
	body.search-overlay:after {
		background-color: #000000
	}
	.post-content ul.post-list {
		padding: 0 1.25rem
	}
	.post-content blockquote {
		width: 70%
	}
	.post-content blockquote p {
		font-size: 1.125rem;
		line-height: 1.5;
		padding: 0
	}
	.tag-title {
		font-size: 1.75rem;
		margin-top: 1.25rem;
		padding: 0 1.25rem
	}
	.post-list {
		padding: 0 1.25rem
	}
	.post-list .entry-date {
		display: none
	}
	pre code {
		overflow-x: scroll
	}
  td {
    display: block;
  }
  tr {
    display: table-cell;
    width: 50%;
  }
}

@media only screen and (min-width:768px) {
	.search-wrapper {
		top: 100px
	}
	.search-list .entry-date {
		display: inline
	}
}

@media only screen and (min-width:1000px) {
	aside #topmenu ul:nth-child(2) {
		display: block
	}
}

@media only screen and (max-width:1000px) {
	aside #topmenu ul {
		*zoom: 1;
		float: left;
		clear: none;
		text-align: inherit;
		width: 100%;
		margin-left: 0%;
		margin-right: 3%
	}
	aside #topmenu ul:before,
	aside #topmenu ul:after {
		content: '';
		display: table
	}
	aside #topmenu ul:after {
		clear: both
	}
	aside #topmenu ul:last-child {
		margin-right: 0%
	}
}
