@import url('https://fonts.googleapis.com/css?family=Montserrat:400,600,800');
body { font-family: 'Montserrat', sans-serif; }
/*.menu_princ li a { padding-left: 16px !important; padding-right: 6px; }*/
.content { height: 100%; width: 1024px; margin: 0 auto; position: relative; }

/* utility */
.uppercase {text-transform: uppercase;}
.red {color: #c1022c;}
.flex {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

/* Responsive embed */
.embed-responsive {
  position: relative;
  display: block;
  height: 0;
  padding: 0;
  overflow: hidden;
}
.embed-responsive .embed-responsive-item,
.embed-responsive iframe,
.embed-responsive embed,
.embed-responsive object,
.embed-responsive video {
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  height: 100%;
  width: 100%;
  border: 0;
} 
.embed-responsive-16by9 {
  padding-bottom: 56.25%;
}
.embed-responsive-4by3 {
  padding-bottom: 75%;
}

.title {
  color: #c1022c;
  font-size: 24px;
  font-weight: 600;
  text-transform: uppercase;
  margin-bottom: 30px;
}

.title-sm {
  color: #c1022c;
  font-weight: 800;
  margin-bottom: 20px;
  font-size: 14px;
}

.image-fluid {
  width: 100%;
  height: auto;
}


/* cta */
.cta a {
  white-space: nowrap;
}


/* Visual */
#visual { background: url('../img/bg-visual.jpg') no-repeat center; background-size: cover; height: calc(100vh - 139px); min-height: 700px; position: relative; overflow: hidden; }
#visual .txt { position: relative; float: left; top: 19vh; }
#visual .txt .tit { font-size: 80px; color: #fff; font-weight: 600; margin-bottom: 50px; }
#visual .txt .abs { font-size: 40px; color: #fff; font-weight: 600; margin-bottom: 30px; }
#visual .txt .abs_small { font-size: 24px; color: #fff; }
#visual .txt .keys { margin: 0; padding: 0; list-style: none; }
#visual .txt .keys li { margin: 30px 0; }
#visual .txt .keys li a { background-color: #c1022c; color: #fff; font-weight: 400; font-size: 20px; text-decoration: none; padding: 10px; cursor: default; }
#visual .img { position: absolute; bottom: -100px; z-index: 10; right: -200px; }

@media screen and (min-width: 681px) and (max-height: 840px) {
  #visual { height: 530px; min-height: 670px; }
  #visual .img {top: 50px;}
  #visual img {height: 610px;}
  #visual .txt { top: 5vh; }
  #visual .txt .abs { font-size: 30px; }
  #visual .txt .tit {font-size: 70px; line-height: 1.2; padding-bottom: 0;  }
}


/*
#visual { background: url('../img/bg-visual.jpg') no-repeat center; background-size: cover; height: 680px; position: relative;  overflow: hidden;
}
#visual .txt { position: relative; float: left; top: 19vh; }
#visual .txt .tit { font-size: 60px; color: #fff; font-weight: 600; line-height: 1.2; }
#visual .txt .abs { font-size: 40px; color: #fff; font-weight: 600; padding-bottom: 30px; }
#visual .txt .keys { margin: 0; padding: 0; list-style: none; }
#visual .txt .keys li { margin: 30px 0; }
#visual .txt .keys li a { background-color: #c1022c; color: #fff; font-weight: 400; font-size: 20px; text-decoration: none; padding: 10px; cursor: default; }
#visual .img { position: absolute; bottom: -100px; z-index: 10; right: -200px;  top: -170px;}
@media screen and (min-height: 800px) {
  #visual {     height: calc(100vh - 139px);   }
  #visual .txt .tit { font-size: 100px; color: #fff; font-weight: 600; padding-bottom: 60px; }
  #visual .img { top: -170px;  }
}*/




/* Vantaggi */
#vantaggi { padding: 150px 0 50px; text-align: center; background-color: #fff; position: relative; }
#vantaggi .top-tit { color: #c1022c; font-size: 24px; font-weight: 600; text-transform: uppercase; padding-bottom: 40px; }
#vantaggi .tit { font-size: 40px; color: #181818; font-weight: 100; }
#vantaggi .txt { font-size: 18px; padding-top: 40px; line-height: 26px; }

/* Come Funziona */
#come-funziona { background-color: #e5e5e5; padding: 90px 0; }
#come-funziona .flex-wrap { display: flex; flex-wrap: wrap; }
#come-funziona .flex-wrap .flex-item { float: left; width: 49%; margin-right: 20px; }
#come-funziona .flex-wrap .flex-item:last-child { margin-right: 0; }
#come-funziona .img-come-funziona { width: 100%; }
#come-funziona .flex-wrap .flex-item .tit { color: #c1022c; font-size: 24px; padding-bottom: 20px; line-height: normal; }
#come-funziona .flex-wrap .flex-item p { font-size: 16px; line-height: 26px; }

/* COP */
#cop { padding: 90px 0; }
#cop .flex-wrap { display: flex; flex-wrap: wrap; }
#cop .flex-wrap .flex-item { float: left; width: 49%; margin-right: 20px; }
#cop .flex-wrap .flex-item:last-child { margin-right: 0; }
#cop .tit { color: #c1022c; font-size: 40px; text-align: center; padding-bottom: 40px; line-height: normal;  }
#cop p { font-size: 18px; line-height: 28px; }
#cop ul { margin-top: 20px; }
#cop ul li { font-size: 18px; line-height: 28px; }
#cop .cta { margin: 20px 0; }
#cop .cta a { background-color: #c1022c; border-radius: 500px; padding: 10px 20px; font-size: 14px; color: #fff; text-decoration: none; font-family: 'AktivGrotesk-Bold'; transition: all ease-in-out .3s; }
#cop .cta a:hover, #cop .cta a:focus { background-color: #a80226; }

/* Tabs */
#tabss { padding: 120px 0 90px; background:url(../img/diagonal-bg.png) no-repeat center bottom #e5e5e5; background-size: 100% auto; }
#tabss .video { text-align: center; padding: 0px 0 70px; margin-top: -30px; }
/* Style the tab */
#tabss div.tab { overflow: hidden; border: none; background-color: #c1022c; color: #fff; font-family: 'Montserrat', sans-serif; }
/* Style the buttons inside the tab */
#tabss div.tab button { background-color: inherit; float: left; border: none; outline: none; cursor: pointer; padding: 22px 25px; transition: 0.3s; color: #fff; font-family: 'Montserrat', sans-serif; font-weight: 600; font-size: 16px; text-transform: uppercase; border-right: 1px solid #fff; }
/* Change background color of buttons on hover */
#tabss div.tab button:hover { background-color: #fff; color: #c1022c; }
/* Create an active/current tablink class */
#tabss div.tab button.active { background-color: #fff; color: #c1022c; }
/* Style the tab content */
#tabss .tabcontent { display: none; padding: 50px 30px; border: none; border-top: none; background-color: #fff; font-family: 'Montserrat', sans-serif; }
#tabss .tabcontent p {font-size: 16px; line-height: 26px;}
#tabss .tabcontent p:not(:last-child) {margin-bottom: 10px;}
#tabss .tabcontent__title { color: #c1022c; font-size: 22px; margin-bottom: 10px; text-transform: uppercase; line-height: 1.2}
#tabss .flex-wrap { display: flex; flex-wrap: wrap; }
#tabss .flex-wrap .flex-item { float: left; width: 48%; margin-right: 20px; }
#tabss .flex-wrap .flex-item:last-child { margin-right: 0; }
#tabss .flex-wrap .flex-item img { max-width: 100%; }
#tabss .flex-wrap .flex-item p { font-size: 16px; line-height: 26px; }

#tabss .flexibilidade h5 {     
  font-weight: 700;
    margin-bottom: 10px;
    font-size: 14px;
    text-transform: uppercase;}
#tabss .flexibilidade .thumb { margin-right: 15px; flex-basis: 196px;}
  #tabss .flexibilidade .thumb img { max-width: none;
  }
