/*GLOBALS*/ .siteTheme { --ADM-pink: #BC0656; --ADM-pink-dark: #63032D; --ADM-pink-medium: #900441; --ADM-pink-medium-rgb: 144, 4, 65; --ADM-blue: #068BBC; --ADM-blue-dark: #034963; --ADM-blue-medium: #046A90; --ADM-blue-medium-rgb: 4, 106, 144; --ADM-green: #039750; --ADM-green-medium: #037B41; --ADM-purple: #9747FF; --ADM-black: #000; --ADM-chevron-right: url('data:image/svg+xml,'); --ADM-chevron-down: url('data:image/svg+xml,'); --serif: var(--hydra-headings-font-family); } /* UTILS */ .title-pink, .title-blue, .title-green { margin-bottom: 20px !important; } .title-pink { color: var(--ADM-pink-medium); } .title-blue { color: var(--ADM-blue-medium); } .title-green { color: var(--ADM-green-medium); } .inset-shadow { box-shadow: inset 1px 4px 15px #0000004a; } .font-serif { font-family: var(--serif); } .text-huge { font-size: 60px; } @media (min-width:1400) { .text-huge { font-size: 80px; } } .list-spaced ul>li { margin-bottom: 1rem; } /* CARD */ .card[class*=OverlayCard_card] .card-cta, .card[class*=OverlayCard_card] .hydra-date { color: currentColor !important; } /* Card attività variant 1*/ .grid-variant-1 .card { --bs-card-border-radius: 0; --bs-card-inner-border-radius: 0; color: white; max-width: 320px; } .grid-variant-1 .card img { aspect-ratio: 3/ 4 !important; } .grid-variant-1 .card .breadcrumb { font-size: 12px; } .grid-variant-1 .card p:not(:last-child) { margin-bottom: 0.5rem; } .grid-variant-1 .card [class*=Scrim] { --scrim-dir: to bottom !important; --scrim-opacity: 0.8; } .grid-variant-1 .card [class*=OverlayCard_dateOverImage]:after { content: ""; position: absolute; width: 100%; height: 100%; top: 0; left: 0; background: linear-gradient(var(--scrim-dir), rgba(var(--scrim-rgb), var(--scrim-opacity, 0.6)) 0, rgba(var(--scrim-rgb), 0) 30%); --scrim-dir: to bottom !important; --scrim-rgb: var(--bs-dark-rgb); --scrim-opacity: 0.9; z-index: -1; } /* Card attività variant 2*/ .grid-variant-2 .card .breadcrumb { font-size: 12px; } .grid-variant-1 .card p:not(:last-child) { margin-bottom: 0.5rem; } .grid-variant-2 .card .card-text { font-size: 14px; } .grid-variant-2 .card [class*=CustomCard_dateOverImage] { height: auto; width: auto; top: 8px; left: 8px; background: var(--bs-dark); color: var(--hydra-primary-contrast-text); --bs-card-spacer-y: 2px; --bs-card-spacer-x: 16px; border-radius: 99999px } /* Custom cards - gallery */ .custom-cards [class*=Scrim]:after { background: linear-gradient(var(--scrim-dir), rgba(var(--scrim-rgb), var(--scrim-opacity, .6)) 5%, rgba(var(--scrim-rgb), 0) 40%) !important; --scrim-dir: to top !important; } .custom-cards .hydra-image { overflow: hidden; } .custom-cards .hydra-image img { transition: all .2s; } .custom-cards .hydra-image:hover img { transform: scale(1.1); } /* TODO rimuovere il css precedente*/ /* definitive */ .ADM-card { --bs-border-radius: 16px; } .ADM-card strong { font-weight: 500; } .ADM-card [class*=HydraCarousel] { --swiper-theme-color: var(--card-color, var(--bs-dark)) !important; } .ADM-card [class*=HydraCarousel] .swiper-slide { padding: 14px 6px; } .ADM-card [class*=HydraCarousel] .swiper-button-prev { transform: translate(6px, -50%) !important; } .ADM-card [class*=HydraCarousel] .swiper-button-next { transform: translate(-6px, -50%) !important; } .ADM-card .card { box-shadow: 0 4px 12px #00000040; } .ADM-card .breadcrumb { --bs-breadcrumb-item-active-color: var(--card-medium-color, var(--bs-gray-600)) !important; --bs-breadcrumb-divider-color: var(--card-medium-color, var(--bs-gray-600)) !important; --bs-breadcrumb-divider: "•"; text-transform: initial; font-weight: 500; font-size: 13px; margin-bottom: 8px; } .ADM-card .card-title { color: var(--card-color); } .ADM-card .card-text { color: var(--card-medium-color); } .ADM-card .card-body { border-top: 5px solid var(--card-color, var(--bs-dark)); } .ADM-card .card .hydra-date { --bs-card-spacer-y: 4px; --bs-card-spacer-x: 16px; height: auto; width: auto; top: 8px; left: 8px; background: var(--card-medium-color, var(--bs-dark)); color: white; border-radius: 99999px; padding: var(--bs-card-spacer-y) var(--bs-card-spacer-x); } .ADM-card.simple .card { --bs-card-spacer-y: 1.5rem; } .ADM-card.card-pink { --card-color: var(--ADM-pink); --card-medium-color: var(--ADM-pink-medium); } .ADM-card.card-blue { --card-color: var(--ADM-blue); --card-medium-color: var(--ADM-blue-medium); } .ADM-card.card-green { --card-color: var(--ADM-green); --card-medium-color: var(--ADM-green-medium); } /* HEADER */ header .container-fluid { padding-inline: 0; } header .hydra-logo { padding-inline: 1rem; } header .hydra-navbarMenu .ADM-pink { --main-color: var(--ADM-pink); } header .hydra-navbarMenu .ADM-green { --main-color: var(--ADM-green); } header .hydra-navbarMenu .ADM-blue { --main-color: var(--ADM-blue); } header .hydra-navbarMenu .ADM-purple { --main-color: var(--ADM-purple); } header .hydra-navbarMenu .nav-link .hydra-icon { color: var(--main-color); } header .main-menu .nav-link { flex-direction: column; border-bottom: 8px solid transparent; letter-spacing: 1px; } header .offcanvas-menu .nav-link { border-left: 6px solid transparent; } header .hydra-navbarMenu .nav-link.active { border-color: var(--main-color); } @media screen and (min-width:760px) and (max-width:991.98px) { header .main-menu .nav-link { font-size: 0; gap: 0; } } header .hydra-search .hydra-icon { background-color: var(--ADM-black); border-radius: 50%; padding: 8px; color: white; display: flex; aspect-ratio: 1; } header .navbar-toggler { padding-inline: 0; } header .offcanvas { --bs-offcanvas-padding-x: 0; } header .offcanvas-header { --bs-offcanvas-padding-x: 1rem; } /* FOOTER */ .hydra-footer .nav-link { align-items: baseline !important; } /* HEADINGS */ .hydra-headings.with-image.filtered .headings, .hydra-headings.with-image.filtered .headings-wrapper { background: inherit; } .hydra-headings.with-image .headings-wrapper { display: grid; grid-template-columns: 1fr 460px; width: 100%; } .hydra-headings.with-image.no-subtitle .headings-wrapper { align-items: center; } .hydra-headings.with-image.no-subtitle .headings-wrapper h1:not(:has(+ h2)) { grid-row: 1 / span 2; } .hydra-headings.with-image .headings-wrapper>* { grid-column: 1; } .hydra-headings.with-image .headings-wrapper .hydra-headingsExtraContent { grid-column-start: 2; grid-row: 1/ span 2; display: flex; align-items: center; justify-content: flex-end; } .hydra-headings.with-image .headings-wrapper .hydra-headingsExtraContent .hydra-icon { display: flex; align-items: center; justify-content: center; } .hydra-headings.with-image.filtered .headings-wrapper .hydra-headingsExtraContent img { mix-blend-mode: multiply; } @media screen and (max-width:991.98px) { .hydra-headings.with-image .hydra-headingsExtraContent { display: none !important; } .hydra-headings.with-image .headings-wrapper { grid-template-columns: 1fr !important; } } @media screen and (min-width:992px) { .hydra-headings.with-image.no-subtitle .headings-wrapper { padding-block: 0 !important; } } /* BREADCRUMBS */ .hydra-headings.ADM-pink+.breadcrumbs-wrapper { background-color: var(--ADM-pink-medium); } .hydra-headings.ADM-green+.breadcrumbs-wrapper { background-color: var(--ADM-green-medium); } .hydra-headings.ADM-blue+.breadcrumbs-wrapper { background-color: var(--ADM-blue-medium); } .breadcrumbs-wrapper [aria-label=breadcrumb] { margin: 1rem 0 !important; } .breadcrumbs-wrapper { box-shadow: inset 1px 4px 15px #0000004a; } .breadcrumb .breadcrumb-item a:not(:hover) { text-decoration: none; } .breadcrumb .breadcrumb-item.active { font-weight: 700; } .breadcrumb .breadcrumb-item.active::before { font-weight: 400; } [class*=ADM-].hydra-headings+.breadcrumbs-wrapper .breadcrumb { --bs-breadcrumb-item-active-color: white; --bs-breadcrumb-item-color: white; --bs-breadcrumb-divider-color: white; } .breadcrumbs-wrapper .breadcrumb a { color: var(--bs-breadcrumb-item-color); } /* SWIPER */ [class*="HydraCarousel"]:not([class*="ModalSlider_swiper"]) { --arrow-left: url('data:image/svg+xml,'); --arrow-right: url('data:image/svg+xml,'); --swiper-navigation-color: white; --swiper-mask-size: calc(40px + 0.5vw); --swiper-navigation-arrow-size: 18px; } [class*="HydraCarousel"]:not([class*="ModalSlider_swiper"]) .swiper-button-prev, [class*="HydraCarousel"]:not([class*="ModalSlider_swiper"]) .swiper-button-next { width: var(--swiper-mask-size); height: calc(126 * (var(--swiper-mask-size) / 60)); background-color: var(--swiper-theme-color, var(--bs-primary)); background-size: contain; mask-size: contain !important; transform: translateY(-50%); margin-top: 0; } [class*="HydraCarousel"]:not([class*="ModalSlider_swiper"]) .swiper-button-prev:after, [class*="HydraCarousel"]:not([class*="ModalSlider_swiper"]) .swiper-button-next:after { --swiper-navigation-size: var(--swiper-navigation-arrow-size); } @media screen and (min-width:576px) { [class*="HydraCarousel"]:not([class*="ModalSlider_swiper"]) { --swiper-mask-size: calc(24px + 2vw); --swiper-navigation-arrow-size: 14px; } } @media screen and (min-width:1200px) { [class*="HydraCarousel"]:not([class*="ModalSlider_swiper"]) { --swiper-mask-size: calc(30px + 0.5vw); --swiper-navigation-arrow-size: 18px; } } @media screen and (min-width:1440px) { [class*="HydraCarousel"]:not([class*="ModalSlider_swiper"]) { --swiper-mask-size: 60px; } } [class*="HydraCarousel"]:not([class*="ModalSlider_swiper"]) .swiper-button-prev { -webkit-mask: var(--arrow-left) no-repeat center; mask: var(--arrow-left) no-repeat right center; right: calc(100% - var(--swiper-navigation-size)); left: auto; } [class*="HydraCarousel"]:not([class*="ModalSlider_swiper"]) .swiper-button-next { -webkit-mask: var(--arrow-right) no-repeat center; mask: var(--arrow-right) no-repeat left center; left: calc(100% - var(--swiper-navigation-size)); right: auto; } /* CTA */ .hydra-fileDownload .btn, .hydra-cta .btn { --bs-btn-border-radius: 8px; } .hydra-cta:not(.without-arrow) .btn .d-inline-flex:after { content: ""; display: block; width: 24px; height: 24px; background-color: currentColor; line-height: 1; -webkit-mask: var(--ADM-chevron-right) no-repeat center; mask: var(--ADM-chevron-right) no-repeat center; } .hydra-cta.cta-blue { --bs-primary: var(--ADM-blue-medium); --bs-primary-rgb: var(--ADM-blue-medium-rgb); --hydra-primary-hover: var(--ADM-blue); } .hydra-fileDownload.download-pink, .hydra-cta.cta-pink { --bs-primary: var(--ADM-pink-medium); --hydra-primary-lighter: var(--ADM-pink-medium); --bs-primary-rgb: var(--ADM-pink-medium-rgb); --hydra-primary-hover: var(--ADM-pink); } .hydra-cta.cta-green .btn-light { --bs-btn-color: var(--bs-primary); --bs-btn-hover-color: var(--hydra-primary-hover); } /* DOWNLOAD */ .hydra-fileDownload.download-pink a { --bs-link-hover-color: var(--hydra-primary-lighter); } .ADM-filter .dropdown-toggle { border-radius: 8px; line-height: 1; } .ADM-filter .dropdown-menu .nav-item { --hydra-nav-link-bg: none !important; } .ADM-filter .dropdown-toggle.nav-link:after { content: ""; border: none; transform: none; width: 24px; height: 24px; -webkit-mask: var(--ADM-chevron-down) no-repeat center; mask: var(--ADM-chevron-down) no-repeat center; background-color: currentColor; } /* PAGES */ .ADM-grid-date { background-color: red; } .ADM-list-date .hydra-grid>.row>.col { align-self: center; } /* HOME */ .counter-grid-with-separator>.row>.col:not(:first-child) { border-top: 1px solid var(--bs-primary); } @media (min-width:576px) { .counter-grid-with-separator>.row>.col:not(:nth-child(odd)) { border-left: 1px solid var(--bs-primary); } .counter-grid-with-separator>.row>.col:nth-child(1), .counter-grid-with-separator>.row>.col:nth-child(2) { border-top: none; } } @media (min-width:992px) { .counter-grid-with-separator>.row>.col:not(:first-child) { border-top: none; border-left: 1px solid var(--bs-primary); } }

Elettronica creativa: dal circuito all'interfaccia