/*
Theme Name: Monstruktor 2023
Template: twentyseventeen
Author: studium . creative studio
Author URI: https://studium.pt
Version: 1.0
*/
/* ========================================================================
 *  vars
 * ======================================================================== */
:root {
	--Azul: #10069F;
	--Preto: #000014;
	--Branco: #F7F7FD;
	--BrancoRGB: 247 247 253;
	--AzulEscuro: #0A0A1E;
	--AzulEscuroRGB: 10 10 30;
	--CinzentoEscuro: #80808C;
	--CinzentoClaro: #E7E8F9;
	--Serif_factor: 1.16;
	--h1_size: 60px;
	--h1_mobile_size: 30px;
	--h2_size: 20px;
	--h3_size: 18px;
	--p_size: 16px;
	--p_small_size: 13px;
	--p_footer_size: 12px;
	--PracticeFont: Times, Times New Roman, serif;
	--FieldFont: Arial, sans-serif;
}

@supports not (-webkit-overflow-scrolling: touch) {
	:root {
		--PracticeFont: 'Nimbus Roman', Times, Times New Roman, serif;
	}
}

/* ========================================================================
 *  Geral
 * ======================================================================== */
body {
	font-size: var(--p_size);
	background-color: var(--Branco);
	color: var(--Preto);
	font-family: var(--FieldFont);
}
body .practice-font {
	font-family: var(--PracticeFont);
	font-size: calc(var(--p_size) * var(--Serif_factor));
}
body.android .practice-font {
	--PracticeFont: 'Nimbus Roman', Times, Times New Roman, serif;
}
a {
	color: inherit;
}
a:hover, a:focus {
	color: var(--Azul);
	text-decoration: underline;
}
h1 {
	font-size: var(--h1_size);
	font-weight: 400;
	margin: 0;
}
.practice-font h1 {
	font-size: calc(var(--h1_size) * 1.05);
	line-height: 1.05;
	margin-top: -0.12rem;
}
.practice-font h1.category-title .char2 {
	margin-left: -0.05ch;
}
.practice-font h1.category-title .char4 {
	margin-left: -0.2ch;
}
h1.category-title {
	text-transform: uppercase;
}
h2 {
	font-size: var(--h2_size);
	font-weight: 400;
	margin: 0;
}
.practice-font h2 {
	font-size: calc(var(--h2_size) * var(--Serif_factor));
}
h3 {
	font-size: var(--p_size);
	font-weight: 400;
	margin: 0;
	padding: 12px 26px;	
}
.practice-font h3 {
	font-size: calc(var(--p_size) * var(--Serif_factor));
}
.container {
	max-width: 1200px;
}
.spacing-12 {
	height: 12px;
}
.spacing-24 {
	height: 24px;
}
.spacing-36 {
	height: 36px;
}
.spacing-48 {
	height: 48px;
}
svg.icon {
	height: 12px;
	width: 30px;
}
a:hover svg.icon {
	fill: var(--Azul);
}
.print-only {
	display: none;
}
.tag-cloud-holder a::before {
	content: '#';
}
@media screen and (max-width: 768px){
	:root {
		--h1_size: 30px;
	}
	h1.category-title {
		font-size: 60px;
	}
	.spacing-12 {
		height: 8px;
	}
	.spacing-24 {
		height: 12px;
	}
	.spacing-36 {
		height: 24px;
	}
	.spacing-48 {
		height: 36px;
	}
}
/* ========================================================================
 *  Back to top button
 * ======================================================================== */
@media screen and (max-width: 768px) {
	body .progress-wrap.btn-right-side {
		right: 10px;
		bottom: 10px;
	}
}
/* ========================================================================
 *  Header
 * ======================================================================== */
.navbar-default {
	padding: 30px 0;
	margin-bottom: 0;
	background-color: rgb(var(--BrancoRGB)/0.5);
	border: none;
	-webkit-backdrop-filter: blur(12px);
	backdrop-filter: blur(12px);
}
.nav::before, .nav::after {
	display: none;
}
.navbar-holder {
	display: flex;
	justify-content: space-between;
}
.navbar-header {
	z-index: 2;
}
.navbar-header ul#menu-navbar {
	display: inline-flex;
	margin: 0;
}
.navbar-header ul#menu-navbar li.menu-item {
	margin-right: 12px;
}
.navbar-header ul#menu-navbar li.menu-item a {
	width: 36px;
	height: 36px;
	background: none;
	border: 2px solid var(--AzulEscuro);
	content-visibility: hidden;
	color: transparent;
	font-size: 0px;
}
.navbar-header ul#menu-navbar li.menu-item a:hover {
	background-color: var(--AzulEscuro);
}
.navbar-header ul#menu-navbar li.menu-item:first-child a {
	border-radius: 100px;
}
.navbar-header ul#menu-navbar li.current-menu-item a {
	background-color: var(--AzulEscuro);
	pointer-events: none;
}
/* ========================================================================
 *	Search
 * ======================================================================== */