#tabss .flexibilidade ul {margin-left: 16px;}

#tabss button.active .icon-efficienza { content: ''; position: relative; display: block; background: url('../img/efficienza-1.png') no-repeat; width: 22px; height: 30px; top: 6px; margin-right: 10px; margin-top: -11px; float: left; }
#tabss button .icon-efficienza { content: ''; position: relative; display: block; background: url('../img/efficienza-2.png') no-repeat; width: 22px; height: 30px; top: 6px; margin-right: 10px; margin-top: -11px; float: left; }
#tabss button:hover .icon-efficienza { content: ''; position: relative; display: block; background: url('../img/efficienza-1.png') no-repeat; width: 22px; height: 30px; top: 6px; margin-right: 10px; margin-top: -11px; float: left; }
#tabss button.active .icon-poupanca { content: ''; position: relative; display: block; background: url('../img/poupanca-1.png') no-repeat; width: 30px; height: 30px; top: 6px; margin-right: 10px; margin-top: -11px; float: left; }
#tabss button .icon-poupanca { content: ''; position: relative; display: block; background: url('../img/poupanca-2.png') no-repeat; width: 30px; height: 30px; top: 6px; margin-right: 10px; margin-top: -11px; float: left; }
#tabss button:hover .icon-poupanca { content: ''; position: relative; display: block; background: url('../img/poupanca-1.png') no-repeat; width: 30px; height: 30px; top: 6px; margin-right: 10px; margin-top: -11px; float: left; }
#tabss button.active .icon-flexibilidade { content: ''; position: relative; display: block; background: url('../img/flexibilidade-1.png') no-repeat; width: 27px; height: 30px; top: 6px; margin-right: 10px; margin-top: -11px; float: left; }
#tabss button .icon-flexibilidade { content: ''; position: relative; display: block; background: url('../img/flexibilidade-2.png') no-repeat; width: 27px; height: 30px; top: 6px; margin-right: 10px; margin-top: -11px; float: left; }
#tabss button:hover .icon-flexibilidade { content: ''; position: relative; display: block; background: url('../img/flexibilidade-1.png') no-repeat; width: 27px; height: 30px; top: 6px; margin-right: 10px; margin-top: -11px; float: left; }
#tabss button.active .icon-garantia { content: ''; position: relative; display: block; background: url('../img/garantia-1.png') no-repeat; width: 30px; height: 30px; top: 6px; margin-right: 10px; margin-top: -11px; float: left; }
#tabss button .icon-garantia { content: ''; position: relative; display: block; background: url('../img/garantia-2.png') no-repeat; width: 30px; height: 30px; top: 6px; margin-right: 10px; margin-top: -11px; float: left; }
#tabss button:hover .icon-garantia { content: ''; position: relative; display: block; background: url('../img/garantia-1.png') no-repeat; width: 30px; height: 30px; top: 6px; margin-right: 10px; margin-top: -11px; float: left; }
#tabss .escolha { padding: 90px 0 30px; text-align: center; }
#tabss .escolha h3 { color: #c1022c; font-size: 24px; font-weight: 600; text-transform: uppercase; }
#tabss .escolha h2 { font-size: 40px; line-height: 30px; padding: 20px 0; font-weight: 100; }
#tabss .escolha p { font-size: 18px; line-height: normal; }
#tabss .pessoas { background-color: #fff; border-radius: 10px; box-shadow: 0px 0px 2px 0px rgba(0,0,0,.5) inset, 0 10px 10px rgba(0,0,0,.3); border: 3px solid #fff; width: 600px; margin: 0 auto; text-align: center; padding: 30px 15px; margin-top: 50px; }
#tabss .pessoas label { font-size: 22px; cursor: text; }
#tabss .pessoas input { padding: 10px; border: 1px solid #ccc; border-radius: 5px; color: #c1022c; font-size: 20px; margin: 0 20px; }
#tabss .pessoas button { background-color: #c1022c; color: #fff; border: 0; text-transform: uppercase; font-family: 'AktivGrotesk-Bold'; text-decoration: none; padding: 15px; border-radius: 5px; transition: all ease-in-out .3s; }
#tabss .pessoas button:hover, #tabss .pessoas button:focus { background-color: #a80226; }

