/* BARRIOTHEME > NAVIGATION CSS */

/* =========================================================================================================== */
/*
    LL         OOOOO      AAA     DDDDD     EEEEEEE   RRRRRR
    LL        OO   OO    AAAAA    DD  DD    EE        RR   RR
    LL        OO   OO   AA   AA   DD   DD   EEEEE     RRRRRR
    LL        OO   OO   AAAAAAA   DD   DD   EE        RR  RR
    LLLLLLL    OOOO0    AA   AA   DDDDDD    EEEEEEE   RR   RR
*/

.loader {
  position: fixed;
  width: 100%;
  height: 100vh;
  top: 0;
  left: 0;
  opacity: 1;
  background-color: var(--nero);
  -webkit-transition: all 0.3s ease-in-out;
  transition: all 0.3s ease-in-out;
  z-index: var(--z-header-2);
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
}

.page-loaded .loader {
  height: 0;
  transition-delay: 0.6s;
}

.loader .loader-content {
  width: 130px;
  height: 130px;
  -webkit-mask: url(../img/Famiglia-Rivetti_favicon.png) no-repeat 50% 50%;
  mask: url(../img/Famiglia-Rivetti_favicon.png) no-repeat 50% 50%;
  -webkit-mask-size: contain;
  mask-size: contain;
  background-color: var(--primary);
  /* animation: loader-animated 5s ease-out infinite; */
}

@keyframes loader-animated {
  0% {
    transform: rotate(0);
  }
  100% {
    transform: rotate(360deg);
  }
}

/* =========================================================================================================== */
/*
    FFFFFFF    OOOOO     OOOOO    TTTTTTTT   EEEEEEE   RRRRRR
    FF        OO   OO   OO   OO      TT      EE        RR   RR
    FFFF      OO   OO   OO   OO      TT      EEEEE     RRRRRR
    FF        OO   OO   OO   OO      TT      EE        RR  RR
    FF         OOOO0     OOOO0       TT      EEEEEEE   RR   RR
*/

footer {
  padding-top: var(--distance);
  padding-bottom: var(--distance);
  background-color: var(--grigio-scuro);
  color: var(--bianco);
  z-index: 3;
  position: relative;
}

footer .footer-left {
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
}

footer .logo-footer {
  width: 220px;
  height: 200px;
  background-image: url(../img/Famiglia-Rivetti_favicon.png);
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
  position: relative;
  z-index: 2;
}

footer .footer-head {
  width: 100%;
  padding: 25px 0;
  border-bottom: 1px solid var(--nero);
  text-align: right;
}

footer .footer-body {
  padding-top: 25px;
  display: flex;
  flex-direction: column;
  align-items: flex-end;
}

footer .footer-body > * {
  display: inline-block;
  color: var(--bianco);
}

footer .footer-body a {
  text-decoration: none;
  transition: all 0.2s ease-out;
}

footer .footer-body a:hover,
footer .footer-body a:focus {
  color: var(--primary);
}

/* __________________________________________________________________________ */

.sub-footer {
  width: 100%;
  padding: 15px 0;
  background-color: var(--nero);
  color: var(--bianco);
}

.sub-footer .cont-subfooter {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.sub-footer .cont-subfooter > * {
  margin-bottom: 0;
}

.sub-footer .menu-footer {
  list-style-type: none;
  display: flex;
  padding: 0;
}

.sub-footer .menu-footer li + li {
  margin-left: 25px;
}

.sub-footer .menu-footer li a {
  color: var(--bianco);
  text-decoration: none;
  transition: all 0.2s ease-out;
}

.sub-footer .menu-footer li a:hover,
.sub-footer .menu-footer li a:focus {
  color: var(--primary);
}

/* ________________________________________________________ */
/* credits */

.credits {
  display: inline-flex;
  width: 86px;
  height: 12px;
  text-indent: -9000px;
  background-color: var(--bianco);
  border: none !important;
  -webkit-mask: url(../img/logo-hellobarrio.svg) no-repeat 50% 50%;
  mask: url(../img/logo-hellobarrio.svg) no-repeat 50% 50%;
  -webkit-mask-size: cover;
  mask-size: cover;
  transition: all 0.2s ease-out;
}

.credits:hover,
.credits:focus {
  background-color: var(--primary);
}

.ie .credits {
  width: 86px;
  height: 12px;
  background-color: url(../img/logo-hellobarrio.svg) no-repeat center center;
  background-size: cover;
  -webkit-mask: none;
  mask: none;
}