.search-form-row {
	display: none;
	position: absolute;
	background: none;
	height: 100%;
	width: inherit;
	top: 0;
	z-index: 1;
	max-width: inherit;
}
.search-form-row.active-search { 
	display: block;
}
.search-form-row > div { 
	height: inherit;
	align-items: center;
}
.search-form-row .search-form-holder {
	display: flex;
	justify-content: flex-end;
	gap: 12px;
	align-content: center;
	height: inherit;
	flex-wrap: wrap;
	background: var(--Branco);
	width: 50%;
	float: right;
}
form.search-form {
	display: flex;
	flex-grow: 1;
}
.search-form-row .search-form-holder form.search-form input {
	width: -webkit-fill-available;
}
.navbar-holder .navbar-search {
	margin-right: 0;
}
.navbar button, button.search-submit {
	padding: 6px;
	background: none;
	border: none;
}
.navbar button svg.icon, button.search-submit svg.icon{
	height: 24px;
	width: 24px;
	fill: var(--Preto);
	stroke: var(--Branco);
	stroke-width: 2px;
	display: block;
}
.navbar button.close-search svg.icon {
	stroke-width: 5px;
	height: 36px;
	width: 36px;
	margin: -6px;
}
form input.search-field {
	border: none;
	padding: 2px 6px;
}
form .search-submit {
	background-color: white;
	display: none;
}
@media screen and (max-width: 768px){
	.search-form-row { 
		width: 100%;
		z-index: 999;
	}
	.search-form-row .search-form-holder {
		width: 100%;
	}
}
/* ========================================================================
 *	Footer
 * ======================================================================== */
footer {
	background-color: var(--Preto);
	color: var(--Branco);
	padding: 20px 0;
	font-size: var(--p_footer_size);
}
.practice-font footer {
	font-size: calc(var(--p_footer_size) * var(--Serif_factor));
}
footer #footer-logo img {
	filter: invert(100%) sepia(100%) saturate(1%) hue-rotate(306deg) brightness(104%) contrast(101%);
}
footer .row:last-child, footer ul, footer p {
	padding-bottom: 0;
	margin-bottom: 0;
}
footer ul#menu-footer {
	justify-content: space-between;
}
footer #footer-links ul#menu-footer li {
	padding: 0;
	margin-right: 36px;
}
footer ul#menu-footer li .barra {
	content: '/';
	font-weight: 900;
	color: var(--Azul);
}
footer #copyright {
	font-size: 10px;
	opacity: 0.6;
}
.practice-font footer #copyright {
	font-size: calc(10px * var(--Serif_factor));
}
footer #copyright > * {
	display: inline-block;
}
@media screen and (max-width: 768px){
	footer ul#menu-footer {
		padding: 12px 0;
	}
}
/* ========================================================================
 *	Homepage
 * ======================================================================== */
body.home #page{
	height: 90vh;
	display: flex;
	justify-content: center;
	align-items: center;
}
body.home header {
	display: none;
}
body.home ul.home-menu-list {
	display: flex;
	justify-content: center;
	gap: 1em;
	margin: 0;
}
body.home li.home-menu-list-item {
	--width: 6em;
	width: var(--width);
	height: var(--width);
	font-size: 4em;
	text-transform: uppercase;
	padding: 0;
}
body.home li.home-menu-list-item a {
	width: -webkit-fill-available;
	height: -webkit-fill-available;
	display: flex;
	align-items: center;
	justify-content: center;
	border: 1px solid var(--AzulEscuro);
	color: var(--AzulEscuro);
}
body.home li.home-menu-list-item:first-child a {
	font-family: var(--FieldFont);
	border-radius: 1000px;
}
body.home li.home-menu-list-item:last-child a {
	font-family: var(--PracticeFont);
}
body.home li.home-menu-list-item a:hover {
	background-color: var(--Preto);
	background-size: cover;
	color: var(--Branco); 
	text-decoration: none;
}
@media screen and (max-width: 1200px){
	body.home li.home-menu-list-item {
		font-size: 3em;
	}
}
@media screen and (max-width: 768px){
	body.home li.home-menu-list-item {
		font-size: 2em;
	}
}
@media screen and (max-width: 425px){
	body.home li.home-menu-list-item {
		font-size: 1.75em;
	}
}
/* ========================================================================
 *	Category pages
 * ======================================================================== */
