*,*::before,*::after {box-sizing: border-box;}
body{font-family: "Roboto"; font-weight: 400; font-size: 16px; line-height: 20px; background-color: #e6e6e6;}
h1{ font-weight: 700; font-size:20px}
header{ position: absolute; z-index: 100; height: 74px; -webkit-box-shadow: 0px 6px 5px 0px rgba(0,0,0,0.2); 
  box-shadow: 0px 6px 5px 0px rgba(0,0,0,0.2); background-color: #FFFFFF; width:100%;}
footer{position: fixed; z-index: 1000000; bottom: 0;  width: 100%; -webkit-box-shadow: 0px -10px 9px 0px rgba(0,0,0,0.3); 
  box-shadow: 0px -8px 10px 0px rgba(0,0,0,0.2); padding-top: 12px; padding-bottom: 12px; background-color: #FFFFFF;}
footer a{font-size: 28px; line-height: 22px; color: #A2A2A2;}
footer a.active{color: #032E6D;}
.home-bg{background-image: url(../img/home-bg.png); background-repeat: no-repeat; background-size: cover; 
  background-position: center center; height: 100vh;}
.presentazione{font-size: 14px; line-height: 20px; color: #707070;}
.crediti{font-size: 12px; line-height: 24px; color: #707070; text-align: center;}

a{text-decoration: none;}

a.btn{font-weight: 700; color: #FFFFFD; background-color: #032E6D; border-radius: 24px; padding: 11px 22px; border-color: #032E6D; width: 100%; text-align: center;}
a.btn i{font-size: 32px; line-height: 20px;}

.la-bars{font-size: 28px; color: #032E6D; line-height: 21px;}
.indicatore{position: absolute; top: 74px; z-index: 5; margin-left:50%;transform: translateX(-50%); text-align: center }
.indicatore .box{height: 40px; width: 80px; background-color: #032E6D; border-bottom-left-radius: 40px; border-bottom-right-radius: 40px; display: inline-block}
.indicatore i{font-size: 32px; line-height: 36px; color: white;}
.invita{font-size: 16px; font-weight: 800; color: #032E6D}
.comparsa{position: fixed; top: calc(100%-16px); right: -250px; z-index: 10; background-color: #FFFFFF; height: 100vh; width:250px;}

ul{margin: 0; padding: 0; list-style-type: none; text-align: center;}
ul li{font-weight: 700; line-height: 18px; border-bottom: 2px solid #DBDBDB; padding-top: 10px; padding-bottom: 10px; cursor: pointer}
ul li:first-of-type{border-top: 0; border-bottom: 0; font-size: 12px; text-align: center; color: #707070; font-weight: 400;}
ul li a{
	color: #032E6D;
	text-decoration: none;
	
}
ul li a:hover{color: #032E6D; text-decoration: none;}

ul.menu, ul.menu-invita{margin: 0 20px;}

ul.menu li:first-of-type{border-top: 2px solid #DBDBDB;}
ul.menu li{font-size: 16px; font-weight: 700;}
ul.menu li:not(:last-of-type){border-bottom: 0;}
ul.menu.home li:first-of-type{border-top-color: #FFFFFF;}
ul.menu.home li:last-of-type{border-bottom-color: #FFFFFF;} 

ul.menu-invita li{border-bottom-color: #FFFFFF;}

ul.menu-servizi{margin: 0; padding-bottom: 80px;}
ul.menu-servizi li{display: flex; justify-content: space-between; align-items: center; border: 0; flex-wrap: wrap;}
ul.menu-servizi li span{flex-grow: 1; text-align: left; color: #032E6D; text-transform: uppercase; margin-left: 10px; font-size:15px; letter-spacing:-.4px}
ul.menu-servizi li i{font-size: 24px; color: #032E6D;}

ul.children{display: none; flex-basis: 100%; margin-top: 11px;}
ul.children li{font-weight: 400; border-bottom: 1px solid #FFFFFF; text-align: left; padding: 0 0 0 16px;}
ul.children li:first-of-type{border-top: 1px solid #FFFFFF;}
ul.children li a{ padding:15px 0;display: block; width: 100%; font-size:18px; line-height:22px}

.contenuti ul{margin-bottom: 30px;}
.contenuti ul li{font-size: 16px; line-height: 22px; font-weight: 400; color: #000000; padding-left: 25px; text-align: start; border-bottom-color: #FFFFFF;}
.contenuti ul li:first-of-type{border-top-color: #FFFFFF;}
.contenuti ul li::before{
  content: "";
  vertical-align: top;
  display: inline-block;
  width: 16px;
  height: 16px;
  background-color: #000000;
  border-radius: 50%;
  margin-left: -25px;
  margin-right: 9px;
}
.contenuti h2, #blog h2{color: #032E6D; font-size: 16px; line-height: 22px; text-transform: uppercase; font-weight: 700; margin-bottom: 16px;}
.contenuti p{font-size: 16px; line-height: 22px; color: #000000; text-align: left;}

.contenuti#salute ul li::before{background-color: #93C4C4;margin-top:3px}
.contenuti#salute .titolo-banner{color: #93C4C4; font-weight: 700; }
.contenuti#salute .azione{background-color: #93C4C4; font-weight:700}
.contenuti#salute .scopri{background-color: #93C4C4;}
.contenuti#salute .sezione-promo{color: #93C4C4;}
.contenuti#salute .owl-theme .owl-dots .owl-dot.active span{background: #93C4C4;}
.contenuti#salute .logo-servizio{background-color: #93C4C4;}


.contenuti#casa .titolo-banner{color: #8BA654; font-weight: 700;}
.contenuti#casa ul li::before{background-color: #8BA654;}
.contenuti#casa .azione{background-color: #8BA654;}
.contenuti#casa .scopri{background-color: #8BA654;}
.contenuti#casa .sezione-promo{color: #8BA654;}
.contenuti#casa .owl-theme .owl-dots .owl-dot.active span{background: #8BA654;}
.contenuti#casa .logo-servizio{background-color: #8BA654;}

.contenuti#famiglia .titolo-banner{color: #DE97A5; font-weight: 700;}
.contenuti#famiglia ul li::before{background-color: #DE97A5;}
.contenuti#famiglia .azione{background-color: #DE97A5;}
.contenuti#famiglia .scopri{background-color: #DE97A5;}
.contenuti#famiglia .sezione-promo{color: #DE97A5;}
.contenuti#famiglia .owl-theme .owl-dots .owl-dot.active span{background: #DE97A5;}
.contenuti#famiglia .logo-servizio{background-color: #DE97A5;}

.contenuti#sport .titolo-banner{color: #88B0E2; font-weight: 700;}
.contenuti#sport ul li::before{background-color: #88B0E2;}
.contenuti#sport .azione{background-color: #88B0E2;}
.contenuti#sport .scopri{background-color: #88B0E2;}
.contenuti#sport .sezione-promo{color: #88B0E2;}
.contenuti#sport .owl-theme .owl-dots .owl-dot.active span{background: #88B0E2;}
.contenuti#sport .logo-servizio{background-color: #88B0E2;}

.contenuti#mobilita .titolo-banner{color: #A888C4; font-weight: 700;}
.contenuti#mobilita ul li::before{background-color: #A888C4;}
.contenuti#mobilita .azione{background-color: #A888C4;}
.contenuti#mobilita .scopri{background-color: #A888C4;}
.contenuti#mobilita .sezione-promo{color: #A888C4;}
.contenuti#mobilita .owl-theme .owl-dots .owl-dot.active span{background: #A888C4;}
.contenuti#mobilita .logo-servizio{background-color: #A888C4;}

.contenuti#intervento .titolo-banner{color: #E2B058; font-weight: 700;}
.contenuti#intervento ul li::before{background-color: #E2B058;}
.contenuti#intervento .azione{background-color: #E2B058;}
.contenuti#intervento .scopri{background-color: #E2B058;}
.contenuti#intervento .sezione-promo{color: #E2B058;}
.contenuti#intervento .owl-theme .owl-dots .owl-dot.active span{background: #E2B058;}
.contenuti#intervento .logo-servizio{background-color: #E2B058;}

.contenuti#imprese .titolo-banner{color: #92A3A8; font-weight: 700;}
.contenuti#imprese ul li::before{background-color: #92A3A8;}
.contenuti#imprese .azione{background-color: #92A3A8;}
.contenuti#imprese .scopri{background-color: #92A3A8;}
.contenuti#imprese .sezione-promo{color: #92A3A8;}
.contenuti#imprese .owl-theme .owl-dots .owl-dot.active span{background: #92A3A8;}
.contenuti#imprese .logo-servizio{background-color: #92A3A8;}

.contenuti#web .titolo-banner{color: #88CDE2; font-weight: 700;}
.contenuti#web ul li::before{background-color: #88CDE2;}
.contenuti#web .azione{background-color: #88CDE2;}
.contenuti#web .scopri{background-color: #88CDE2;}
.contenuti#web .sezione-promo{color: #88CDE2;}
.contenuti#web .owl-theme .owl-dots .owl-dot.active span{background: #88CDE2;}
.contenuti#web .logo-servizio{background-color: #88CDE2;}

.contenuti#condominio .titolo-banner{color: #E28858; font-weight: 700;}
.contenuti#condominio ul li::before{background-color: #E28858;}
.contenuti#condominio .azione{background-color: #E28858;}
.contenuti#condominio .scopri{background-color: #E28858;}
.contenuti#condominio .sezione-promo{color: #E28858;}
.contenuti#condominio .owl-theme .owl-dots .owl-dot.active span{background: #E28858;}
.contenuti#condominio .logo-servizio{background-color: #E28858;}

.contenuti-blog ul{font-size: 16px;}
.contenuti-blog ul li{cursor: pointer;line-height: 28px; font-weight: 700; background-color: #032E6D; text-align: center; position: relative; color: #FFFFFD; padding: 5px 0; border: none; border-radius: 2px;}
.contenuti-blog ul li a{color: #FFFFFD; display: block;}
.contenuti-blog ul li::after{display: block;
  content: '\f107';
  font-family: "Line Awesome Free";
  font-weight: 900;
  font-size: 16px;
  text-align: end;
  position: absolute;
  right: 10px;
  top: 3px;
}
.contenuti-blog ul li.clicked::after {content: "\f106";}
.contenuti-blog ul ul{position: absolute;z-index: 10;margin: 0;page-break-after: 0; background-color:#032e6d; width: 100%; display: none;padding:0 10px}
.contenuti-blog ul ul li{border-radius: 0; border-top: 1px solid #FFFFFF; font-weight: 400;}
.contenuti-blog ul ul li::after{display: none;}

.logo-servizio{padding: 8px; border-radius: 50%; background-color: #000;}
.logo-servizio i{font-size: 32px !important; color: white !important;}


.logo-servizio#salute{background-color: #93C4C4;}
.logo-servizio#famiglia{background-color:#DE97A5;}
.logo-servizio#casa{background-color:#8BA654;}
.logo-servizio#sport{background-color:#88B0E2;}
.logo-servizio#mobilita{background-color: #A888C4;}
.logo-servizio#intervento{background-color: #E2B058;}
.logo-servizio#promozione{background-color: #032E6D; margin-right: 0; padding: 10px;}
.logo-servizio#imprese{background-color: #92A3A8;}
.logo-servizio#web{background-color: #88CDE2;}
.logo-servizio#condominio{background-color: #E28858;}


.sfumato {position: absolute; z-index: 0; bottom: -2px; left: 50%; transform: translateX(-50%); font-weight: 700; color: #032E6D; font-size: 20px; padding-bottom: 0px;
  line-height: 22px; text-align: center; background: linear-gradient(rgba(230, 230, 230, 0) 0%, rgba(230, 230, 230, 1) 100%); width: 100%; height: 150px; padding-top:90px}
.saveCodice{color: #032E6D; font-size: 32px; padding-right: 20px; padding-left: 0; border-top-right-radius: 24px; border-bottom-right-radius: 24px; border: 1px solid #E6E6E6; background-color: #E6E6E6;}
.saveCodice.home{border-color: #FFFFFF; background-color: #FFFFFF;}
.cerca{font-size: 20px; line-height: 20px; color: #032E6D; padding: 18px 20px 18px 20px; background-color: white; border: 0px; border-radius: 30px; width: 100%;}
.cerca:focus{outline: none;}
.cerca::placeholder{color: #707070;}
.search{font-size: 32px; line-height: 36px; color: #032E6D; position: absolute; top: 12px; right: 20px;}
.search:hover{cursor: pointer;}

.sottotitolo{color: #032E6D; font-size: 16px; line-height: 22px; text-transform: uppercase; font-weight: 700;}
.sottotitolo span{font-weight: 400; text-transform: none;}
.titolo{color: #032E6D; font-size: 20px; line-height: 22px; font-weight: 700;}
.descrizione{font-size: 14px; line-height: 18px; text-align: center; color: #707070;}

.bottone{background-color: #FFFFFD; border-radius: 4px; padding: 14px 10px; text-align: start; border-bottom: 4px solid #93C4C4; margin-bottom: 10px;}
.bottone a{text-decoration: none;}
.bottone a.sottotitolo{text-transform: none; display: block; font-size:18px; line-height:22px}

.back{background-color: #FFFFFF; border-top-right-radius: 4px; border-bottom-right-radius: 4px; position: fixed; z-index: 20;  top: 85px;}
.back i{color: #032E6D; font-size: 26px; padding: 5px 5px 5px 32px; }

.banner-network{background-color: #FFFFFD; border-radius: 4px; padding: 20px 20px; position: relative; text-align: center; margin-bottom: 40px;}
.logo-banner{position: absolute; z-index: 5; left: 50%; transform: translateX(-50%); top: -30px; margin: 0;}
.titolo-banner{color: #93C4C4; font-size: 14px; line-height: 18px; margin-top: 20px;}
.testo-banner{font-weight: 700; color: #032E6D; font-size: 20px; line-height: 22px;}






.paragrafo{font-size: 14px; line-height: 18px; color: #000000; text-align: left;}

.azione{background-color: #93C4C4; border-radius: 24px; color: white; text-align: center; font-size: 18px; padding: 14px; display: block;}
.azione i{font-size: 32px; line-height: 20px;}

.card-title{font-size: 14px; line-height: 18px; color: #FFFFFD; font-weight:700}
.card-text{font-size: 20px; line-height: 22px; color: #FFFFFD; font-weight: 700;}
.scopri{background-color: #032E6D; border-radius: 2px; display: inline-block; font-size: 16px; line-height: 20px; color: #FFFFFD; padding: 6px 12px; font-weight:700; margin-top:5px}
.ombra-footer{padding: 10px; background: linear-gradient(0deg, #000000 0%, #00000000 100%); opacity: 20%;}
.prom-card{background-color: #FFFFFD; border-radius: 4px; padding: 10px; text-align: left;}
.prom-card .logo-servizio{position: absolute; bottom: 10px; left: 10px; z-index: 1;}
.sezione-promo{font-size: 14px; line-height: 18px; font-weight: 700;}
.nb{font-size: 12px; line-height: 18px; color: #032E6D; text-align: left;}
.border-white{border: 4px solid #FFFFFF;}

.panel{background-color: #FFFFFD; border-radius: 4px; padding: 10px; margin-bottom: 10px; height: 120px; line-height: 100px;}

.underline{color: #032E6D; text-decoration: underline; text-decoration-line: #032E6D;}

.owl-theme .owl-dots .owl-dot span{width: 10px; height: 10px; margin: 10px 2px; background: #FFFFFF; display: block; -webkit-backface-visibility: visible; transition: opacity 200ms ease; border-radius: 50%;}
.sezione-promo{color: #8BA654;}
.owl-theme .owl-dots .owl-dot.active span{background: #93C4C4;}
.owl-nav{display: none;}

.translate-0{transform: translate(0, 0);}

select {appearance: none; background-color: transparent; border: none; padding: 0 1em 0 0; margin: 0; width: 100%; font-family: inherit; 
        font-size: inherit; cursor: inherit; line-height: inherit; outline: none;}
select::-ms-expand {display: none;}

#carousel_1 .owl-stage-outer{ border: 4px solid #FFFFFF;}
#carousel_1 .item{background-color: #FFFFFD; height: 180px;}
#carousel_1 .owl-theme .owl-dots{position: absolute; width: 100%;}
#carousel_2 .item{background-color: #93C4C4; border-radius: 4px; padding: 10px;}

#codice4Y{border: 1px solid #E6E6E6; background-color: #E6E6E6; border-top-left-radius: 24px; border-bottom-left-radius: 24px; color: #707070; font-size: 20px; padding-left: 20px;}
#codice4Y:focus{border-color: #E6E6E6; box-shadow: unset;}
#codice4Y.home{border-color: #FFFFFF; background-color: #FFFFFF;}


#promozione_1 .sezione-promo{color: #93C4C4; background-color: #E6E6E6;}
#promozione_1 .scopri{background-color: #93C4C4;}

#promozione_2 .sezione-promo{color: #8BA654;}
#promozione_2 .scopri{background-color: #8BA654;}
.sezione-promo{color: #8BA654;}
#promozione_2.owl-theme .owl-dots .owl-dot.active span{background: #8BA654;}

#promozione_3 .sezione-promo{color: #E2B058;}
#promozione_3 .scopri{background-color: #E2B058;}
 
footer .azione{font-size: 14px; padding: 10px;}
footer .azione i{font-size: 24px;}





.open{
  /* for chrome and safari*/
  -webkit-animation-duration: 1s;
  -webkit-animation-name: slidein;

  /*for firefox*/
  -moz-animation-duration: 1s;
  -moz-animation-name: slidein;

    /* for opera*/
  -o-animation-duration: 1s;
  -o-animation-name: slidein;

    /* Standard syntax*/
  animation-duration: 1s;
  animation-name: slidein;
}

@-webkit-keyframes slidein {
  from {right: -73%;}
  to {right: 0;}
}

@-moz-keyframes slidein {
  from {right: -73%;}
  to {right: 0;}
}
@-o-keyframes slidein {
  from {right: -73%;}
  to {right: 0;}
}
@keyframes slidein {
  from {right: -73%;}
  to {right: 0;}
}

.close{
  /* for chrome and safari*/
  -webkit-animation-duration: 1s;
  -webkit-animation-name: slideout;

  /*for firefox*/
  -moz-animation-duration: 1s;
  -moz-animation-name: slideout;

    /* for opera*/
  -o-animation-duration: 1s;
  -o-animation-name: slideout;

    /* Standard syntax*/
  animation-duration: 1s;
  animation-name: slideout;
}

@-webkit-keyframes slideout {
  from {right: 0;}
  to {right: -73%;}
}

@-moz-keyframes slideout {
  from {right: 0;}
  to {right: -73%;}
}
@-o-keyframes slideout {
  from {right: 0;}
  to {right: -73%;}
}
@keyframes slideout {
  from {right: 0;}
  to {right: -73%;}
}

.bg-grey{padding-top:120px; padding-bottom:70px;/*background-color: #E6E6E6; -webkit-box-shadow: 0px -15px 15px 0px #E6E6E6;  margin-top:-20px;
  box-shadow: 0px -15px 15px 0px #E6E6E6;*/}
.ms-n5{margin-left: -75px;}

.infoFooter{position:fixed; z-index: 10; bottom:53px;padding:15px 20px 20px 20px;box-shadow: 0px -8px 10px 0px rgba(0,0,0,0.2); }
.infoFooter .azione{font-size: 16px; font-weight:700;
padding: 10px;}
.box-ricerca{position:absolute; z-index: 10; text-align: center; width: 90%; left: 0; margin:0 5%}
#ricerca{ }
div.autosuggest{background-color: #FFF;
z-index: 3;
  padding-top:20px;
margin-top: -20px;

}

@media (min-width: 855px) {
	body{width:414px; margin:0 auto; height:660px; overflow:auto; background-color:#FFF;}
	header,footer,.infoFooter{width:414px;}
  bottom{ bottom:0}
  .maschera{background-color: #e6e6e6;width:414px;}
  .indicatore{  margin-left: 207px; }
}