:root{
  --col1:#e281a5; /* BLU SCURO */
  --col2:#63a336; /* ROSA SCURO */
  --col3:#f2cbd2; /* ROSA CHIARO */
  --col-hover:#333;
}


.eb-garamond {
  font-family: "EB Garamond", serif;
  font-optical-sizing: auto;
  font-weight: 400;
  font-style: normal;
}

* {
-webkit-transition: all 0.5s ease-in-out; 
-moz-transition: all 0.5s ease-in-out;
-o-transition: all 0.5s ease-in-out;
-ms-transition: all 0.5s ease-in-out;
transition: all 0.5s ease-in-out;
}

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

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

body{padding:0; margin: 0; background: #fff;  font-family: "Poppins", sans-serif;  font-weight: 400;  font-style: normal; font-size: 1em; color: #333}
.header{width: 100%; position: fixed; top:0; z-index:20 }
.scroll{background: rgba(255,255,255, 0.85);}
.scroll .navbar-brand {font-size: 1.8em}
.scroll .navbar-brand svg {width:40px; height:40px;}

.navbar-toggler{width:42px; height:38px; border:var(--col2) 1px solid; border-radius: 0; background: none; text-align: center; font-size: 0.5em !important; color: var(--col2); text-transform: uppercase; padding: 0; margin-left: 8px}
.navbar-toggler svg{width: 14px; height: 14px; fill:var(--col2); }
.navbar-toggler.collapsed svg {transform: rotate(180deg); fill:var(--col2); }


.navbar-brand {color:var(--col2); font-size: 2.6em}
.navbar-brand svg {width:80px; height:80px;}
.nav-link, .dropdown-item {font-size: 1.4em;  font-size: 400}
.nav-link:link, .nav-link:visited, .dropdown-item:link, .dropdown-item:visited {color: var(--col2) !important;}
.nav-link:hover, .dropdown-item:hover {color: var(--col-hover) !important; background: none !important}
.dropdown-menu{border:0; background: rgba(255,255,255, 0.85);}
.dropdown-divider{width: 90%; margin:auto}
.dropdown-toggle.show {color: var(--col-hover) !important;}

.fascia-contatti{width:100%; margin-top: 106px; padding-top: 10px; padding-bottom: 10px; background-color: var(--col1);}
.fascia-contatti .col-12{display: flex; align-items: center; justify-content: flex-start; font-size: 1em}
.fascia-contatti svg {width: 26px; height: 26px; fill: #fff}
.fascia-contatti .col-12 div:not(:last-child) {margin-right: 26px}
.fascia-contatti a {text-decoration: none}
.fascia-contatti a:link, .fascia-contatti a:visited {color:#fff;}
.fascia-contatti a:hover {color:var(--col-hover);}
.fascia-contatti a:hover svg{fill: var(--col-hover)}

.a-btn-mobile {display: none} 

footer{margin-top: 50px; padding-top: 20px; padding-bottom: 20px; color: #333}
.frame-footer{background: url('../imgs/dot-footer.svg') repeat-x; background-position: center; background-size: 4px 4px; text-align: center; margin-bottom: 30px}
.frame-footer div {display:inline-block;width:90px; background: #fff; }
.frame-footer svg{width: 40px; height: 40px;}
footer .col-12 {font-size: 0.9em}
.intestazione-footer {font-size: 1.4em; color: var(--col2);}
footer a:link, footer a:visited {color: var(--col2); text-decoration: underline;}
.copy{padding-top: 16px; text-align: center; font-size: 0.75em}

#btn-back-to-top {
  position: fixed;
  width: 50px;
  height: 50px;
  bottom: 40px;
  right: 20px;
  display: none;
  background:#fff;
  color: #fff;
  border-radius:8px;
  z-index: 1000;
  border:var(--col2) 2px solid;
  line-height: 1em;
  font-size: 0.65em;
  color: var(--col2);
  text-align: center !important;
  padding: 4px 2px 4px 2px;
}
#btn-back-to-top svg {fill:var(--col2); width: 12px; height: 12px;}
#btn-back-to-top:hover{background: var(--col2);}
#btn-back-to-top:hover svg {fill:#fff;} 

/* bottoni circolari 
.btn-social{display:inline-block; width: 40px; height: 40px; border:var(--col2) 2px solid; border-radius: 20px; background: var(--col2); display: flex; align-items: center; justify-content: center; margin:0 12px 0 12px;}
.btn-social svg {height: 24px; width: auto; fill:#fff;}
.btn-social:hover {background:#fff; cursor: pointer}
.btn-social:hover svg{fill:var(--col2);}
*/

.btn-social{display:inline-block; height: 40px; border:var(--col2) 2px solid; border-radius: 20px; background: var(--col2); display: flex; align-items: center; justify-content: center; margin:0 12px 0 12px; font-size: 0.9em; color: #fff !important; text-decoration: none !important}
.btn-social svg {height: 24px; width: auto; fill:#fff;}
.btn-social span {padding-right: 6px}
.btn-social:hover {background:#fff; cursor: pointer; border:var(--col2) 2px solid; color:var(--col2) !important}
.btn-social:hover svg{fill:var(--col2);}

.privacy ol li, .privacy-txt ul li {margin-bottom: 20px}
.privacy a {text-decoration: underline !important; color:#333;}

@media (max-width:991px)
{
  .a-desk { display:none }
  .a-btn-mobile {display: inline; margin-right: 20px; border:var(--col-hover) 1px solid; width: 60px; height: 60px; border-radius: 30px; background: #fff; color: var(--col-hover); display: flex; align-items: center; justify-content: center;}
  .a-btn-mobile svg {fill: var(--col-hover); width: 30px; height: 30px}

  .a-btn-mobile:hover {background: var(--col2); border:#fff 1px solid}
  .a-btn-mobile:hover svg {fill:#fff}
  .navbar {background-color:#fff !important}
}

@media (max-width:575px)
{
  .navbar-brand {font-size: 1.2em}
  .navbar-brand svg {width:50px; height:50px;}
  .a-btn-mobile {width: 46px; height: 46px; border-radius: 23px;}
  .a-btn-mobile svg {width: 26px; height: 26px}
  .fascia-contatti{margin-top: 86px;}
  .fascia-contatti .col-12{justify-content: center;}
  .scroll .navbar-brand {font-size: 1.2em}
  .scroll .navbar-brand svg {width:24px; height:24px;}
}