/******* Do not edit this file ******* Simple Custom CSS and JS - by Silkypress.com Saved: Dec 16 2025 | 15:58:11 */ /*********************** * VARIABILI / BASE ***********************/ :root{ --header-h: 90px; /* altezza barra */ --adminbar-h: 0px; /* viene cambiata quando sei loggato */ } html,body{margin:0;padding:0} #wpadminbar{position:fixed;top:0} body.admin-bar{ --adminbar-h:32px } @media (max-width:782px){ body.admin-bar{ --adminbar-h:46px }} /*********************** * HEADER (glass 40%) ***********************/ .wp-site-blocks > header.wp-block-template-part{ position:fixed; top:var(--adminbar-h); left:0; right:0; z-index:9999; min-height:var(--header-h); background:rgba(255,255,255,.8) !important; /* vetro iniziale */ backdrop-filter:blur(6px); -webkit-backdrop-filter:blur(6px); box-shadow:none !important; overflow:visible !important; transition:background-color .3s ease, box-shadow .3s ease; } header.wp-block-template-part, header.wp-block-template-part *{ background:transparent !important; border:0 !important; box-shadow:none !important; } header.wp-block-template-part a{ color:#111 !important } /* stato dopo scroll – richiede la classe .scrolled sul (già inserita dallo script) */ body.scrolled header.wp-block-template-part{ background:#fff !important; backdrop-filter:blur(10px); -webkit-backdrop-filter:blur(10px); box-shadow:0 6px 18px rgba(0,0,0,.08) !important; } body.scrolled header.wp-block-template-part a{ color:#111 !important } /************************************ * ELIMINA LO SPAZIO BIANCO IN ALTO ************************************/ /* niente block-gap globale tra fratelli */ .wp-site-blocks{ --wp--style--block-gap:0 !important; padding-top:0 !important } /* nessun margine per l’elemento subito dopo l’header (la cover) */ .wp-site-blocks > header.wp-block-template-part + *{ margin-top:0 !important; margin-block-start:0 !important; } /* TT25 impone 1.2rem ai figli constrained: annulla solo dopo l’header */ :root :where(.is-layout-constrained) > header.wp-block-template-part + *{ margin-block-start:0 !important; } /*********************** * COVER VIDEO (hero) ***********************/ /* Regole generali per eliminare margini indesiderati */ .wp-block-cover{ margin-top:0 !important; margin-block-start:0 !important } /* Regola per il tuo specifico blocco Hero-Video */ #hero-video.wp-block-cover.alignfull{ /* Questa regola era 100vh, ma il tuo blocco ora ha style="min-height:400px;aspect-ratio:unset;" Quindi riprendiamo il 100vh solo per quello specifico ID, se è ciò che vuoi. Se invece volevi i 400px, ignora questa riga. */ min-height:85vh !important; } /* Regola per il video all'interno del blocco (OK, non crea conflitti) */ .wp-block-cover__video-background{ width:100%; height:100%; object-fit:cover } /******************************** * MENU MOBILE (overlay pulito) ********************************/ /* Quando il menu è aperto WordPress usa .has-modal-open sul body. In quel momento togliamo il fixed all’header (per evitare “gabbie”) e rendiamo il pannello del menu FULLSCREEN. */ body.has-modal-open header.wp-block-template-part{ position:static !important; backdrop-filter:none !important; -webkit-backdrop-filter:none !important; } body.has-modal-open .wp-block-navigation__responsive-container.is-menu-open{ position:fixed !important; inset:0; top:var(--adminbar-h); z-index:10000 !important; background:rgba(255,255,255,.98) !important; backdrop-filter:blur(8px); -webkit-backdrop-filter:blur(8px); padding-top:var(--header-h); overflow-y:auto !important; display:flex; flex-direction:column; align-items:center; } body.has-modal-open .wp-block-navigation__responsive-container.is-menu-open a{ color:#111 !important; font-size:1.1rem; padding:.9rem 0; text-align:center; } /* Fallback: se il tuo WP non aggiunge .has-modal-open, prendi il contenitore del menu quando è realmente “aperto” e forzalo fullscreen. */ @media (max-width:960px){ .wp-block-navigation__responsive-container.is-menu-open, .wp-block-navigation__responsive-container[aria-hidden="false"]{ position:fixed !important; inset:0; top:calc(var(--adminbar-h) + var(--header-h)); height:calc(100vh - var(--adminbar-h) - var(--header-h)) !important; z-index:10000 !important; background:rgba(255,255,255,.98) !important; overflow-y:auto !important; display:block !important; } .wp-block-navigation__responsive-container-open, .wp-block-navigation__responsive-container-close{ z-index:10001 !important } } /* Contenitore del blocco */ .hover-card { /* sovrascrive il background inline del blocco */ background: linear-gradient(180deg, #279BDE 0%, #214588 100%) !important; padding: 1.5rem; text-align: center; border-radius: 8px; transition: background 0.2s ease, box-shadow 0.2s ease, transform 0.2s ease; } /* Effetto hover sul blocco intero */ .hover-card:hover { background: linear-gradient(180deg, #0D6EFD 0%, #11449C 100%) !important; box-shadow: 0 8px 16px rgba(0, 0, 0, 0.15); transform: translateY(-2px); } /****************************************** * PAGINA PRENOTAZIONI ORMEGGI (ID 635) * - Hero compatto * - Contenuto sotto l'header fisso * - Niente onda automatica ******************************************/ /* 1) Hero compatto e allineato sotto il menu */ body.page-id-635 main .wp-block-cover.alignfull:first-of-type { position: relative; /* il contenuto (titolo) parte sotto l'header fisso */ padding-top: calc(var(--header-h) + var(--adminbar-h) + 10px); /* altezza hero "normale", non 100vh */ min-height: 320px !important; height: auto !important; } /* 2) Niente onda sotto la cover in questa pagina */ body.page-id-635 .wp-site-blocks main .wp-block-cover.alignfull:first-of-type::after { content: none !important; } /* ==== FORM PRENOTAZIONE ORMEGGI (Contact Form 7) ==== */ .cf7-ormeggio { max-width: none; width: 100%; margin: 0 auto 40px; font-size: 16px; } /* Fieldset “card” moderne */ .cf7-ormeggio fieldset { border: 1px solid #e0e4f4; border-radius: 12px; padding: 22px 22px 18px; margin: 0 0 24px; background: #ffffff; box-shadow: 0 14px 40px rgba(0,0,0,.04); } .cf7-ormeggio legend { font-size: 1.15rem; font-weight: 700; color: #221550; padding: 0 8px; } /* Spaziatura base tra righe del form */ .cf7-ormeggio p { margin: 0 0 14px; } /* Etichette */ .cf7-ormeggio label { display: block; font-size: .95rem; font-weight: 600; margin-bottom: 6px; color: #27195c; } /* Campi input/select/textarea */ .cf7-ormeggio input[type="text"], .cf7-ormeggio input[type="email"], .cf7-ormeggio input[type="tel"], .cf7-ormeggio select, .cf7-ormeggio textarea { width: 100%; box-sizing: border-box; margin:5px; padding: 10px 14px; border-radius: 12px !important; border: 1px solid #d4d9ea; background: #f6f7fc; font-size: .95rem; outline: none; transition: border-color .18s ease, box-shadow .18s ease, background-color .18s ease; } /* Focus */ .cf7-ormeggio input[type="text"]:focus, .cf7-ormeggio input[type="email"]:focus, .cf7-ormeggio input[type="tel"]:focus, .cf7-ormeggio select:focus, .cf7-ormeggio textarea:focus { border-color: #295bb8; background: #ffffff; box-shadow: 0 0 0 2px rgba(41,91,184,.15); } /* Placeholder più chiaro */ .cf7-ormeggio ::placeholder { color: #9aa0bf; } /* Select più compatta */ .cf7-ormeggio select { border-radius: 12px; } /* --- Layout a due colonne dove ha senso (desktop) --- */ /* Lunghezza + Larghezza affiancate nel fieldset "Caratteristiche imbarcazione" */ @media (min-width: 720px){ .cf7-ormeggio fieldset:nth-of-type(2) p:nth-of-type(2), .cf7-ormeggio fieldset:nth-of-type(2) p:nth-of-type(3), .cf7-ormeggio fieldset:nth-of-type(2) p:nth-of-type(4) { display: inline-block; width: calc(30% ); /* o 30% se vuoi più spazio tra loro */ vertical-align: top; } /* aggiungo spazio orizzontale tra la 1ª e la 2ª colonna */ .cf7-ormeggio fieldset:nth-of-type(2) p:nth-of-type(2), .cf7-ormeggio fieldset:nth-of-type(2) p:nth-of-type(3) { margin-right: 24px; /* AUMENTA QUI per più distanza */ } /* niente margine a destra sull’ultima, così non va a capo */ .cf7-ormeggio fieldset:nth-of-type(2) p:nth-of-type(4) { margin-right: 0; } } /* Dati personali affiancati */ @media (min-width: 720px){ .cf7-ormeggio fieldset:nth-of-type(3) p { display: inline-block; width: calc(40% ); margin-right: 24px; } } /* Arrivo / Partenza affiancati */ @media (min-width: 720px){ .cf7-ormeggio fieldset:nth-of-type(4) p { display: inline-block; width: calc(40% ); margin-right: 24px; } } /* In mobile tornano a tutta larghezza */ @media (max-width: 719px){ .cf7-ormeggio fieldset p { display: block; width: 100%; } } /* Checkbox privacy */ .cf7-ormeggio input[type="checkbox"] { width: auto; margin-right: 8px; } .cf7-ormeggio fieldset:last-of-type label { display: flex; align-items: flex-start; gap: 8px; font-size: .9rem; } .cf7-ormeggio fieldset:last-of-type a { color: #295bb8; text-decoration: underline; } /* Bottoni INVIA / RESET */ .cf7-ormeggio .wpcf7-form-control.wpcf7-submit, .cf7-ormeggio input[type="submit"] { display: inline-block; border: none; border-radius: 12px; color:#FFF; width:100%; padding: 12px 30px; border-radius: 25px; background: linear-gradient(0deg, rgb(230, 179, 92) 0%, rgb(156, 109, 28) 100%); font-weight: 800; font-size: .95rem; text-transform: uppercase; letter-spacing: .04em; cursor: pointer; transition: transform .12s ease, box-shadow .12s ease, opacity .12s ease; } .cf7-ormeggio .wpcf7-form-control.wpcf7-submit:hover, .cf7-ormeggio input[type="submit"]:hover { transform: translateY(-1px); box-shadow: 0 10px 22px rgba(0,0,0,.16); opacity: .96; } /* eventuale bottone reset che hai aggiunto come