/* Products */
#products { padding: 90px 0 120px; }
#products .flex-wrap { display: flex; flex-wrap: wrap; }
#products .flex-wrap .flex-item { width: 25.43333%; text-align: center; padding: 0 40px; position: relative; }
#products .flex-wrap .flex-item .tit { font-size: 18px; font-weight: 600; text-transform: uppercase; margin: 20px 0; }
#products .flex-wrap .flex-item p { margin-bottom: 30px; }
#products .flex-wrap .flex-item img { max-height: 250px; }
#products .flex-wrap .flex-item .cta a { background-color: #c1022c; border-radius: 500px; padding: 10px 20px; font-size: 14px; color: #fff; text-decoration: none; font-family: 'AktivGrotesk-Bold'; transition: all ease-in-out .3s; }
#products .flex-wrap .flex-item .cta a:hover, #products .flex-wrap .flex-item .cta a:focus { background-color: #a80226; }

/* Solicita */
#solicita { background: url('../img/bg-solicitia.png') no-repeat center right #e3e3e3; padding: 82px 0; }
#solicita .txt-box { width: 50%; }
#solicita .txt-box h3 { font-size: 24px; font-weight: 600; }
#solicita .txt-box h2 { font-size: 40px; color: #c1022c; line-height: normal; padding: 20px 0; }
#solicita .txt-box p { font-size: 18px; line-height: normal; margin-bottom: 40px; }
#solicita .txt-box .cta { margin-top: 20px; }
#solicita .txt-box .cta a { background-color: #c1022c; color: #fff; text-align: center; text-transform: uppercase; font-size: 18px; padding: 15px 20px; text-decoration: none; box-shadow: 0px 2px 5px rgba(0,0,0,.5); transition: all ease-in-out .3s; }
#solicita .txt-box .cta a:hover, #solicita .txt-box .cta a:focus { background-color: #a80226; }

