/* Port of the WP theme "nicolas" (underscores) + grids plugin layout */
*, *::before, *::after { box-sizing: border-box; }
body { margin: 0; background: #fff; color: #000; font: 12px/1.5 'Roboto Mono', Consolas, monospace; }
a { color: #000; }
img { display: block; max-width: 100%; height: auto; }
h2 { font-size: 1.5em; margin: 0 0 .5em; }
p { margin: 0 0 1.5em; }

#masthead { position: fixed; top: 100px; left: 100px; }
#masthead p { margin: 0; }
.site-title a { font-size: 16px; font-weight: bold; text-decoration: none; }
.tiret { margin: 0 0 2.5em !important; line-height: 0; }
nav ul { list-style: none; margin: 0; padding: 0; }
nav li { padding-bottom: 10px; }
nav a { text-decoration: none; }
nav a:hover { font-weight: bold; }
nav .current a { text-decoration: underline; }
.instagram { display: inline-block; margin-top: 20px; }

#primary { margin: 100px auto 50px 350px; max-width: 1200px; min-width: 800px; }
@media (max-width: 1570px) {
  #masthead { position: static; margin: 30px 50px; }
  #primary { margin: 80px 50px 50px; min-width: 0; }
}
@media (min-width: 1800px) { #primary { margin: 100px 350px 50px; max-width: 1500px; } }

.grid { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); align-items: start; }
.grid > div, .projects > a { padding: 0 0 15px 15px; }
[style*="text-align:right"] img { margin-left: auto; }
.grid p:has(> img:only-child), .grid p:has(> a:only-child > img) { margin: 0; }
.projects { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); }
.projects > a:nth-child(3n+1) { grid-column-start: 1; }
.projects img, .grid a img { transition: transform .05s linear; }
.projects a:hover img, .grid a:hover img { transform: scale(.97); }
.projects a:active img, .grid a:active img { transform: scale(.95); }
@media (max-width: 768px) {
  .grid, .projects { display: flex; flex-direction: column; }
  .grid > div, .projects > a { padding: 0 0 15px !important; width: 100%; }
}