/* Lo que necesita WordPress y no existe en la maqueta. Va aparte para que main.css siga siendo copia literal de maqueta/css/style.css y se pueda resincronizar de un cp. */ /* Trampa antispam del formulario: tiene que existir en el DOM y ser inalcanzable para una persona. display:none la esconde de los lectores de pantalla tambien, que es lo que se busca: no es un campo real. */ .pumayna-hp { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; } /* Contenedor de las paginas que edita el builder y de la ficha suelta. */ .page-content { max-width: 1100px; margin: 0 auto; padding: 64px 48px 88px; } .page-content > *:first-child { margin-top: 0; } /* WPBakery mete sus rows a ancho completo: adentro de .page-content ya tienen el ancho del sitio, asi que se les saca el padding lateral propio. */ .page-content .vc_row { margin-left: 0; margin-right: 0; } /* Barra de admin: el header no es fixed, asi que no hace falta compensar, pero el hero a pantalla completa si se pasa de alto. */ .admin-bar .hero-video-wrap { min-height: calc(100vh - 32px); } @media (max-width: 782px) { .admin-bar .hero-video-wrap { min-height: calc(100vh - 46px); } } /* WordPress emite width y height como atributos del (bien: evitan el salto de layout). Pero el atributo height gana sobre el aspect-ratio del CSS, que solo se aplica cuando una de las dos medidas es auto. En la maqueta los no tenian atributos y el problema no existia. Solo hace falta donde el diseño depende del aspect-ratio: la grilla de cards, el hero y el proceso ya fijan height:100% y no se ven afectados. */ .gallery-grid img, .plans-grid img { height: auto; } /* Imagenes de WP dentro del contenido. */ .page-content img, .listing-desc img { max-width: 100%; height: auto; } .alignleft { float: left; margin: 0 24px 16px 0; } .alignright { float: right; margin: 0 0 16px 24px; } .aligncenter { display: block; margin: 0 auto 16px; } /* the_content() envuelve la descripcion de la ficha en

; la maqueta ya le da estilo al

, pero el margen de arriba del primero sobra. */ .listing-desc > p:first-child { margin-top: 0; } @media (max-width: 900px) { .page-content { padding: 40px 24px 64px; } } /* ---------- paginas armadas con WPBakery ---------- Las secciones del tema son a ancho completo y cada una trae su propio padding: la fila y la columna del builder solo tienen que dejarlas pasar. Sin esto la fila resta 15px por lado y la columna los vuelve a sumar, y las franjas de color quedan con un borde claro de un costado. */ .pumayna-secciones .vc_row { margin-left: 0; margin-right: 0; } .pumayna-secciones .vc_column_container, .pumayna-secciones .vc_column_container > .vc_column-inner { padding-left: 0; padding-right: 0; } /* Un elemento de los que trae WPBakery (texto, imagen, boton) no tiene padding propio, asi que suelto en una de estas paginas quedaria pegado al borde de la pantalla. Se le da el ancho y el aire del resto del sitio. */ .pumayna-secciones .wpb_content_element { max-width: 1120px; margin-left: auto; margin-right: auto; padding-left: 24px; padding-right: 24px; } @media (max-width: 900px) { .pumayna-secciones .wpb_content_element { padding-left: 20px; padding-right: 20px; } } /* El menu mobile no tiene que empezar debajo de la barra de admin. .site-nav es position:fixed y arranca a --header-h del borde de la ventana. Con la barra de admin puesta, WordPress mete un margin-top en el y el header baja, pero el menu sigue arrancando donde arrancaba: le queda encima y tapa el logo. Solo lo ve quien esta logueado —un visitante nunca—, pero es justo el caso en el que el cliente revisa el sitio desde el telefono. Los dos valores son los de WordPress: 46px hasta 782 y 32 de ahi para arriba. Pasando los 900 el menu deja de ser fixed y no hace falta nada. */ @media (max-width: 782px) { .admin-bar .site-nav { top: calc(var(--header-h) + 46px); } } @media (min-width: 783px) and (max-width: 900px) { .admin-bar .site-nav { top: calc(var(--header-h) + 32px); } }