/* Contacte Nos */
#contacte-nos { padding: 90px 0 0; text-align: center; }
#contacte-nos h3 { font-size: 24px; color: #c1022c; }
#contacte-nos h2 { font-size: 40px; padding: 20px 0; line-height: normal; }
#contacte-nos p { font-size: 18px; margin-bottom: 50px; }

/* Form Contatto */
#form-contatto { padding: 30px 0 90px; }
#form-contatto h4 { font-size: 28px; text-align: center; line-height: normal;  }
#form-contatto .field-required { font-size: 15px; text-align: center; color: #c1022c; padding-top: 20px; margin-bottom: 50px; }
#form-contatto .flex-wrap { display: flex; flex-wrap: wrap; }
#form-contatto .flex-wrap .flex-item { width: 47.3%; float: left; margin-right: 50px; margin-bottom: 20px; }
#form-contatto .flex-wrap .flex-item:last-child { margin-right: 0; }
#form-contatto .input-group { width: 100%; }
#form-contatto .input-group label { display: block; }
#form-contatto .input-group input { width: 100%; border: 0; border-bottom: 2px solid #000; padding: 10px 5px; color: #000; font-size: 16px; }
#form-contatto textarea { width: 99.2%; border: 0; border-bottom: 2px solid #000; background-color: #fff; font-size: 16px; line-height: 25px; background-image: linear-gradient(transparent, transparent 24px, #ddd 0px); background-size: 100% 25px; padding: 0; }
#form-contatto .cont-check { display: block; width: 100%; margin-top: 20px; }
#form-contatto .check-terms { padding: 10px 20px 10px 0; }
#form-contatto .invia-form { text-align: center; margin-top: 60px; display: block; width: 100%; }
#form-contatto .invia-form a { color: #fff; background-color: #c1022c; text-transform: uppercase; font-size: 16px; font-weight: 600; text-decoration: none; padding: 15px 20px; box-shadow: 0px 2px 5px rgba(0,0,0,.5); transition: all ease-in-out .3s; }
#form-contatto .invia-form a:hover, #form-contatto .invia-form a:focus { background-color: #a80226; }
#form-contatto [type="checkbox"]:not(:checked),
#form-contatto [type="checkbox"]:checked { position: absolute; left: -9999px; }
#form-contatto [type="checkbox"]:not(:checked) + label,
#form-contatto [type="checkbox"]:checked + label { position: relative; padding-left: 2.95em; cursor: pointer; padding-top: 0.2em; }