.category-description p {
	font-style: italic;
}
.practice-font .category-description p {
	margin-bottom: 5px;
}
.container:before{
	content: none;
}
h2.post-title {
	font-size: 14px;
	margin: 0;
}
.practice-font h2.post-title {
	font-size: calc(14px * var(--Serif_factor));
}
p.category-subtitle, .category-holder a.category-link, section.post-info-holder .meta-holder {
	font-size: var(--p_small_size);
	line-height: 1.6;
	letter-spacing: 0.3px;
}
.practice-font p.category-subtitle, .practice-font .category-holder a.category-link, .practice-font section.post-info-holder .meta-holder{
	font-size: calc(var(--p_small_size) * var(--Serif_factor))
}
ul.category-filter-list {
	font-size: var(--p_small_size);
	margin: 0px;
}
.practice-font ul.category-filter-list {
	font-size: calc(var(--p_small_size) * var(--Serif_factor));
}
ul.category-filter-list li.category-filter-list-item {
	padding: 0px;
	margin-right: 36px;
}
ul.category-filter-list li.category-filter-list-item.current {
	text-decoration: line-through;
	pointer-events: none;
}
.posts-container .post-row a:hover {
	text-decoration: none;
}
.posts-container .post-row a:hover .post-holder {
	background-color: rgb(var(--AzulEscuroRGB)/0.05);
}
.posts-container .post-row .post-holder {
	display: inline-flex;
	gap: 1ch;
	align-items: center;
	width: 100%;
	padding: 3px 4px;
	min-height: 26px;
}
.posts-container .post-row .post-holder.masonry {
	background: #fff;
	padding: 12px;
	margin-bottom: 12px;
}
.posts-container .post-row .post-holder.masonry img {
	margin-top: 12px;
	width: 100%;
	height: auto;
}
.posts-container .post-row .post-holder img.attachment-post-thumbnail {
	width: 100%;
	height: auto;
}
.posts-container .post-row .post-holder span.bullet {
	height: 6px;
	width: 6px;
	display: inline-block;
	background-color: var(--Preto);
}
.posts-container .post-row .post-holder span.bullet.field {
	border-radius: 999px;
}
.posts-container .post-row .post-holder p.post-excerpt {
	font-size:var(--p_small_size);
	margin: 0;
	/*width: 100%;*/
	opacity: 0.7;
}
.practice-font .posts-container .post-row .post-holder p.post-excerpt {
	font-size: calc(var(--p_small_size) * var(--Serif_factor));
}
@media screen and (max-width: 768px){
	ul.category-filter-list li.category-filter-list-item {
		margin-right: 20px;
	}
	/*.posts-container .post-row .post-holder p.post-excerpt {
		width: 92%;
	}*/
}
/* ========================================================================
 *	Pagination
 * ======================================================================== */
.pagination{
	margin: 12px 0;
}
.pagination .nav-links > *, .pagination .page-numbers.dots {
	padding: 5px 10px;
	margin-right: 18px;
	font-size: var(--p_small_size);
}
.pagination .page-numbers.current {
	background-color: #fff;
}
.pagination .nav-links a:last-child {
	margin-right: 0;
}
/* ========================================================================
 *	Single Post
 * ======================================================================== */
.practice section .container {
	background-color: #fff;
	padding: 0 calc(100%/12);
}
.practice section:first-of-type .container {
	padding-top: 48px;
}
.practice section:last-of-type .container {
	padding-bottom: 48px;
}
section.post-info-holder .meta-holder > * {
	display: inline-block;
}
.drawing section.post-info-holder .meta-holder div, .photography section.post-info-holder .meta-holder div{
	display: none;
}
.single .post-navigation .nav-links {
	padding: 24px 0;
	display: flex;
	justify-content: space-between;
}
/* ========================================================================
 *	About
 * ======================================================================== */
section#links li {
	color: var(--Azul);
}
section#links li::marker {
	color: var(--Preto);
}
/* ========================================================================
 *	Print styles
 * ======================================================================== */
@media print {
	.print-only {
		display: initial;
	}
	body {
		background: none !important;
	}
	header, section.pagination-holder, footer {
		display: none;
	}
	.container, .practice section .container {
		padding: 0 10% !important;
		background: none;
	}
	.post-info-holder .spacing-48 {
		height: 20pt;
		border-top: 1pt solid #ccc;
	}
	h1 {
		font-size: 20pt;
		margin-bottom: 10pt;
	}
	.practice-font h1 {
		font-size: 22pt;
	}
	body, h2, p, li.single-tag {
		font-size: 10pt;
	}
	body.practice-font, .practice-font h2, .practice-font p, .post-content-holder ol li a, .practice-font p.category-subtitle, .practice-font .category-holder a.category-link, .practice-font section.post-info-holder .meta-holder {
		font-size: 11pt;
	}
	a[href]:after {
		font-style: italic;
		opacity: 0.8;
	}
	a.category-link:after, li.single-tag a:after {
		display: none !important;
	}
	section.post-info-holder .row div >:not(h1) {
		opacity: 0.75;
	}
	section.post-info-holder .rt-suffix {
		opacity: 1 !important;
	}
}