@font-face {
font-family: 'Helvetica';
font-style: normal;
font-weight: normal;
src: url(http://andrepenteado.com/wp-content/themes/dostov_port_andre/assets/fonts/Helvetica.woff2) format('woff2'),
url(http://andrepenteado.com/wp-content/themes/dostov_port_andre/assets/fonts/Helvetica.woff) format('woff');
font-display: swap;
}
@font-face {
font-family: 'Helvetica';
font-style: italic;
font-weight: normal;
src: url(http://andrepenteado.com/wp-content/themes/dostov_port_andre/assets/fonts/Helvetica-Oblique.woff2) format('woff2'),
url(http://andrepenteado.com/wp-content/themes/dostov_port_andre/assets/fonts/Helvetica-Oblique.woff) format('woff');
font-display: swap;
}
@font-face {
font-family: 'Helvetica';
font-style: normal;
font-weight: bold;
src: url(http://andrepenteado.com/wp-content/themes/dostov_port_andre/assets/fonts/Helvetica-Bold.woff2) format('woff2'),
url(http://andrepenteado.com/wp-content/themes/dostov_port_andre/assets/fonts/Helvetica-Bold.woff) format('woff');
font-display: swap;
}
@font-face {
font-family: 'Helvetica';
font-style: italic;
font-weight: bold;
src: url(http://andrepenteado.com/wp-content/themes/dostov_port_andre/assets/fonts/Helvetica-BoldOblique.woff2) format('woff2'),
url(http://andrepenteado.com/wp-content/themes/dostov_port_andre/assets/fonts/Helvetica-BoldOblique.woff) format('woff');
font-display: swap;
}  :root {
--color-base-text: #111;
--color-base-background: #fff;
--color-caption-text: #b1b1b1;
--font-family-base: Helvetica, -apple-system, BlinkMacSystemFont, Avenir Next,
Avenir, Segoe UI, Helvetica Neue, Cantarell, Ubuntu, Roboto, Noto, Arial,
sans-serif;
--font-size-base: 15px;
--line-height-base: calc(1.25 * var(--font-size-base));
--font-size-menu: 15px;
--font-size-logo: 23px;
--font-size-caption: 14px;
--line-height-logo: calc(1.125 * var(--font-size-logo));
--line-height-caption: 20px;
--gutter: 12px;
--site-x-padding: var(--gutter);
--site-y-padding: var(--gutter);
--multilingual-separator-margin: 6px;
--header-height: calc(
2 * var(--line-height-logo) + 2 * var(--site-y-padding)
);
--masonry-grid-row-height: calc(
(100vh - (var(--header-height) + var(--gutter)) - 3 * var(--gutter)) / 3.5
);
--masonry-mobile-columns: 1;
--masonry-tablet-columns: 2;
--masonry-desktop-columns: 3;
--icon-height: 17px;
--template-texts-mobile-columns: 1;
--template-texts-tablet-columns: 2;
--template-texts-desktop-columns: 3;
--window-height: calc(var(--vh, 1vh) * 100);
--project-title-height: calc(
2 * var(--line-height-base) + 2 * var(--multilingual-separator-margin) + 1px
);
--long-text-width: 100%;
--transition-slow: 0.625s;
--transition-fast: 0.3125s;
--transition-timing-function-sudden-end: cubic-bezier(0.9, 0.03, 0.69, 0.22);
--transition-timing-function-sudden-start: cubic-bezier(0.17, 0.84, 0.44, 1);
--transition-timing-function-smooth: cubic-bezier(0.62, 0.16, 0.13, 1.01);
--transition-timing-function-inertia: cubic-bezier(0.5, -0.53, 0.14, 1.23);
}
@media screen and (min-width: 1024px) {
:root {
--gutter: 20px;
--long-text-width: calc((100% - (2 * var(--gutter))) / 3);
}
}
@media screen and (min-width: 1200px) {
:root {
--gutter: 32px;
}
}
@media screen and (min-width: 1800px) {
:root {
--long-text-width: calc((100% - (3 * var(--gutter))) / 4);
}
}
@media screen and (min-width: 2200px) {
:root {
--long-text-width: calc((100% - (4 * var(--gutter))) / 5);
}
} ::-webkit-scrollbar {
display: none;
}
html { scrollbar-width: none;
} *,
*::before,
*::after {
box-sizing: border-box;
}
html,
body {
margin: 0px;
padding: 0px;
}
body {
-moz-osx-font-smoothing: grayscale;
-webkit-font-smoothing: antialiased;
text-rendering: optimizelegibility;
font-feature-settings: 'cv11', 'salt', 'ss01', 'ss03', 'cv01', 'cv02', 'cv03',
'cv04', 'cv05', 'cv06', 'cv09', 'cv10';
}
body {
background-color: var(--color-base-background);
color: var(--color-base-text);
display: block;
font-family: var(--font-family-base);
font-size: var(--font-size-base);
font-weight: 400;
line-height: var(--line-height-base);
}
h1,
h2,
h3,
h4,
h5,
h6 {
font-size: var(--font-size-base);
font-weight: 400;
line-height: var(--line-height-base);
margin: 0;
}
a {
text-decoration: none;
color: black;
}
strong {
font-weight: 700;
}
.container { } .site-main {
padding: calc(var(--header-height)) var(--site-x-padding)
var(--site-y-padding);
width: 100%;
}
@media screen and (min-width: 1024px) {
.site-main {
}
}
.open-title a {
color: black;
}
.page_item {
cursor: pointer;
}
.page_item div {
margin: 1px 0;
border-top: 1px black solid;
}
.content {
display: -webkit-flex;
display: flex;
overflow: hidden;
position: absolute;
padding: calc(var(--header-height) + var(--gutter)) var(--site-x-padding)
var(--site-y-padding) var(--site-x-padding);
height: 100%;
}
.home h1 {
display: none;
} .nav-content {
background-color: #fff;
z-index: 1;
}
.site-menu {
background-color: #fff;
left: 0;
position: absolute;
right: 0;
top: var(--header-height);
transform: translateY(-100%);
transition: transform var(--transition-fast)
var(--transition-timing-function-smooth);
width: 100%;
z-index: 0;
}
.site-menu .menu {
margin: 0;
padding: 0 var(--gutter) var(--gutter);
width: 100%;
}
.site-menu li {
list-style: none;
text-align: right;
}
.site-menu li:not(:last-child) {
margin-bottom: calc(0.625 * var(--line-height-base));
}
.site-menu-is-open .site-menu {
transform: translateY(0);
}
.site-menu a {
display: inline-flex;
font-size: var(--font-size-base);
line-height: var(--line-height-base);
}
.site-menu a span {
background-color: var(--color-base-text);
display: block;
height: 1em;
margin: 1px 6px 0 6px;
width: 1px;
}
@media screen and (min-width: 1024px) {
.site-menu {
display: none;
}
.menu-desktop .menu a {
font-size: var(--font-size-base);
line-height: var(--line-height-base);
}
.menu-desktop .menu a span {
background-color: var(--color-base-text);
display: block;
height: 1px;
margin: var(--multilingual-separator-margin, 6px) 0;
width: 100%;
}
} .logo {
display: none;
}
.logo-desktop {
font-weight: 700;
margin: 0 70px 0 0;
font-size: var(--font-size-logo);
line-height: var(--line-height-logo);
}
.menu-desktop a {
display: block;
}
.insta.cel {
display: none;
}
.insta img {
display: block;
height: var(--icon-height);
width: auto;
}
.insta.desktop {
align-items: center;
display: flex;
}
.perfil img {
height: 515px;
}
.menu-cel {
display: none;
}
.nav {
position: fixed;
z-index: 999;
top: 0;
padding: var(--site-y-padding) var(--site-x-padding);
background: white;
width: 100%;
} .children {
display: none;
}
.nav-content {
align-items: center;
display: flex;
}
.menu-desktop ul {
display: flex;
list-style: none;
padding: 0;
line-height: 160%;
margin: 0;
}
.menu-desktop li {
margin: 0 0 0 20px;
}
.menu-desktop-language {
margin: 0 50px 0 0 !important;
display: none;
} .projects-masonry {
width: 100%;
}
.projects-masonry .project-link {
margin-bottom: var(--gutter);
} .project-link {
position: relative;
width: calc(
(100% - (var(--masonry-mobile-columns) - 1) * var(--gutter)) /
var(--masonry-mobile-columns)
);
}
.project-link-image {
width: 100%;
}
.project-link-image img {
display: block;
}
.project-link-image img {
width: 100%; height: 100%;
}
.project-link-title-container {
width: 100%;
text-align: center;
display: -webkit-flex;
display: flex;
justify-content: center;
align-items: center;
flex-direction: column;
position: absolute;
height: 100%;
position: absolute;
background-color: rgba(15, 15, 15, 0.7);
opacity: 0;
transition: opacity var(--transition-fast)
var(--transition-timing-function-smooth);
}
.project-link:hover .project-link-title-container {
opacity: 0.8;
}
.project-link-title,
.project-link-title-en {
display: block;
font-size: var(--font-size-base);
color: #fff;
line-height: var(--line-height-base);
padding: 0 0 4px 0;
}
.project-link-title-en {
padding: 4px 0 0 0;
border-top: 1px #fff solid;
}
.project-gutter-sizer {
width: calc(1 * var(--gutter));
}
@media screen and (max-width: 959px) {
.project-link-title-container {
bottom: 0;
height: fit-content;
opacity: 0.8;
padding: calc(0.5 * var(--gutter));
}
}
@media screen and (min-width: 480px) {
.project-link {
width: 100%;
margin: 0 0 var(--gutter) 0;
}
}
@media screen and (min-width: 768px) {
.project-link {
width: calc(
(100% - (var(--masonry-tablet-columns) - 1) * var(--gutter)) /
var(--masonry-tablet-columns)
);
}
}
@media screen and (min-width: 960px) {
.project-link {
width: calc(
(100% - (var(--masonry-desktop-columns) - 1) * var(--gutter)) /
var(--masonry-desktop-columns)
);
}
.project-link .project-link-title-container {
inset: 0;
}
.project-link:hover .project-link-title-container {
}
}
@media screen and (min-width: 1400px) { }
@media screen and (min-width: 1800px) { } .gallery {
display: -webkit-flex;
display: flex;
margin: 0;
padding: 0 0 10px 0;
min-height: 400px;
max-height: 850px;
}
.gallery div {
width: auto !important;
height: 100%;
}
.gallery p {
display: flex;
margin: 0;
padding: 0 0 10px 0;
height: 100%;
}
.page-template-page-projeto-composto .gallery p {
display: flex;
margin: 0;
padding: 00;
height: fit-content;
}
html .gallery img {
height: 100%;
max-height: calc(
var(--window-height) - var(--header-height) - 2 * var(--gutter)
);
max-width: initial;
padding: 0 15px 10px 0;
width: auto;
}
@media screen and (max-width: 1023px) {
html .gallery > * + * {
margin-top: calc(2 * var(--gutter));
}
html .gallery img {
height: auto;
max-height: initial;
max-width: initial;
padding: 0 0 10px 0;
width: 100%;
}
}
.gallery iframe {
padding: 0 15px 10px 0;
height: 600px;
width: 1067px;
}
.video iframe {
padding: 10px 15px 10px 0;
height: 600px;
width: 800px;
}
.video p {
margin: 0;
padding: 0;
}
.project-text {
width: 400px;
padding: 0 30px 0 0;
column-width: 400px;
-webkit-column-width: 400px;
column-gap: 60px;
-moz-column-gap: 60px;
-webkit-column-gap: 60px;
column-fill: auto;
-webkit-column-fill: auto;
column-count: 10;
height: 600px;
background-color: white;
}
.project-text.project-full-text {
column-width: auto;
column-gap: normal;
column-fill: balance;
column-count: auto;
width: auto !important;
height: 600px;
background-color: white;
display: flex;
padding: 0;
}
.project-text .pt,
.project-text .en {
width: 400px;
column-width: 400px;
-webkit-column-width: 400px;
column-gap: 60px;
-moz-column-gap: 60px;
-webkit-column-gap: 60px;
column-fill: auto;
-webkit-column-fill: auto;
column-count: 10;
height: 600px;
background-color: white;
padding: 0 30px 0 0;
}
.project-text-squebra {
width: 400px;
padding: 0 0 60px 0;
background-color: white;
position: absolute;
}
.project-title {
font-size: var(--font-size-base);
line-height: var(--line-height-base);
margin-top: 0px;
margin-bottom: 0px;
}
.project-title.en {
font-style: italic;
margin-top: 6px;
}
.project-autor {
font-style: italic;
}
.media a {
margin: 0;
padding: 0;
text-transform: uppercase;
font-size: 11px;
}
.media p {
margin: 0;
padding: 0;
}
.project-text.media {
height: 790px;
}
.content-news {
width: 600px;
position: absolute;
z-index: -1;
left: 280px;
padding: 50px 30px 0 0;
top: 0;
}
.news {
width: 600px;
display: block;
margin: 0 0 80px 0;
}
.news-descritivo p {
margin: 0 0 10px 0;
}
.news-image img {
width: 100%;
height: auto;
margin: 0 0 10px 0;
}
.news-image p {
margin: 0;
} @media screen and (max-width: 1023px) {
.insta.cel {
align-items: center;
display: flex;
position: absolute;
height: 100%;
right: calc(
var(--site-x-padding) + 1.5 * var(--gutter) + var(--icon-height)
);
}
.insta.cel a,
.insta.cel img {
display: block;
height: var(--icon-height);
width: auto;
}
.insta.desktop {
display: none;
}
.container {
width: 100%;
display: flex;
display: -webkit-flex;
display: -ms-flex;
display: -moz-flex;
}
.logo {
display: block;
left: var(--site-x-padding);
position: absolute;
top: var(--site-y-padding);
z-index: 3;
}
.logo a {
display: block;
height: 100%;
width: 100%;
}
.nav {
width: 100%;
min-height: var(--header-height);
padding: 0;
display: -webkit-flex;
display: flex;
position: fixed;
background-color: white;
}
.logo a span {
margin: 0;
font-size: var(--font-size-logo, 26px);
line-height: var(--line-height-logo, calc(1.125 * var(--font-size-logo)));
}
.nav-content {
width: 100%;
}
.logo-desktop {
display: none;
}
.logo img {
padding: 10px;
width: 95px;
}
.menu-desktop {
display: none;
}
.menu {
margin-left: auto;
padding: 10px;
} .menu-cel {
align-items: center;
display: flex;
margin-left: auto;
padding-right: var(--site-x-padding);
}
.menu-cel li {
display: none;
}
.menu-cel ul {
display: block;
margin: 23px 0 var(--gutter);
}
.menu-responsive li li {
text-align: right;
} .menu-responsive .icon {
display: block;
text-align: right;
right: 0;
top: 0;
font-size: 26px;
}
.site-menu-toggle-button {
background: transparent;
border: none;
display: block;
font-size: 26px;
line-height: 1;
margin: 0;
padding: 6px 0 6px 6px;
}
.list.menu-desktop {
display: block;
padding: 0;
}
.list.menu-desktop ul {
line-height: 140%;
}
.list.menu-desktop li li {
padding-right: 15px;
} .menu-cel-language {
margin: 10px;
position: relative;
top: 90px;
font-size: 13px;
display: none;
}
.language {
position: static;
width: 50px;
left: 10px;
top: 10px;
font-size: 10px;
text-align: left;
padding: 15px 0 0 10px;
}
.content {
position: static;
display: block;
left: 0;
margin: calc(var(--header-height) + 1 * var(--gutter)) var(--site-x-padding)
5px;
padding: 0;
width: 100%;
}
.projet-link-title-container {
opacity: 0.8;
height: 50px;
bottom: 1px;
}
.gallery p {
display: block;
margin: 0 0 10px 0;
}
.gallery iframe {
height: auto;
min-height: 400px;
max-height: none;
max-width: 100%;
padding: 10px 0 10px 0;
}
.gallery {
display: block;
min-height: none;
max-height: none;
}
.gallery img {
height: auto;
width: 100%;
padding: 10px 0 10px 0;
}
.project-text {
width: 100% !important;
height: auto;
padding: 15px 0px 15px 0;
column-width: 450px;
-moz-column-width: 450px;
-webkit-column-width: 450px;
}
.project-text.project-full-text {
display: block;
height: auto;
padding: 0;
}
.project-text .pt,
.project-text .en {
width: 100% !important;
height: auto;
column-width: 450px;
-moz-column-width: 450px;
-webkit-column-width: 450px;
padding: 15px 0px 15px 0;
}
.project-title {
margin-top: 0px;
}
.project-text.media {
height: auto;
}
.video iframe {
padding: 0 0 10px 0;
height: 450px;
width: 100%;
}
.project-text-squebra {
width: 100%;
margin: 50px 0 60px 0;
}
.page_item a {
-moz-display: inline-flex;
-ms-display: inline-flex;
-o-display: inline-flex;
-webkit-display: inline-flex;
display: inline-flex;
}
.page_item div {
margin: 1px 6px 0 6px;
border-left: 1px black solid;
height: 1em;
border-top: 0px;
}
}  .current_page_item a {
text-decoration: line-through;
} .masonry {
}
.masonry-gutter {
width: var(--gutter);
}
.masonry-item {
display: block;
margin-bottom: var(--gutter);
width: calc(
(100% - (var(--masonry-mobile-columns) - 1) * var(--gutter)) /
var(--masonry-mobile-columns)
);
}
.masonry-item img {
display: block;
height: auto;
width: 100%;
}
@media screen and (min-width: 768px) {
.masonry-item {
width: calc(
(100% - (var(--masonry-tablet-columns) - 1) * var(--gutter)) /
var(--masonry-tablet-columns)
);
}
}
@media screen and (min-width: 1024px) {
.masonry-item {
width: calc(
(100% - (var(--masonry-desktop-columns) - 1) * var(--gutter)) /
var(--masonry-desktop-columns)
);
}
} .sl-wrapper .sl-counter {
top: var(--gutter);
left: var(--gutter);
font-size: 1rem;
}
.sl-wrapper .sl-close {
right: var(--gutter);
top: var(--gutter);
margin-top: -12px;
margin-right: -12px;
height: 40px;
width: 40px;
line-height: 1;
font-size: 40px;
}
.sl-wrapper .sl-navigation button {
margin-top: -22px;
height: 40px;
width: 20px;
line-height: 40px;
font-family: Arial, Baskerville, monospace;
color: var(--color-base-text);
}
.sl-wrapper .sl-navigation button.sl-prev {
font-size: calc(3 * var(--font-size-base));
}
.sl-wrapper .sl-navigation button.sl-next {
font-size: calc(3 * var(--font-size-base));
}
.sl-wrapper .sl-navigation button,
.sl-wrapper .sl-close {
-webkit-tap-highlight-color: transparent;
outline: none;
}
.sl-wrapper .sl-image .sl-caption {
background-color: var(--color-base-background);
color: var(--color-caption-text);
padding: 10px 0 0;
}
.sl-wrapper .sl-image .sl-caption p {
font-size: var(--font-size-caption);
line-height: var(--line-height-caption);
margin: 0;
}
@media screen and (max-width: 1023px) {
.sl-wrapper .sl-close {
right: calc(1.25 * var(--gutter));
top: calc(1.25 * var(--gutter));
}
.sl-wrapper .sl-navigation button.sl-prev {
left: 10px;
}
.sl-wrapper .sl-navigation button.sl-next {
right: 10px;
}
}
@media screen and (min-width: 1024px) {
.sl-wrapper .sl-navigation button.sl-prev {
left: calc(1 * var(--gutter) - 4px);
}
.sl-wrapper .sl-navigation button.sl-next {
right: calc(1 * var(--gutter) - 4px);
}
} .masonry-grid {
display: flex;
flex-wrap: wrap;
gap: var(--gutter);
width: 100%;
}
.masonry-grid .project-link,
.masonry-grid .masonry-item {
flex-grow: 1;
margin: 0;
position: relative;
width: auto;
}
.masonry-grid .project-link-image,
.masonry-grid .project-link-image img,
.masonry-grid .masonry-item img {
display: block;
height: 100%;
width: 100%;
}
@media screen and (min-width: 1024px) {
.masonry-grid .project-link,
.masonry-grid .masonry-item {
height: var(--masonry-grid-row-height);
}
.masonry-grid .project-link-image img,
.masonry-grid .masonry-item img {
object-fit: cover;
}
} .home main {
padding: calc(var(--header-height) + var(--gutter)) var(--site-x-padding)
var(--site-y-padding);
} .project .project-header {
}
.project .project-title {
display: inline-block;
width: fit-content;
}
.project .project-title span {
display: block;
font-weight: 400;
}
.project .project-title span:nth-child(3) {
border-top: 1px solid var(--color-base-text);
margin-top: var(--multilingual-separator-margin, 6px);
padding-top: var(--multilingual-separator-margin, 6px);
}
.project .project-title .separator {
display: none;
}
.project .grid {
margin: calc(1 * var(--gutter)) 0;
}
@media screen and (max-width: 1123px) {
.project .project-header {
display: flex;
gap: calc(1 * var(--gutter));
}
}
@media screen and (min-width: 1024px) {
.project .project-header {
display: flex;
gap: calc(1 * var(--gutter));
position: relative;
}
}
.project-open-text-toggle .separator {
display: none;
}
.project-open-text-toggle {
}
[data-open-text-toggle='true'] {
cursor: pointer;
}
.project-open-text-toggle-button {
align-items: center;
background: transparent;
border: 0;
cursor: pointer;
display: flex;
font-size: var(--font-size-base);
gap: 4px;
line-height: var(--line-height-base);
margin: 0;
padding: 0;
}
.project-open-text-toggle-button svg {
height: 9px;
width: auto;
}
.project-open-text-toggle button:nth-child(3) {
border-top: 1px solid var(--color-base-text);
margin-top: var(--multilingual-separator-margin, 6px);
padding-top: var(--multilingual-separator-margin, 6px);
} .project-text-accordion {
display: grid;
opacity: 0;
grid-template-rows: 0fr;
transition: all var(--transition-slow)
var(--transition-timing-function-smooth);
}
.project-text-accordion__wrapper {
display: grid;
grid-template-columns: 1fr;
overflow: hidden;
}
.project-text-accordion .spacer {
background-color: var(--color-base-text);
height: 1px;
margin: calc(var(--line-height-base)) 0;
}
.project-text-accordion__full-text-toggle-button {
background-color: transparent;
border: 0;
cursor: pointer;
display: inline-block;
font-size: var(--font-size-base);
line-height: var(--line-height-base);
margin: 0;
padding: 0;
text-decoration: underline;
text-transform: lowercase;
}
.accordion-is-open .project-open-text-toggle-button {
text-decoration: line-through;
}
.accordion-is-open .project-text-accordion,
.project-text-accordion.open {
grid-template-rows: 1fr;
opacity: 1;
padding: calc(2 * var(--gutter)) 0 calc(1 * var(--gutter));
}
.project-text-accordion__full-text-wrapper {
display: grid;
grid-template-rows: 0fr;
opacity: 0;
transition: all var(--transition-slow)
var(--transition-timing-function-smooth);
}
.project-text-accordion__full-text-wrapper .text {
overflow: hidden;
}
.project-text-accordion__full-text-wrapper.is-open {
grid-template-rows: 1fr;
opacity: 1;
}
.project-text-accordion__full-text-toggle-button.is-active {
margin-top: calc(1 * var(--line-height-base));
text-decoration: line-through;
}
.project-text-accordion hr {
display: none;
}
@media screen and (min-width: 1024px) {
.project-text-accordion__wrapper {
display: flex;
}
.project-text-accordion__wrapper > .text {
width: var(--long-text-width);
}
.project-text-accordion .spacer {
background-color: var(--color-base-text);
height: 100%;
margin: 0 calc(0.5 * var(--gutter)) 0 calc(0.5 * var(--gutter) - 1px);
width: 1px;
}
.accordion-is-open .project-text-accordion,
.project-text-accordion.open {
margin: calc(1 * var(--gutter)) 0 0;
padding: 0;
}
} .page-template-page-project-grid-horizontal {
--masonry-grid-row-height: calc(
(100vh - (var(--header-height) + var(--gutter)) - 3 * var(--gutter) - 14px) /
2.5
);
} .project-video {
margin-top: calc(1 * var(--gutter));
width: 100%;
}
.project-video iframe {
aspect-ratio: 16 / 9;
display: block;
width: 100%;
}
.project-gallery {
margin-top: calc(1 * var(--gutter));
}
@media screen and (min-width: 1200px) and (min-aspect-ratio: 1.4) {
.project-video {
height: calc(
var(--window-height) - var(--header-height) - var(--project-title-height) -
3 * var(--gutter)
);
}
.project--video .project-video {
height: calc(
var(--window-height) - var(--header-height) - var(--project-title-height) -
2 * var(--gutter)
);
}
.project-video iframe {
aspect-ratio: 16 / 9;
height: 100%;
width: auto;
}
}
@media screen and (min-width: 1600px) and (min-aspect-ratio: 1.4) {
.project-video {
height: calc(
var(--window-height) - var(--header-height) - var(--project-title-height) -
5 * var(--gutter)
);
}
.project--video .project-video {
height: calc(
var(--window-height) - var(--header-height) - var(--project-title-height) -
2 * var(--gutter)
);
}
} .page-template-page-project-grid-text-video .texts-side-by-side {
margin: calc(3 * var(--gutter)) 0;
} .single-page {
margin-top: calc(1 * var(--gutter));
position: relative;
}
.single-page__title {
font-size: var(--font-size-base);
font-weight: 400;
line-height: var(--line-height-base);
margin: 0 0 var(--gutter);
max-width: fit-content;
padding: 0;
text-align: left;
}
.single-page__title span {
display: block;
}
.single-page__title span.separator {
display: none;
}
.single-page__title span:nth-child(3) {
border-top: 1px solid var(--color-base-text);
margin-top: 4px;
padding-top: 4px;
}
.single-page__content {
display: grid;
grid-template-columns: 1fr;
}
.single-page__english-scroller {
position: absolute;
right: 0;
top: 0;
}
.toggle-language button,
.scroll-to-english button {
background-color: transparent;
border: 0;
cursor: pointer;
font-size: var(--font-size-base);
line-height: var(--line-height-base);
margin: 0;
padding: 0;
}
@media screen and (max-width: 479px) {
.single-page__content .text:nth-child(3) {
border-top: 1px solid var(--color-base-text);
margin-top: calc(1 * var(--line-height-base));
padding-top: calc(1 * var(--line-height-base));
}
}
@media screen and (min-width: 480px) {
.single-page h1,
.single-page__english-scroller {
display: none;
}
.single-page__content {
display: flex;
}
.single-page__content > .text {
width: calc((100% - (1 * var(--gutter))) / 2);
}
.single-page__content > .spacer {
background-color: var(--color-base-text);
margin-left: calc(0.5 * var(--gutter));
margin-right: calc(0.5 * var(--gutter) - 1px);
width: 1px;
}
}
@media screen and (min-width: 1024px) {
.single-page {
margin-top: 0;
}
.single-page__content > .text {
width: var(--long-text-width);
}
} .project-video-and-text {
margin-top: calc(1 * var(--gutter));
}
.project-video-and-text > div:nth-child(2) iframe {
aspect-ratio: 16 / 9;
height: auto;
width: 100%;
}
.project-video-and-text .project-video-text {
display: none;
}
@media screen and (max-width: 999px) {
.project-video-and-text {
display: grid;
gap: var(--gutter);
grid-template-columns: 1fr;
}
.project-video-and-text > div:nth-child(2) {
grid-row: 1 / span 1;
}
.project-video-and-text .scroll {
position: relative;
}
.project-video-and-text .toggle-language {
position: absolute;
top: 0;
right: 0;
}
.project-video-and-text .scroll .text {
padding-top: calc(2 * var(--line-height-base));
}
}
@media screen and (min-width: 700px) and (max-width: 999px) {
.project-video-and-text {
display: grid;
gap: var(--gutter);
grid-template-columns: repeat(2, 1fr);
}
.project-video-and-text > div:nth-child(2) {
grid-column: 1 / span 2;
grid-row: 1 / span 1;
}
.project-video-and-text > div:nth-child(1) {
grid-column: 1 / span 2;
}
}
@media screen and (min-width: 1000px) {
.page-template-page-project-video-text .site-main {
padding-bottom: 0;
}
.project-video-and-text {
display: grid;
gap: var(--gutter);
grid-template-columns: repeat(2, 1fr);
height: calc(
var(--window-height) - var(--header-height) - 39px - 1 *
var(--line-height-base)
);
}
.project-video-and-text > div,
.project-video-and-text .scroll {
height: 100%;
overflow: hidden;
}
.project-video-and-text .scroll {
height: 100%;
overflow-y: auto;
padding-bottom: var(--gutter);
}
.project-video-and-text > div:nth-child(1) > .scroll > .text {
max-width: calc(100% - 72px);
}
.project-video-and-text > div:nth-child(1) > .scroll > .text:nth-child(2) {
border-top: 1px solid var(--color-base-text);
margin-top: var(--line-height-base);
padding-top: var(--line-height-base);
}
.project-video-and-text .scroll {
position: relative;
}
.project-video-and-text .toggle-language {
position: absolute;
right: 0;
top: 0;
}
}
@media screen and (min-width: 1400px) {
.project-video-and-text {
grid-template-columns: repeat(3, 1fr);
}
.project-video-and-text > div:nth-child(2) {
grid-column: 2 / span 2;
}
} .drawer {
background-color: var(--color-base-background);
bottom: 0;
display: block;
height: 100%;
left: 0;
overflow: hidden;
position: fixed;
top: 0;
transition: transform var(--transition-fast)
var(--transition-timing-function-smooth);
width: 100%;
z-index: 1001;
}
.drawer--right {
border-left: 1px solid var(--color-base-text);
left: auto;
right: 0;
transform: translateX(100%);
}
@media screen and (max-width: 1023px) {
.drawer--right {
border-left: 0;
}
}
.drawer--open.drawer--right {
transform: translateX(0);
}
.drawer-content {
height: calc(100% - 2 * var(--gutter) - var(--icon-height));
overflow-y: auto;
padding: var(--gutter);
}
.drawer-header {
display: flex;
justify-content: flex-end;
padding: var(--gutter);
}
.drawer-close-button {
background-color: transparent;
border: 0;
cursor: pointer;
margin: 0;
padding: 0;
}
.drawer-close-button,
.drawer-close-button svg {
height: var(--icon-height);
}
.drawer-is-open {
overflow: hidden;
pointer-events: none;
user-select: none;
}
.drawer-overlay {
background-color: var(--color-base-background);
inset: 0;
opacity: 0;
pointer-events: none;
position: fixed;
z-index: 1000;
transition: opacity var(--transition-fast)
var(--transition-timing-function-smooth);
}
.drawer-is-open .drawer {
pointer-events: all;
user-select: text;
}
.drawer-is-open .drawer-overlay {
opacity: 0.5;
}
@media screen and (min-width: 1024px) {
.drawer {
width: calc(2 * var(--gutter) + 55ch);
}
} .page-template-page-texts .site-main {
}
.texts {
columns: var(--template-texts-mobile-columns);
gap: var(--gutter);
}
.texts p {
break-inside: avoid;
}
@media screen and (min-width: 768px) {
.texts {
columns: var(--template-texts-tablet-columns);
}
}
@media screen and (min-width: 1024px) {
.texts {
columns: var(--template-texts-desktop-columns);
}
} .text {
font-size: var(--font-size-base);
line-height: var(--line-height-base);
}
.text h1,
.text h2,
.text h3,
.text h4,
.text h5,
.text h6 {
font-size: var(--font-size-base);
font-weight: 700;
line-height: var(--line-height-base);
margin: 0 0 var(--line-height-base);
}
.text p,
.text ul,
.text ol {
margin: 0 0 var(--line-height-base);
}
.text p:last-child,
.text ul:last-child,
.text ol:last-child {
margin: 0;
}
.text a {
text-decoration: underline;
} .grid ul {
display: grid;
grid-template-columns: repeat(var(--grid-mobile-columns), 1fr);
gap: var(--gutter);
list-style: none;
margin: 0;
padding: 0;
width: 100%;
}
.grid .project-link {
margin: 0;
width: 100%;
}
.grid a,
.grid img {
display: block;
height: 100%;
width: 100%;
}
.grid img {
object-fit: cover;
}
@media screen and (min-width: 600px) {
.grid ul {
grid-template-columns: repeat(var(--grid-tablet-columns), 1fr);
}
}
@media screen and (min-width: 900px) {
.grid ul {
grid-template-columns: repeat(var(--grid-desktop-columns), 1fr);
}
} .project-more-galleries-section--no-title {
margin-top: calc(-1 * var(--gutter));
} .texts-side-by-side hr {
display: none;
}
@media screen and (max-width: 599px) {
.texts-side-by-side {
display: grid;
grid-template-columns: 1fr;
overflow: hidden;
padding-top: calc(2 * var(--line-height-base));
position: relative;
}
.texts-side-by-side .spacer {
background-color: var(--color-base-text);
height: 1px;
margin: calc(var(--line-height-base)) 0;
}
.texts-side-by-side button {
border: 0;
background-color: transparent;
display: inline-block;
font-size: var(--font-size-base);
line-height: var(--line-height-base);
padding: 0;
position: absolute;
right: 0;
top: 0;
}
.texts-side-by-side button span {
display: none;
}
.texts-side-by-side[data-current-lang='pt'] button [data-lang='en'],
.texts-side-by-side[data-current-lang='en'] button [data-lang='pt'] {
display: inline-block;
}
.texts-side-by-side .text,
.texts-side-by-side .spacer {
display: none;
opacity: 0;
transition: opacity var(--transition-fast)
var(--transition-timing-function-smooth) allow-discrete;
}
.texts-side-by-side[data-current-lang='pt'] .text[data-lang='pt'],
.texts-side-by-side[data-current-lang='en'] .text[data-lang='en'] {
display: block;
opacity: 1;
}
@starting-style {
.texts-side-by-side[data-current-lang='pt'] .text[data-lang='pt'],
.texts-side-by-side[data-current-lang='en'] .text[data-lang='en'] {
opacity: 0;
}
}
}
@media screen and (min-width: 600px) {
.texts-side-by-side button {
display: none;
}
.texts-side-by-side {
align-items: stretch;
display: flex;
}
.texts-side-by-side > .text {
width: var(--long-text-width);
}
.texts-side-by-side .spacer {
background-color: var(--color-base-text);
margin: 0 calc(0.5 * var(--gutter)) 0 calc(0.5 * var(--gutter) - 1px);
width: 1px;
}
}