/* checkbox aspect */
#form-contatto [type="checkbox"]:not(:checked) + label:before,
#form-contatto [type="checkbox"]:checked + label:before { content: ''; position: absolute; left: 0; top: 0; width: 1.25em; height: 1.25em; border: 2px solid #000; background: #fff; box-shadow: inset 0 1px 3px rgba(0,0,0,.1); }
/* checked mark aspect */
#form-contatto [type="checkbox"]:not(:checked) + label:after,
#form-contatto [type="checkbox"]:checked + label:after { content: '✔'; position: absolute; top: .2em; left: .2em; font-size: 1.3em; line-height: 0.8; color: #09ad7e; transition: all .2s; }
/* checked mark aspect changes */
#form-contatto [type="checkbox"]:not(:checked) + label:after { opacity: 0; transform: scale(0); }
#form-contatto [type="checkbox"]:checked + label:after { opacity: 1; transform: scale(1); }
/* disabled checkbox */
#form-contatto [type="checkbox"]:disabled:not(:checked) + label:before,
#form-contatto [type="checkbox"]:disabled:checked + label:before { box-shadow: none; border-color: #bbb; background-color: #ddd; }
#form-contatto [type="checkbox"]:disabled:checked + label:after { color: #999; }
#form-contatto [type="checkbox"]:disabled + label { color: #aaa; }
/* accessibility */
#form-contatto [type="checkbox"]:checked:focus + label:before,
#form-contatto [type="checkbox"]:not(:checked):focus + label:before { border: 2px dotted #c1022c; }
/* hover style just for information */
#form-contatto label:hover:before { border: 2px solid #c1022c !important; }


/* Faq */
#faqs { padding: 50px 0; }
#faqs h3 { font-size: 24px; color: #c1022c; text-transform: uppercase; text-align: center; font-weight: 600; }
#faqs h2 { font-size: 40px; text-align: center; padding: 20px 0; line-height: normal; }
#faqs p { text-align: center; font-size: 18px; line-height: normal;  }
#faqs .accordion-faq { margin-top: 50px; }
/* Style the buttons that are used to open and close the accordion panel */
#faqs button.accordion { background-color: #c1022c; color: #fff; cursor: pointer; padding: 18px; width: 100%; text-align: left; border: none; outline: none; transition: 0.4s; font-size: 16px; font-family: 'Montserrat', sans-serif; margin-bottom: 2px; }
/* Add a background color to the button if it is clicked on (add the .active class with JS), and when you move the mouse over it (hover) */
#faqs button.accordion.active, button.accordion:hover { background-color: #c1022c; }
/* Style the accordion panel. Note: hidden by default */
#faqs div.panel { padding: 30px 15px; background-color: white; display: none; }
#faqs div.panel p { text-align: left; font-size: 16px; line-height: normal; }
#faqs button.accordion:after { content: '+'; /* Unicode character for "plus" sign (+) */ font-size: 24px; color: #fff; float: right; margin-left: 5px; }
#faqs .accordion.active:after { content: "-"; /* Unicode character for "minus" sign (-) */ }


/* Manual */
#manual { padding: 90px 0; }
#manual .flex-wrap{ display: flex; flex-wrap: wrap; }
#manual .flex-wrap .flex-item { float: left; width: 37%; }
#manual .flex-wrap .flex-item:first-child { width: 60%; margin-right: 30px; }
#manual h3 { font-size: 24px; color: #c1022c; text-transform: uppercase; font-weight: 600; }
#manual h2 { font-size: 40px; line-height: normal; padding: 20px 0; }
#manual p { font-size: 18px; line-height: normal; }
#manual p.cta { margin-top: 50px; }
#manual p.cta a { text-decoration: none; border: 2px solid #c1022c; padding: 10px 15px; text-transform: uppercase; font-weight: 600; font-size: 16px; transition: all ease-in-out .3s; }
#manual p.cta a:hover { background-color: #c1022c; color: #fff; }
#manual .video { text-align: center; }
#manual .video img { width: 100%; }
#manual .video p { font-size: 14px; }

@media (max-width: 1024px) {
    .content { width: 100%; }
    #visual .img { position: absolute; right: 0; float: none; margin-right: 0; bottom: -70px; }
    #visual .img img { height: 670px; }
    #visual .txt { left: 90px; }
    #vantaggi { padding: 150px 50px 50px; }
    #come-funziona { padding: 50px; }
    #come-funziona .flex-wrap { flex-wrap: nowrap; }
    #form-contatto .input-group input { width: 98%; }
    #cop { padding: 50px; }
    #cop .flex-wrap { flex-wrap: nowrap; }
    #tabss { padding: 50px; }
    #products { padding: 50px 0 90px; }
    #products .flex-wrap { flex-wrap: nowrap; }
    #solicita { background: url('../img/bg-solicitia.png') no-repeat 240% 50% #e3e3e3; padding: 50px; }
    #contacte-nos { padding: 50px 50px 0; }
    #visual .txt .tit { font-size: 80px; }
    #visual .txt .abs { font-size: 30px; }
    #form-contatto { padding: 50px; }
    #form-contatto .flex-wrap { flex-wrap: nowrap; }
    #faqs { padding: 50px; }
    #manual { padding: 50px; }
    #manual .flex-wrap { flex-wrap: nowrap; }
}

