/* roboto-200 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 200;
  src: url('../fonts/roboto-v49-latin-200.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* roboto-300 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 300;
  src: url('../fonts/roboto-v49-latin-300.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* roboto-regular - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 400;
  src: url('../fonts/roboto-v49-latin-regular.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* roboto-600 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 600;
  src: url('../fonts/roboto-v49-latin-600.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* roboto-800 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 800;
  src: url('../fonts/roboto-v49-latin-800.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}



/* playfair-display-regular - latin_latin-ext */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Playfair Display';
  font-style: normal;
  font-weight: 400;
  src: url('../fonts/playfair-display-v40-latin_latin-ext-regular.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* playfair-display-600 - latin_latin-ext */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Playfair Display';
  font-style: normal;
  font-weight: 600;
  src: url('../fonts/playfair-display-v40-latin_latin-ext-600.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}



 
body{font-family: "Roboto", sans-serif;
  font-optical-sizing: auto;
  font-weight: 300;
  font-style: normal;
  font-variation-settings:
    "wdth" 100;
    font-size: 1em
  }

.skip-link {
  font-family: arial; font-size: 12px;
  position: absolute;
  top: -40px;
  left: 0;
  background: #000;
  color: #fff;
  border: 0;
  padding: 8px 16px;
  z-index: 100;
  text-decoration: none;
  transition: top 0.2s;
}

/* visibile solo al focus (es. Tab) */
.skip-link:focus {
  top: 0;
}

.playfair{
   font-family: "Playfair Display", serif;
  font-optical-sizing: auto;
  font-weight:600;
  font-style: normal;
  letter-spacing: 1px;
}
/* .logo{max-width: 200px; position: absolute; top:20px; left:20px; z-index: 5} */
#logo-alba {position: absolute; top:20px; left:20px; z-index: 5;}
#logo-alba svg {width: 200px; height: auto; fill: #ed1e27}
#logo-alba .arredamenti{text-align: center; font-size: 1.3em; letter-spacing: 7px; color: #ccc}

 #menu{position:absolute; top:0; left: 0; width:100%; height: 100vh; background-color: rgba(0, 0, 0, 0.9); z-index: 10000;
      opacity: 0;
      visibility: hidden;
        transition: opacity 0.6s ease, visibility 0.6s ease;
      }
      #menu.show {
      opacity: 1;
      visibility: visible;
      position:fixed;
    }

      .menu-container{width:100%; height: 100vh;  display: flex; align-items: center; justify-content: center;}
      #menu ul {margin: 0; padding: 0; text-align: center; list-style-type: none}
      #menu ul li {text-align: center;}
      #menu ul li a {font-size: 2.6em; color: #d3d3d3; text-decoration: none;
       -webkit-transition: all 0.6s ease-in-out;
      -moz-transition: all 0.6s ease-in-out;
      -o-transition: all 0.6s ease-in-out;
      -ms-transition: all 0.6s ease-in-out;
      transition: all 0.6s ease-in-out;
    }
      #menu ul li a:hover {padding-left: 40px; color: #fff;
       -webkit-transition: all 0.6s ease-in-out;
      -moz-transition: all 0.6s ease-in-out;
      -o-transition: all 0.6s ease-in-out;
      -ms-transition: all 0.6s ease-in-out;
      transition: all 0.6s ease-in-out;
    }
      .btn-menu-close {
  width: 46px;
  height: 46px;
  border: #d3d3d3 1px solid;
  border-radius: 0;
  background: none;
  text-align: center;
  font-size: 0.5em !important;
  letter-spacing: 1px;
  color: #fff;
  text-transform: uppercase;
  padding: 0;
  position: absolute;
  top: 20px;
  right: 20px;
  z-index: 10001;
  display: flex;
  justify-content: center;
  align-items: center;
  
 
}

.icon-bar {
  position: absolute;
  width: 20px;
  height: 2px;
  background-color: #fff;
  transition: all 0.2s;
}

.top-bar {
  transform: rotate(45deg);
}

