/* Main stylesheet */
@import url("https://fonts.googleapis.com/css?family=Playfair+Display");
/* Global Font styles */
* { font-family: "Playfair Display", Georgia, serif !important; font-weight: normal; font-size: 15px; color: #000; text-rendering: optimizeLegibility; }

html { font-size: 16px; }

h1 { font-size: 4rem; letter-spacing: normal; line-height: normal; margin-bottom: 4rem; }

h2 { font-size: 2rem; line-height: 2rem; margin-bottom: 1rem; }

a { color: #000; }

a:hover { color: #cca03c; }

p { font-weight: 400; font-size: 1rem; line-height: 2rem; margin: 2rem 0; }

.italic { font-style: italic !important; letter-spacing: +.1rem; }

.indent { text-indent: 2rem; }

.underline { text-decoration: underline; }

.hero { font-size: 6rem; line-height: 110%; }

/* Structure */
.index { background-color: #fbf8f3; }

.index img { max-width: 100%; }

.index_title { margin-top: 4rem; text-align: center; }

.index_title h1 { margin: 0; }

.index_link { font-size: 4rem; letter-spacing: normal; line-height: normal; color: #000; display: block; text-align: center; }

.index_link a { font-size: 4rem; font-style: italic; text-decoration: none; }

.index_link a:hover { text-decoration: underline; }

.vita { background-color: #fdfaa6; }

.vita-exhibitons, .vita-list { margin-top: 2rem; }

.vita-exhibitons h2, .vita-list h2 { margin-top: 2rem; }

.vita-exhibitons h2:first-child, .vita-list h2:first-child { margin: 0; }

.vita-exhibitons p, .vita-list p { margin: 0 0 1rem 0; }

.vita-list { margin-top: 4rem; }

.kontakt { background-color: #e08d8c; }

.kontakt a:hover { color: #f0f0f0; }

.kontakt .navigation-bar a:hover { color: #f0f0f0; }

.kontakt-list h1 { margin: 4rem 0 1rem 0; }

.content-01 { background-color: #ccc; color: #cca03c; padding-top: 64px; }

.content-02 { background-color: brightness(#362db2, 25); color: #282828; }

.content-container { padding: 4rem 0; }

.content-title { margin-top: 2rem; }

.content-gallery h1 { color: #464646; margin-bottom: 1rem; }

.content-gallery img { max-width: 100%; margin-bottom: 4rem; }

.augenblick { width: 100%; background-color: #fdfaa6; }

.gespraech { width: 100%; background-color: #464646; }

.gespraech h1 { color: #f0f0f0; }

.gespraech p { color: #f0f0f0; }

.gespraech .italic { color: #f0f0f0; }

.bildverzeichnis { width: 100%; background-color: #f6efde; }

.bildverzeichnis h1, .bildverzeichnis .italic { font-size: 4rem; margin: 1rem 0; }

.bildverzeichnis p { margin: 0; }

.navigation-bar { z-index: 10; position: fixed; top: 0; left: 0; height: 48px; width: 100%; padding: 1rem; background: none; text-align: left; color: #000; }

.navigation-bar a { font-size: 2rem; text-decoration: underline; font-style: italic; color: #000; }

.navigation-bar a:hover { text-decoration: underline; color: #cca03c; }

.footer { width: 100%; text-align: center; font-size: 4rem; letter-spacing: normal; line-height: normal; color: #000; display: block; float: none; clear: left; }

.footer a { font-size: inherit; font-style: normal; text-decoration: none; }

.footer a:hover { text-decoration: underline; }

@media all and (max-width: 768px) { html { font-size: 14px; }
  h1 { font-size: 3rem; line-height: 3.5rem; margin-bottom: 1rem; }
  p { margin: 1rem 0; }
  .hero { font-size: 4rem; }
  .content-title { margin-top: 4rem; }
  .content-container { padding: 2rem 0; }
  .content-gallery img { max-width: 100%; }
  .vita-list, .vita-exhibitons { margin-top: 2rem; }
  .bildverzeichnis { width: 100%; background-color: #f6efde; }
  .bildverzeichnis h1, .bildverzeichnis .italic { font-size: 2rem; margin: .5rem 0; }
  .bildverzeichnis p { font-size: 1rem; margin: 0; }
  .index_link { line-height: 3rem; text-align: center; }
  .index_link a { font-size: 3rem; line-height: 3rem; }
  .footer { font-size: 3rem; } }