@media (min-width: 1024px) and (max-width: 1199px) {
    .content { width: 100%; }
    #visual .img { position: absolute; right: 0; float: none; margin-right: 0; bottom: -70px; }
    #visual .txt { left: 90px; }
    #vantaggi { padding: 150px 50px 50px; }
    #come-funziona { padding: 50px; }
    #come-funziona .flex-wrap { flex-wrap: nowrap; }
    #form-contatto .input-group input { width: 98%; }
    #cop { padding: 50px; }
    #cop .flex-wrap { flex-wrap: nowrap; }
    #tabss { padding: 50px; }
    #products { padding: 50px 0 90px; }
    #products .flex-wrap { flex-wrap: nowrap; }
    #solicita { background: url('../img/bg-solicitia.png') no-repeat 240% 50% #e3e3e3; padding: 50px; }
    #contacte-nos { padding: 50px 50px 0; }
    #visual .txt .tit { font-size: 80px; }
    #visual .txt .abs { font-size: 30px; }
    #form-contatto { padding: 50px; }
    #form-contatto .flex-wrap { flex-wrap: nowrap; }
    #faqs { padding: 50px; }
    #manual { padding: 50px; }
    #manual .flex-wrap { flex-wrap: nowrap; }
}

@media (max-width: 991px) {
  #visual .txt { max-width: 400px;}
  #tabss .flex-wrap {
    flex-direction: column;
  }
  #tabss .flex-wrap .flex-item {
    flex-basis: 100%;
    width: 100%;
  }
}

@media (max-width: 768px) {
    #top, footer { display: none; }
    #visual .img { right: -70px; bottom: -50px; }
    #visual .img img { height: 600px; }
    #visual .txt .abs { font-size: 24px; }
    #visual .txt .abs_small { font-size: 18px; margin-bottom: 10px; }
    #come-funziona .flex-wrap { flex-wrap: wrap; }
    #come-funziona .flex-wrap .flex-item { float: none; width: 100%; }
    #tabss div.tab button { padding: 20px 15px; font-size: 14px; }
    #tabss .escolha h2 { font-size: 28px; }
    #products .flex-wrap { flex-wrap: wrap; }
    #products .flex-wrap .flex-item { width: 100%; float: none; margin-bottom: 60px; padding: 0; }
    #products .flex-wrap .flex-item:last-child {margin-bottom: 0; }
    #products .flex-wrap .flex-item .cta { position: static; width: auto; }
    #solicita { padding: 50px; background: url('../img/bg-solicitia.png') no-repeat #e3e3e3; background-position-x: 100px; }
    #solicita .txt-box h2 { font-size: 28px; }
    #solicita .txt-box h3 { font-size: 18px; }
    #solicita .txt-box p, #manual p { font-size: 16px; line-height: 26px; }
    #contacte-nos h2 { font-size: 28px; }
    #form-contatto h4 { font-size: 24px; }
    #faqs h2, #manual h2 { font-size: 28px; }
    #faqs h3, #contacte-nos h3, #manual h3 { font-size: 18px; }
    #products .flex-wrap .flex-item p { font-size: 16px; line-height: 26px; }
    #come-funziona .img-come-funziona { margin-top: 50px; }
    #vantaggi .tit { font-size: 28px; }
    #vantaggi .top-tit { font-size: 18px; padding-bottom: 30px; }
    #cop .tit { font-size: 28px; }
    #cop p, #cop ul li { font-size: 16px; }
    #tabss .escolha h3 { font-size: 18px; }
    #tabss .escolha p { font-size: 16px; }
    #tabss .video img { width: 100%; }
    #tabss .flex-wrap .flex-item { width: 100%; } 
    #tabss .flexibilidade .flex {   flex-direction: column;  }
    #tabss .flexibilidade .thumb { flex-basis: auto;   }
    #tabss .flexibilidade .flex-item { margin-bottom: 30px;  }
    #tabss .pessoas {
      width: auto;
    }
      #tabss .pessoas label {     display: block; margin-bottom:25px;    }
      #products { padding: 50px; }

}

