<nav class="c-menu o-bg-dark u-shadow-bottom u-size-full u-pt-base@md is-open u-top " data-menu>
<div class="c-menu__search o-container u-justify-between u-column u-row@md u-my-base">
<div class="u-relative">
<input class="u-size-full " type="text" placeholder="Cerca nel sito">
<button class="c-form-action c-btn c-btn--reset u-absolute u-cursor-pointer" type="submit">
<svg class="c-form-icon o-icon o-icon--md">
<use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#icon-search"></use>
</svg>
</button>
</div>
</div>
<div class="o-container u-flex u-justify-between u-column u-row@md u-mb-large">
<div tabindex="1" class="c-menu__group u-relative u-z-cover u-size-1-5@md " data-group data-channel="/notizie/">
<input type="radio" id="Notizie" name="navigation" value="Notizie" class="u-absolute u-size-full u-right u-top u-z-cover u-opacity-none u-none@md">
<div class="c-menu__title u-flex u-justify-between u-justify-center">
<a class="c-menu__link u-a-underline u-relative u-no-underline" href="#">Notizie</a>
<div data-title>
<svg class="c-menu__icon o-icon o-icon--inverse o-icon--md u-none@md u-cursor-pointer u-block" data-arrow>
<use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#icon-chevron-down"></use>
</svg>
</div>
</div>
<ul class="c-menu__list u-list-none u-justify-between u-wrap">
<li class='c-menu__item u-size-1-2 u-size-full@md u-pt-xsmall u-pb-xsmall'>
<a class='c-menu__link u-a-underline u-relative u-no-underline u-nav-03' href="">Politica</a>
</li>
<li class='c-menu__item u-size-1-2 u-size-full@md u-pt-xsmall u-pb-xsmall'>
<a class='c-menu__link u-a-underline u-relative u-no-underline u-nav-03' href="">Economia</a>
</li>
<li class='c-menu__item u-size-1-2 u-size-full@md u-pt-xsmall u-pb-xsmall'>
<a class='c-menu__link u-a-underline u-relative u-no-underline u-nav-03' href="">Europa</a>
</li>
<li class='c-menu__item u-size-1-2 u-size-full@md u-pt-xsmall u-pb-xsmall'>
<a class='c-menu__link u-a-underline u-relative u-no-underline u-nav-03' href="">Cronaca</a>
</li>
<li class='c-menu__item u-size-1-2 u-size-full@md u-pt-xsmall u-pb-xsmall'>
<a class='c-menu__link u-a-underline u-relative u-no-underline u-nav-03' href="">Mondo</a>
</li>
<li class='c-menu__item u-size-1-2 u-size-full@md u-pt-xsmall u-pb-xsmall'>
<a class='c-menu__link u-a-underline u-relative u-no-underline u-nav-03' href="">Ambiente</a>
</li>
<li class='c-menu__item u-size-1-2 u-size-full@md u-pt-xsmall u-pb-xsmall'>
<a class='c-menu__link u-a-underline u-relative u-no-underline u-nav-03' href="">Green</a>
</li>
<li class='c-menu__item u-size-1-2 u-size-full@md u-pt-xsmall u-pb-xsmall'>
<a class='c-menu__link u-a-underline u-relative u-no-underline u-nav-03' href="">Attualità</a>
</li>
<li class='c-menu__item u-size-1-2 u-size-full@md u-pt-xsmall u-pb-xsmall'>
<a class='c-menu__link u-a-underline u-relative u-no-underline u-nav-03' href="">Città</a>
</li>
</ul>
</div>
<div tabindex="1" class="c-menu__group u-relative u-z-cover u-size-1-5@md is-active " data-group data-channel="/lifestyle/">
<input type="radio" id="Lifestyle" name="navigation" value="Lifestyle" class="u-absolute u-size-full u-right u-top u-z-cover u-opacity-none u-none@md">
<div class="c-menu__title u-flex u-justify-between u-justify-center">
<a class="c-menu__link u-a-underline u-relative u-no-underline" href="#">Lifestyle</a>
<div data-title>
<svg class="c-menu__icon o-icon o-icon--inverse o-icon--md u-none@md u-cursor-pointer u-block" data-arrow>
<use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#icon-chevron-down"></use>
</svg>
</div>
</div>
<ul class="c-menu__list u-list-none u-justify-between u-wrap">
<li class='c-menu__item u-size-1-2 u-size-full@md u-pt-xsmall u-pb-xsmall'>
<a class='c-menu__link u-a-underline u-relative u-no-underline u-nav-03' href="">Benessere</a>
</li>
<li class='c-menu__item u-size-1-2 u-size-full@md u-pt-xsmall u-pb-xsmall'>
<a class='c-menu__link u-a-underline u-relative u-no-underline u-nav-03' href="">Casa</a>
</li>
<li class='c-menu__item u-size-1-2 u-size-full@md u-pt-xsmall u-pb-xsmall'>
<a class='c-menu__link u-a-underline u-relative u-no-underline u-nav-03' href="">Cucina</a>
</li>
<li class='c-menu__item u-size-1-2 u-size-full@md u-pt-xsmall u-pb-xsmall'>
<a class='c-menu__link u-a-underline u-relative u-no-underline u-nav-03' href="">Donna</a>
</li>
<li class='c-menu__item u-size-1-2 u-size-full@md u-pt-xsmall u-pb-xsmall'>
<a class='c-menu__link u-a-underline u-relative u-no-underline u-nav-03' href="">Gossip</a>
</li>
<li class='c-menu__item u-size-1-2 u-size-full@md u-pt-xsmall u-pb-xsmall'>
<a class='c-menu__link u-a-underline u-relative u-no-underline u-nav-03' href="">Salute</a>
</li>
<li class='c-menu__item u-size-1-2 u-size-full@md u-pt-xsmall u-pb-xsmall'>
<a class='c-menu__link u-a-underline u-relative u-no-underline u-nav-03' href="">Viaggi</a>
</li>
<li class='c-menu__item u-size-1-2 u-size-full@md u-pt-xsmall u-pb-xsmall'>
<a class='c-menu__link u-a-underline u-relative u-no-underline u-nav-03' href="">Spettacoli</a>
</li>
<li class='c-menu__item u-size-1-2 u-size-full@md u-pt-xsmall u-pb-xsmall'>
<a class='c-menu__link u-a-underline u-relative u-no-underline u-nav-03' href="">Motori</a>
</li>
</ul>
</div>
<div tabindex="1" class="c-menu__group u-relative u-z-cover u-size-1-5@md " data-group data-channel="/cultura/">
<input type="radio" id="Cultura" name="navigation" value="Cultura" class="u-absolute u-size-full u-right u-top u-z-cover u-opacity-none u-none@md">
<div class="c-menu__title u-flex u-justify-between u-justify-center">
<a class="c-menu__link u-a-underline u-relative u-no-underline" href="#">Cultura</a>
<div data-title>
<svg class="c-menu__icon o-icon o-icon--inverse o-icon--md u-none@md u-cursor-pointer u-block" data-arrow>
<use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#icon-chevron-down"></use>
</svg>
</div>
</div>
<ul class="c-menu__list u-list-none u-justify-between u-wrap">
<li class='c-menu__item u-size-1-2 u-size-full@md u-pt-xsmall u-pb-xsmall'>
<a class='c-menu__link u-a-underline u-relative u-no-underline u-nav-03' href="">Cinena</a>
</li>
<li class='c-menu__item u-size-1-2 u-size-full@md u-pt-xsmall u-pb-xsmall'>
<a class='c-menu__link u-a-underline u-relative u-no-underline u-nav-03' href="">Eventi</a>
</li>
<li class='c-menu__item u-size-1-2 u-size-full@md u-pt-xsmall u-pb-xsmall'>
<a class='c-menu__link u-a-underline u-relative u-no-underline u-nav-03' href="">Formazione</a>
</li>
<li class='c-menu__item u-size-1-2 u-size-full@md u-pt-xsmall u-pb-xsmall'>
<a class='c-menu__link u-a-underline u-relative u-no-underline u-nav-03' href="">Scienze</a>
</li>
</ul>
</div>
<div tabindex="1" class="c-menu__group u-relative u-z-cover u-size-1-5@md " data-group data-channel="/opinioni/">
<input type="radio" id="Opinioni" name="navigation" value="Opinioni" class="u-absolute u-size-full u-right u-top u-z-cover u-opacity-none u-none@md">
<div class="c-menu__title u-flex u-justify-between u-justify-center">
<a class="c-menu__link u-a-underline u-relative u-no-underline" href="#">Opinioni</a>
<div data-title>
<svg class="c-menu__icon o-icon o-icon--inverse o-icon--md u-none@md u-cursor-pointer u-block" data-arrow>
<use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#icon-chevron-down"></use>
</svg>
</div>
</div>
<ul class="c-menu__list u-list-none u-justify-between u-wrap">
<li class='c-menu__item u-size-1-2 u-size-full@md u-pt-xsmall u-pb-xsmall'>
<a class='c-menu__link u-a-underline u-relative u-no-underline u-nav-03' href="">Asso di denari</a>
</li>
<li class='c-menu__item u-size-1-2 u-size-full@md u-pt-xsmall u-pb-xsmall'>
<a class='c-menu__link u-a-underline u-relative u-no-underline u-nav-03' href="">Cronache marziane</a>
</li>
<li class='c-menu__item u-size-1-2 u-size-full@md u-pt-xsmall u-pb-xsmall'>
<a class='c-menu__link u-a-underline u-relative u-no-underline u-nav-03' href="">Curarsi mangiando</a>
</li>
<li class='c-menu__item u-size-1-2 u-size-full@md u-pt-xsmall u-pb-xsmall'>
<a class='c-menu__link u-a-underline u-relative u-no-underline u-nav-03' href="">Famiglia creativa</a>
</li>
<li class='c-menu__item u-size-1-2 u-size-full@md u-pt-xsmall u-pb-xsmall'>
<a class='c-menu__link u-a-underline u-relative u-no-underline u-nav-03' href="">FotoGrammi</a>
</li>
</ul>
</div>
<div tabindex="1" class="c-menu__group u-relative u-z-cover u-size-1-5@md " data-group data-channel="">
<input type="radio" id="Altre sezioni" name="navigation" value="Altre sezioni" class="u-absolute u-size-full u-right u-top u-z-cover u-opacity-none u-none@md">
<div class="c-menu__title u-flex u-justify-between u-justify-center">
<a class="c-menu__link u-a-underline u-relative u-no-underline" href="#">Altre sezioni</a>
<div data-title>
<svg class="c-menu__icon o-icon o-icon--inverse o-icon--md u-none@md u-cursor-pointer u-block" data-arrow>
<use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#icon-chevron-down"></use>
</svg>
</div>
</div>
<ul class="c-menu__list u-list-none u-justify-between u-wrap">
<li class='c-menu__item u-size-1-2 u-size-full@md u-pt-xsmall u-pb-xsmall'>
<a class='c-menu__link u-a-underline u-relative u-no-underline u-nav-03' href="">Foto</a>
</li>
<li class='c-menu__item u-size-1-2 u-size-full@md u-pt-xsmall u-pb-xsmall'>
<a class='c-menu__link u-a-underline u-relative u-no-underline u-nav-03' href="">Video</a>
</li>
<li class='c-menu__item u-size-1-2 u-size-full@md u-pt-xsmall u-pb-xsmall'>
<a class='c-menu__link u-a-underline u-relative u-no-underline u-nav-03' href="">Best - Guida allo shopping</a>
</li>
</ul>
</div>
<div tabindex="1" class="c-menu__group u-relative u-z-cover u-size-1-5@md " data-group data-channel="">
<input type="radio" id="Dossier" name="navigation" value="Dossier" class="u-absolute u-size-full u-right u-top u-z-cover u-opacity-none u-none@md">
<div class="c-menu__title u-flex u-justify-between u-justify-center">
<a class="c-menu__link u-a-underline u-relative u-no-underline" href="#">Dossier</a>
<div data-title>
<svg class="c-menu__icon o-icon o-icon--inverse o-icon--md u-none@md u-cursor-pointer u-block" data-arrow>
<use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#icon-chevron-down"></use>
</svg>
</div>
</div>
<ul class="c-menu__list u-list-none u-justify-between u-wrap">
<li class='c-menu__item u-size-1-2 u-size-full@md u-pt-xsmall u-pb-xsmall'>
<a class='c-menu__link u-a-underline u-relative u-no-underline u-nav-03' href="">Demo item</a>
</li>
</ul>
</div>
<div class="u-text-center u-px-small u-my-base u-none@md">
<a href="/user/login/" class="c-btn c-btn--primary u-no-underline">
<svg class="o-icon o-icon--md">
<use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#icon-user"></use>
</svg>
Accedi
</a>
</div>
</div>
<div class="u-size-full u-mt-base u-mb-base u-none@md">
<div class="u-none@md u-flex u-column u-items-center o-container">
<div class="c-modetoggle u-inline-flex">
<label class="u-pointer c-modetoggle__label u-relative" aria-label="Modalità light">
<input type="radio" value="-1" class="u-none" data-color-scheme="-1">
<svg class="c-modetoggle__icon u-m-xsmall o-icon o-icon--animated o-icon--sm u-cursor-pointer">
<use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#icon-sun"></use>
</svg>
</label>
<label class="u-pointer c-modetoggle__label u-relative" aria-label="Modalità di sistema">
<input type="radio" value="0" class="u-none" data-color-scheme="0">
<svg class="c-modetoggle__icon u-m-xsmall o-icon o-icon--animated o-icon--sm u-cursor-pointer">
<use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#icon-monitor"></use>
</svg>
</label>
<label class="u-pointer c-modetoggle__label u-relative" aria-label="Modalità dark">
<input type="radio" value="1" class="u-none" data-color-scheme="1">
<svg class="c-modetoggle__icon u-m-xsmall o-icon o-icon--animated o-icon--sm u-cursor-pointer">
<use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#icon-moon"></use>
</svg>
</label>
</div>
<a class="u-mt-base" href="#" target="_blank" rel="noopener noreferrer">
<svg class="c-brand-cn" width="91" height="24">
<use xlink:href="#brand-citynews"></use>
</svg>
</a>
</div>
</div>
</nav>
<nav class="c-menu o-bg-dark u-shadow-bottom u-size-full u-pt-base@md {% if open %} is-open u-top {% endif %}" data-menu>
<div class="c-menu__search o-container u-justify-between u-column u-row@md u-my-base">
{% render "@action--default", {helper: false, label: false, inverse: true, placeholder: 'Cerca nel sito', action: 'search'}, true %}
</div>
<div class="o-container u-flex u-justify-between u-column u-row@md u-mb-large">
{% for nav in navigation %}
<div tabindex="1" class="c-menu__group u-relative u-z-cover u-size-1-5@md {% if nav.active %} is-active {% endif %}" data-group data-channel="{{nav.channel}}">
<input type="radio" id="{{nav.name}}" name="navigation" value="{{nav.name}}" class="u-absolute u-size-full u-right u-top u-z-cover u-opacity-none u-none@md">
<div class="c-menu__title u-flex u-justify-between u-justify-center">
<a class="c-menu__link u-a-underline u-relative u-no-underline" href="#">{{nav.name}}</a>
<div data-title>
<svg class="c-menu__icon o-icon o-icon--inverse o-icon--md u-none@md u-cursor-pointer u-block" data-arrow>
<use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#icon-chevron-down"></use>
</svg>
</div>
</div>
<ul class="c-menu__list u-list-none u-justify-between u-wrap">
{% for item in nav.list %}
<li class='c-menu__item u-size-1-2 u-size-full@md u-pt-xsmall u-pb-xsmall'>
<a class='c-menu__link u-a-underline u-relative u-no-underline u-nav-03' href="">{{item.name}}</a>
</li>
{% endfor %}
</ul>
</div>
{% endfor %}
<div class="u-text-center u-px-small u-my-base u-none@md">
<a href="/user/login/" class="c-btn c-btn--primary u-no-underline">
<svg class="o-icon o-icon--md">
<use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#icon-user"></use>
</svg>
Accedi
</a>
</div>
</div>
<div class="u-size-full u-mt-base u-mb-base u-none@md">
<div class="u-none@md u-flex u-column u-items-center o-container">
{% render "@modetoggle" %}
<a class="u-mt-base" href="#" target="_blank" rel="noopener noreferrer">
<svg class="c-brand-cn" width="91" height="24">
<use xlink:href="#brand-citynews"></use>
</svg>
</a>
</div>
</div>
</nav>
{
"open": true,
"navigation": [
{
"nav": null,
"name": "Notizie",
"channel": "/notizie/",
"list": [
{
"item": null,
"name": "Politica"
},
{
"item": null,
"name": "Economia"
},
{
"item": null,
"name": "Europa"
},
{
"item": null,
"name": "Cronaca"
},
{
"item": null,
"name": "Mondo"
},
{
"item": null,
"name": "Ambiente"
},
{
"item": null,
"name": "Green"
},
{
"item": null,
"name": "Attualità"
},
{
"item": null,
"name": "Città"
}
]
},
{
"nav": null,
"name": "Lifestyle",
"channel": "/lifestyle/",
"active": true,
"list": [
{
"item": null,
"name": "Benessere"
},
{
"item": null,
"name": "Casa"
},
{
"item": null,
"name": "Cucina"
},
{
"item": null,
"name": "Donna"
},
{
"item": null,
"name": "Gossip"
},
{
"item": null,
"name": "Salute"
},
{
"item": null,
"name": "Viaggi"
},
{
"item": null,
"name": "Spettacoli"
},
{
"item": null,
"name": "Motori"
}
]
},
{
"nav": null,
"name": "Cultura",
"channel": "/cultura/",
"list": [
{
"item": null,
"name": "Cinena"
},
{
"item": null,
"name": "Eventi"
},
{
"item": null,
"name": "Formazione"
},
{
"item": null,
"name": "Scienze"
}
]
},
{
"nav": null,
"name": "Opinioni",
"channel": "/opinioni/",
"list": [
{
"item": null,
"name": "Asso di denari"
},
{
"item": null,
"name": "Cronache marziane"
},
{
"item": null,
"name": "Curarsi mangiando"
},
{
"item": null,
"name": "Famiglia creativa"
},
{
"item": null,
"name": "FotoGrammi"
}
]
},
{
"nav": null,
"name": "Altre sezioni",
"list": [
{
"item": null,
"name": "Foto"
},
{
"item": null,
"name": "Video"
},
{
"item": null,
"name": "Best - Guida allo shopping"
}
]
},
{
"nav": null,
"name": "Dossier",
"list": [
{
"item": null,
"name": "Demo item"
}
]
}
]
}
// Name: Menu
// Description: Menu of website
//
// Component: `c-menu`
//
// Dependencies: `settings/v7/colors.tokens`
// `settings/v7/spacing.tokens`
//
// ========================================================================
// Variables
// ========================================================================
$menu-background: var(--theme-color);
$menu-panel-height: 87vh;
$menu-logo-size: 20px;
$menu-navbar-line: $global-active-line;
$menu-divider-color: rgba($ui-01, .3);
// ========================================================================
.c-menu {
// Custom properties
// ========================================================================
--nav-border: var(--theme-color);
--menu-divider-color: #{rgba($ui-01, .3)};
--menu-background: #{$ui-02};
// ========================================================================
@if $layout==wide {
position: fixed;
}
@else {
position: absolute;
}
right: 100%;
display: none;
background-color: var(--menu-background);
@include z(underneath);
@if $layout!=amp {
@include bp(md) {
--menu-background: #{$ui-05};
--menu-divider-color: #{rgba($ui-07, .3)};
right: 0;
min-height: auto;
}
}
&.is-open {
position: var(--menu-position);
top: var(--menu-top);
padding-top: var(--menu-padding-top);
--menu-bottom: 0;
right: 0;
bottom: var(--menu-bottom);
display: block;
overflow-y: scroll;
@if $layout==amp {
z-index: 2147483647;
--menu-top: 56px;
max-width: 100%;
padding: 0 $padding-small;
}
@else if $layout==wide {
--menu-background: #{$ui-02} !important;
--menu-position: fixed;
--menu-padding-top: 64px;
--menu-top: 64px;
@include z(cover);
}
@else {
animation: slidein .3s ease-in-out;
[data-channel*="/speciale"] & {
--menu-top: 56px;
}
@include z(upside);
--menu-top: 0;
--menu-padding-top: 56px;
--menu-position: absolute;
@media (max-width:739px) {
[data-fullpage][data-homepage] & {
--menu-position: fixed;
}
}
@include bp(xs) {
--menu-padding-top: 64px;
}
@include bp(md) {
animation: none;
--menu-bottom: auto;
@if $layout!=wide {
--menu-top: 182px;
}
[data-model*="sponsor"] & {
--menu-top: 64px;
}
[data-model*="sponsor"][data-channel*="speciale"] & {
--menu-top: 56px;
}
--menu-padding-top: #{$padding-xlarge};
--menu-position: absolute;
overflow: hidden;
}
}
}
//
// Menu Group - contains a Title and a List
//
&__group {
--menu-group-my: calc(var(--outer-gutter) * -1);
outline: none;
margin: 0 var(--menu-group-my);
@if $layout!=amp {
@include bp(md) {
--menu-group-my: 0;
&:not(:first-child) {
padding-left: $padding-base;
border-left: 1px solid var(--menu-divider-color);
}
}
@include bp(md, max-width) {
&:first-child {
border-top: 1px solid var(--menu-divider-color);
}
}
}
}
//
// Menu List - navigation menu
//
&__list {
display: none;
margin: 0;
padding: 0 0 0 $padding-base;
border-bottom: 1px solid var(--menu-divider-color);
@if $layout!=amp {
@include bp(md) {
display: flex;
flex-direction: column;
padding: 0;
border-bottom: 0;
}
}
.c-menu__group > input[type="radio"]:checked ~ & {
display: flex;
}
}
//
// Menu Title - title of menu list
//
&__title {
padding: $padding-small;
border-bottom: 1px solid var(--menu-divider-color);
@include type(nav-01);
@if $layout!=amp {
@include bp(md){
margin-bottom: $margin-base;
padding: 0;
border-bottom: 0;
@include type(nav-05);
}
}
.c-menu__group:focus &,
.c-menu__group:hover & {
box-shadow: inset #{$menu-navbar-line} 0 var(--nav-border);
@if $layout!=amp {
@include bp(md) {
box-shadow: none;
}
}
}
}
&__logo {
width: auto;
height: $menu-logo-size;
}
&__icon {
.c-menu__group:focus &,
.c-menu__group:hover & {
transform: rotate(180deg);
}
}
&__link{
--menu-link: #{$link-01};
color: var(--menu-link);
@if $layout!=amp {
@include bp(md) {
--menu-link: #{$link-02};
}
}
[data-model*="video"] &,
[data-channel*="foto"] &,
[data-channel*="video"] &,
[data-color-scheme*="dark"] &{
@if $layout!=amp {
@include bp(md) {
--menu-link: #{$link-01};
}
}
}
}
&__search {
display: flex;
@include bp(md) {
display: none;
}
}
body[data-model*="video"]:not([data-theme="today"]) &,
body[data-channel*="foto"]:not([data-theme="today"]) &,
body[data-channel*="video"]:not([data-theme="today"]) &,
body[data-color-scheme*="dark"]:not([data-theme="today"]) &{
@if $layout!=amp {
@include bp(md) {
--menu-background: #{$ui-07};
--menu-divider-color: #{rgba($ui-01, .3)};
}
}
}
}
// Set different top value for menu opened by menu toggle in header slim
.c-header--slim ~ .c-menu {
--menu-top: 56px;
--menu-padding-top: 0;
@include bp(xs) {
--menu-top: 64px;
}
@if $layout==standard {
@include bp(md) {
--menu-top: 118px;
--menu-padding-top: #{$padding-medium};
}
}
}
// Set different top value for menu opened by menu toggle in header motion
@if $layout==wide {
.c-header--wide-transparent ~ .c-menu.is-open {
--menu-top: 0;
@include bp(md) {
--menu-top: 64px;
}
}
}
.alert.alert-network ~ .c-menu.is-open {
@include bp(md) {
--menu-top: 250px;
}
}
No notes defined.