/*
Theme Name: Carolina Pastoriza Hausmann
Theme URI: https://pastoriza.co/
Author: Carolina Pastoriza Hausmann
Description: Sitio web final de Carolina Pastoriza Hausmann. Las ocho composiciones visuales son las páginas aprobadas del sitio.
Version: 1.0.3
Text Domain: carolina-pastoriza
*/

html, body { margin:0; padding:0; background:#102b20; }
body { overflow-x:hidden; }
.site-page { position:relative; width:100%; min-height:100vh; display:flex; justify-content:center; align-items:flex-start; background:#102b20; }
.site-page img { display:block; width:auto; height:auto; max-width:100%; }
.site-page .page-image { width:auto; max-width:100%; }
.hotspot { position:absolute; display:block; z-index:5; background:transparent; }
.hotspot:focus-visible { outline:2px solid rgba(210,178,105,.8); outline-offset:2px; }

/* The navigation is already part of each approved page image. These are invisible click areas only. */
.home-nav-obra, .home-nav-mundo, .home-nav-carolina, .home-nav-contacto { left:0; width:14%; }
.home-nav-obra { top:17%; height:7%; }
.home-nav-mundo { top:26%; height:7%; }
.home-nav-carolina { top:36%; height:7%; }
.home-nav-contacto { top:45%; height:7%; }

.page-nav-obra, .page-nav-mundo, .page-nav-carolina, .page-nav-contacto { left:0; width:14%; }
.page-nav-obra { top:17%; height:7%; }
.page-nav-mundo { top:26%; height:7%; }
.page-nav-carolina { top:36%; height:7%; }
.page-nav-contacto { top:45%; height:7%; }

/* Obra page: three visible sections are clickable without changing the artwork. */
.obra-link-oleo { left:22%; top:72%; width:22%; height:20%; }
.obra-link-grabado { left:47%; top:72%; width:23%; height:20%; }
.obra-link-digital { left:72%; top:72%; width:25%; height:20%; }

/* Contact page: clickable email and Instagram areas, while the approved artwork remains untouched. */
.contact-email { left:0; top:33%; width:55%; height:10%; }
.contact-instagram { left:0; top:47%; width:55%; height:10%; }

@media (max-width:700px) {
  .site-page { min-height:auto; }
  .site-page img { width:100%; max-width:none; }
}