@media (min-width: 768px) and (max-width: 991px) {
    #top, footer { display: none; }
    #visual .img { right: -70px; bottom: -30px; }
    #visual .img img { height: 600px; }
    #visual .txt .abs { font-size: 24px; }
    #come-funziona .flex-wrap { flex-wrap: wrap; }
    #come-funziona .flex-wrap .flex-item { float: none; width: 100%; }
    #tabss div.tab button { padding: 20px 15px; font-size: 14px; }
    #tabss .escolha h2 { font-size: 28px; }
    #products .flex-wrap { flex-wrap: wrap; }
    #products .flex-wrap .flex-item { width: 100%; float: none; margin-bottom: 60px; padding: 0; }
    #products .flex-wrap .flex-item:last-child {margin-bottom: 0; }
    #products .flex-wrap .flex-item .cta { position: static; width: auto; }
    #solicita { padding: 50px; background: url('../img/bg-solicitia.png') no-repeat #e3e3e3; background-position-x: 100px; }
    #solicita .txt-box h2 { font-size: 28px; }
    #solicita .txt-box h3 { font-size: 18px; }
    #solicita .txt-box p, #manual p { font-size: 16px; line-height: 26px; }
    #contacte-nos h2 { font-size: 28px; }
    #form-contatto h4 { font-size: 24px; }
    #faqs h2, #manual h2 { font-size: 28px; }
    #faqs h3, #contacte-nos h3, #manual h3 { font-size: 18px; }
    #products .flex-wrap .flex-item p { font-size: 16px; line-height: 26px; }
    #come-funziona .img-come-funziona { margin-top: 50px; }
    #vantaggi .tit { font-size: 28px; }
    #vantaggi .top-tit { font-size: 18px; padding-bottom: 30px; }
    #cop .tit { font-size: 28px; }
    #cop p, #cop ul li { font-size: 16px; }
    #tabss .escolha h3 { font-size: 18px; }
    #tabss .escolha p { font-size: 16px; }
    #products { padding: 50px; }
}

@media (max-width: 680px) {
  #visual .txt { top: 6vh;}
}

@media (min-width: 501px) and (max-width: 767px) {
  #visual .img { right: -130px  }
  #visual .img img { height: 460px; bottom: 0;  }
}


@media (min-width: 426px) and (max-width: 500px) {
  #visual .img img { height: 360px; bottom: 0;  }
}


@media (min-width: 426px) and (max-width: 767px) {
  #visual .txt { left: 40px;  width: calc(100% - 40px);}
}



@media (max-width:425px) {
    #tabss .video img { width: 100%; }
    #tabss .pessoas { width: 100%; padding: 25px 0;}
    #visual .img img { height: 300px; transform: translate(48px); }
    #visual .txt { position: relative; top: 19vh; left: auto; right: auto; text-align: center; float: none; top: 7vh;  }
    #visual .txt .keys li { margin: 17px 0; }
    #visual .txt .keys li a { font-size: 14px; padding: 7px; }
    #visual .txt .tit { font-size: 60px; line-height: normal;margin-bottom: 10px; }
    #visual .txt .abs {margin-bottom: 20px; }
    #visual .img { position: relative; right: auto; left: auto; text-align: center; bottom: -90px; }
    #vantaggi .tit { font-size: 24px; line-height: normal; }
    #cop .flex-wrap { flex-wrap: wrap; }
    #cop .flex-wrap .flex-item { width: 100%; float: none; margin-bottom: 50px; }
    #cop .flex-wrap .flex-item:last-child { margin-bottom: 0; }
    #tabss div.tab button { display: block; width: 100%; }
    #tabss .flex-wrap { flex-wrap: wrap; }
    #tabss .flex-wrap .flex-item { width: 100%; float: none; margin-bottom: 30px; }
    #tabss .flex-wrap .flex-item:last-child { margin-bottom: 0; }
    #tabss .escolha h2 { font-size: 24px; }
    
    #tabss .pessoas label { display: block; width: 100%; text-align: center; font-size: 16px; }
    #tabss .pessoas input, #tabss .pessoas button {display: block; box-sizing: border-box; width: calc( 100% - 20px); margin: 0 10px 10px; }
    #tabss .pessoas button { margin-bottom: 0;      }
    #solicita .txt-box { width: 100%; }
    #contacte-nos h2 { font-size: 24px; }
    #form-contatto h4 { font-size: 20px; }
    #faqs h2, #manual h2 { font-size: 24px; }
    #faqs p { font-size: 16px; }
    #manual .flex-wrap { flex-wrap: wrap; }
    #manual .flex-wrap .flex-item { width: 100%; float: none; }
    #manual .flex-wrap .flex-item:first-child { width: 100%; margin-bottom: 50px; }
    #manual p.cta a { display: block; width: 100%; font-size: 16px; text-align: center; }
    #form-contatto .invia-form a { font-size: 14px; }
    #contacte-nos img { width: 100%; }
}