.bottom-bar {
  transform: rotate(-45deg);
}
.btn-menu{position: absolute;  top: 20px;  right: 20px; width:46px; height:46px; border:#ccc 1px solid; border-radius: 0; background: none; text-align: center; font-size: 0.5em !important; letter-spacing: 1px; color: #ccc; text-transform: uppercase; padding: 0; z-index: 6;
 -webkit-transition: all 0.6s ease-in-out;
      -moz-transition: all 0.6s ease-in-out;
      -o-transition: all 0.6s ease-in-out;
      -ms-transition: all 0.6s ease-in-out;
      transition: all 0.6s ease-in-out;
    }
.btn-menu:hover {background-color: #000; border:#fff 1px solid;  color: #fff;
 -webkit-transition: all 0.6s ease-in-out;
      -moz-transition: all 0.6s ease-in-out;
      -o-transition: all 0.6s ease-in-out;
      -ms-transition: all 0.6s ease-in-out;
      transition: all 0.6s ease-in-out;
    }
.btn-menu-close:hover {border:red 1px solid;  
  -webkit-transition: all 0.6s ease-in-out;
      -moz-transition: all 0.6s ease-in-out;
      -o-transition: all 0.6s ease-in-out;
      -ms-transition: all 0.6s ease-in-out;
      transition: all 0.6s ease-in-out;
    }
.btn-menu-close:hover .top-bar{transform: rotate(135deg); background-color: red !important;
 -webkit-transition: all 0.6s ease-in-out;
      -moz-transition: all 0.6s ease-in-out;
      -o-transition: all 0.6s ease-in-out;
      -ms-transition: all 0.6s ease-in-out;
      transition: all 0.6s ease-in-out;
    }
.btn-menu-close:hover .bottom-bar{transform: rotate(45deg); background-color: red !important;
 -webkit-transition: all 0.6s ease-in-out;
      -moz-transition: all 0.6s ease-in-out;
      -o-transition: all 0.6s ease-in-out;
      -ms-transition: all 0.6s ease-in-out;
      transition: all 0.6s ease-in-out;
    }
.social svg{width: 24px; height: 24px; fill: #d3d3d3}

.footer{background-color: #000; width: 100%}
.footer-container{text-align: center; color: #fff; padding-top: 20px; padding-bottom: 20px}
.footer a:link, .footer a:visited, .footer a:hover {color:#fff; text-decoration: underline}

.contatti-menu{color:#ccc; padding-top: 1rem}
.contatti-menu span{padding-left: 0.5rem; padding-right: 0.5rem}
.contatti-menu a:hover svg{fill:#ed1e27;
-webkit-transition: all 0.6s ease-in-out;
      -moz-transition: all 0.6s ease-in-out;
      -o-transition: all 0.6s ease-in-out;
      -ms-transition: all 0.6s ease-in-out;
      transition: all 0.6s ease-in-out;
    }

.social-footer {margin-bottom: 30px}
.social-footer span {padding-left: 24px}
.social-footer svg{height: 26px; width: auto; fill:#fff;
-webkit-transition: all 0.6s ease-in-out;
      -moz-transition: all 0.6s ease-in-out;
      -o-transition: all 0.6s ease-in-out;
      -ms-transition: all 0.6s ease-in-out;
      transition: all 0.6s ease-in-out;
    }
.social-footer svg:hover{height: 26px; width: auto; fill:#ed1d27;
-webkit-transition: all 0.6s ease-in-out;
      -moz-transition: all 0.6s ease-in-out;
      -o-transition: all 0.6s ease-in-out;
      -ms-transition: all 0.6s ease-in-out;
      transition: all 0.6s ease-in-out;
    }
.privacy ol li, .privacy-txt ul li {margin-bottom: 20px}
.privacy a {text-decoration: underline !important; color:#666;}
.extrasmall{font-size: 0.7em}
.extrasmall a{text-decoration: none !important}
@media (max-width: 768px) {
  #logo-alba svg {width: 160px; height: auto;}
  #logo-alba .arredamenti{text-align: center; font-size: 1.2em; letter-spacing: 4px; color: #ccc}
}

@media (max-width: 556px) {
  #logo-alba svg {width: 120px; height: auto;}
  #logo-alba .arredamenti{text-align: center; font-size:0.9em; letter-spacing: 4px; color: #ccc}
}