@media (max-width: 320px) {
    #cop, #come-funziona, #tabss, #products, #solicita, #contacte-nos, #form-contatto, #faqs, #manual { padding: 20px; }
    #visual .txt .tit { font-size: 50px; }
    #visual .txt .abs { font-size: 20px; }
    #visual .img { bottom: -140px; }
    #manual p.cta a { font-size: 13px; padding: 5px; }
}



/**
  * -----------------------------------------
  * Hero
  * -----------------------------------------
  */
  .hero {
    background: url(/pt/landing/nuos/img/bg-visual.jpg) no-repeat center center;
    background-size: cover;
    overflow: hidden;
  }
  
  .hero__wrapper {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    margin: 0 auto;
    flex-direction: column;
    padding-left: 60px;
    padding-right: 60px;
  }
  
  .hero__image, .hero__text {
    -webkit-box-flex: 0;
        -ms-flex: 0 0 50%;
            flex: 0 0 50%;
    color: white;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: end;
        -ms-flex-align: end;
            align-items: flex-end;
    padding-bottom: 60px;
    overflow: hidden;
  }
  
  .hero__image {
    position: relative;
    text-align: center;    
    flex-direction: column;
    align-items: center;
  }
  
  .hero__image img {
    width: 420px;
    top: 0;
    max-width: 100%;
  }
  
  .hero__image a {
    color: white;
    border: 2px solid white;
    text-decoration: none;
    padding: 15px;
    font-weight: 800;
    text-transform: uppercase;
  }
  
  .hero__text {
    padding-top: 30px;
  }
  
  .hero__text .tit {
    font-size: 60px;
    text-transform: uppercase;
    font-weight: 800;
    line-height: 1;
    margin-bottom: 20px;
  }
  
  .hero__text .abs {
    font-size: 22px;
    margin-bottom: 60px;
    text-transform: uppercase;
  }
  
  .hero__footer {
    display: block;
  }
  
  .hero .abs_small {
    font-size: 18px;
  }
  
  .hero .keys {
    padding: 0;
    margin: 20px 0 0;
  }
  
  .hero .keys li {
    list-style: none;
    display: inline-block;
    margin-right: 10px;
    margin-top: 10px;
  }
  
  .hero .keys li a {
    color: white;
    background-color: #c1022c;
    padding: 10px;
    font-size: 16px;
    display: block;
    border-radius: 4px;
    text-decoration: none;
  }

  .hero .keys li .fa { display: none; }
  
  @media (min-width: 992px) {
    .hero__wrapper {
      flex-direction: row;      
      height: 500px;
    }
    
    .hero__image {
      justify-content: left;
      flex-direction: row; 
      align-items: flex-end;
    }

    .hero__image img {      
      max-width: 90%;
      position: absolute;
    }

    .hero__image a { margin-left: 30px; }
  }


  @media (min-width: 1200px) {
    .hero__wrapper {height: 600px;}
    .hero__image img {      
      width: 600px;
    }
  }




/**
 * -----------------------------------------
 * Scroll FX
 * -----------------------------------------
 */
.wow, .wow-down { visibility: hidden; } 



/**
 * -----------------------------------------
 * Fancybox content
 * -----------------------------------------
 */
 #fancybox-content {display: none;}