/* Responsive MQ */

/* transitions variable */

/* RESET GENERICO */

html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video {

  border: 0 none;

  font-size: 100%;

  margin: 0;

  padding: 0;

  vertical-align: baseline;

  font-family: 'Fira Sans', sans-serif;

  font-weight: 300;

  outline: 0;

  frameborder: 0; }



*, *:before, *:after {

  box-sizing: border-box; }



html {

  height: 100%;

  position: relative; }



body {

  height: 100%;

  color: #182935;

  overflow: visible; }

  body.noscroll {

    overflow: hidden !important; }



/* CLASSI COMUNI */

a {

  text-decoration: none; }



.clear {

  clear: both; }



ul {

  list-style-type: none; }



.left {

  float: left; }



.right {

  float: right; }



.al-right {

  text-align: right; }



.al-left {

  text-align: left; }



.al-center {

  text-align: center;

  transform: translateX(-50%);

  left: 50%;

  position: relative; }



.centerize {

  text-align: center; }



.mr10 {

  margin-right: 10px; }



.ml10 {

  margin-left: 10px; }



.mb30 {

  margin-bottom: 30px; }



.pdlr-0 {

  padding-left: 0px !important;

  padding-right: 0px !important; }



.pd-0 {

  padding: 0px !important; }



.w100 {

  width: 100%; }



.clear {

  clear: both; }



.flex {

  display: flex; }



.center {

  max-width: 1280px;

  padding: 0;

  margin: 0 auto;

  position: relative; }



.two-columns {

  -webkit-column-count: 2;

  -moz-column-count: 2;

  column-count: 2;

  column-gap: 20px;

  column-fill: auto;

  padding-top: 20px;

  padding-bottom: 20px; }

  .two-columns .gen-text-block {

    -webkit-column-break-inside: avoid;

    page-break-inside: avoid;

    break-inside: avoid;

    padding: 0 20px; }

  @media only screen and (max-width: 768px) {

    .two-columns {

      -webkit-column-count: 1;

      -moz-column-count: 1;

      column-count: 1; } }



h1 {

  font-size: 3em;

  font-family: 'Fira Sans', sans-serif;

  font-weight: 700;

  text-transform: uppercase;

  letter-spacing: 1px;

  color: #2e72a6; }



.brd-bt-foot {

  border-bottom: 1px solid rgba(255, 255, 255, 0.3); }



.white {

  color: #fff; }



h2 {

  font-family: 'Fira Sans', sans-serif;

  font-size: 2.7em;

  line-height: 1.5em;

  margin: 5px 0 20px;

  font-weight: 300;

  letter-spacing: 15px;

  text-transform: uppercase; }

  @media only screen and (max-width: 768px) {

    h2 {

      font-size: 2em;

      line-height: 1.3em;

      letter-spacing: 15px;

      margin: 0 auto 10px; } }

  h2.blue {

    color: #2e72a6; }

  h2.small {

    font-size: 2.5em;

    line-height: 1.2em;

    letter-spacing: 10px; }

    @media only screen and (max-width: 768px) {

      h2.small {

        font-size: 1.7em; } }



h3 {

  font-family: "Fira sans",serif;

  font-size: 1.4em;

  line-height: 1.2em;

  margin: 5px 0;

  font-weight: 300; }



p {

  line-height: 1.5em;

  font-weight: 300;

  margin: 0;

  font-size: 1.2em; }

  p.bold {

    font-weight: 500; }



.btn {

  background-color: rgba(0, 85, 150, 0.8);

  cursor: pointer;

  display: inline-block;

  position: relative;

  border: 1px solid rgba(0, 85, 150, 0);

  font-family: "Fira Sans",serif;

  font-weight: 300;

  height: 56px;

  margin: 20px auto 0;

  border-radius: 1000px;

  text-align: center;

  -webkit-transition: all 0.3s;

  -moz-transition: all 0.3s;

  -ms-transition: all 0.3s;

  -o-transition: all 0.3s;

  transition: all 0.3s; }

  .btn:before {

    display: block;

    color: transparent;

    padding: 3px 50px;

    font-size: 20px;

    position: relative;

    white-space: nowrap;

    content: attr(data-text); }

  .btn span {

    display: block;

    position: absolute;

    color: #fff;

    font-size: 20px;

    transform: translate(-50%, -50%);

    top: 50%;

    padding: 3px 50px;

    left: 50%;

    white-space: nowrap;

    text-transform: lowercase;

    -webkit-transition: all 0.1s;

    -moz-transition: all 0.1s;

    -ms-transition: all 0.1s;

    -o-transition: all 0.1s;

    transition: all 0.1s; }

  .btn:hover {

    background-color: transparent;

    border: 1px solid #005596; }

    .btn:hover span {

      font-size: 24px;

      color: #005596;

      font-weight: 400;

      padding: 1px 16px; }

  .btn.white {

    background-color: white; }

    .btn.white span {

      color: #005596; }

    .btn.white:hover {

      background-color: transparent;

      border: 1px solid white; }

      .btn.white:hover span {

        color: #fff; }



header {

  height: 90px;

  width: 100%;

  padding: 0 30px;

  overflow: hidden;

  position: absolute;

  top: 0;

  left: 0;

  z-index: 999;

  background-color: rgba(11, 81, 138, 0.9); }



header .logo {

  display: block;

  height: 70px;

  width: 80px;

  position: absolute;

  top: 10px;

  -webkit-transition: all 0.3s;

  -moz-transition: all 0.3s;

  -ms-transition: all 0.3s;

  -o-transition: all 0.3s;

  transition: all 0.3s;

  background-image: url(/img/header-logo-white.png);

  background-size: contain;

  background-repeat: no-repeat;

  background-position: center; }



header .logo img {

  height: 60px;

  float: left; }



header ul li {

  float: left; }



header .main-nav.lang {

  position: absolute;

  /*right: 200px;*/

  right: 30px;

  top: 0;

  height: 100%; }



header .main-nav.lang > li {

  margin: 15px 10px; }



header .main-nav.lang li a {

  -webkit-transition: all 0.3s;

  -moz-transition: all 0.3s;

  -ms-transition: all 0.3s;

  -o-transition: all 0.3s;

  transition: all 0.3s;

  color: #fff; }



header .main-nav.lang li a.active {

  font-weight: bold;

  width: 36px;

  height: 36px;

  padding: 2px;

  display: flex;

  align-items: center;

  justify-content: center;

  border-radius: 50%;

  border: 2px solid #c9ecff;

  font-weight: 700;

  margin: 0;

  color: #c9ecff; }



header .socials ul li {

  height: 40px;

  width: 30px;

  -webkit-transition: all 0.3s;

  -moz-transition: all 0.3s;

  -ms-transition: all 0.3s;

  -o-transition: all 0.3s;

  transition: all 0.3s;

  margin: 0 1px;

  font-size: 1em; }



header .socials ul li a {

  height: 100%;

  width: 100%;

  float: left;

  background-color: #ddd; }



header .socials ul li a:hover {

  background-color: #ebebeb; }



header .socials ul li a.fb {

  background-image: url(../img/icon-social-facebook.png);

  background-position: bottom center;

  background-repeat: no-repeat; }



header .socials ul li a.tw {

  background-image: url(../img/icon-social-twitter.png);

  background-position: bottom center;

  background-repeat: no-repeat; }



header .socials ul li a.ld {

  background-image: url(../img/icon-social-linkedin.png);

  background-position: bottom center;

  background-repeat: no-repeat; }



header .socials ul li a.gp {

  background-image: url(../img/icon-social-google.png);

  background-position: bottom center;

  background-repeat: no-repeat; }



nav.main-menu {

  position: relative;

  display: flex;

  height: 100%;

  justify-content: center;

  text-align: center; }



nav.main-menu ul {

  display: flex;

  align-content: center;

  align-items: center; }



nav.main-menu ul li {

  margin: 0 1em;

  float: none; }



nav.main-menu ul li:last-child, .main-menu.lang ul li:last-child {

  margin-right: 0; }



nav.main-menu ul li a {

  color: #fff;

  font-size: 0.9em;

  font-weight: 500;

  padding: 0 0 10px 0;

  white-space: nowrap; }



nav.main-menu ul li a.active {

  color: #c9ecff;

  font-weight: 500; }



nav.main-menu ul li a:hover {

  color: #c9ecff; }



#toggle-id:checked + .toggle-class:after {

  content: ''; }



#toggle-id, .toggle-class {

  display: none; }



.toggle-class {

  z-index: 2; }



/* Nicolas Gallagher micro clearfix */

.clearfix:before, .clearfix:after {

  display: table;

  content: ""; }



.clearfix:after {

  clear: both; }



/* SHRINKING HEADER */

header.white {

  top: 0px;

  height: 60px;

  background-color: rgba(11, 81, 138, 0.9);

  position: fixed;

  box-shadow: 0 1px 5px rgba(0, 0, 0, 0.2);

  -webkit-animation-duration: .3s;

  animation-duration: .3s;

  -webkit-animation-fill-mode: both;

  animation-fill-mode: both;

  -webkit-animation-name: stickyTransition;

  animation-name: stickyTransition; }



header.white .logo {

  height: 40px;

  -webkit-transition: all 0.2s;

  -moz-transition: all 0.2s;

  -ms-transition: all 0.2s;

  -o-transition: all 0.2s;

  transition: all 0.2s; }



header.white .main-nav.lang li {

  margin-top: 7px;

  margin-bottom: 7px; }



header.white nav.main-menu {

  height: 60px; }



/* END SHRINKING HEADER */

@-webkit-keyframes stickyTransition {

  from {

    opacity: 0;

    -webkit-transform: translate3d(0, -100%, 0);

    transform: translate3d(0, -100%, 0); }

  to {

    opacity: 1;

    -webkit-transform: none;

    transform: none; } }

@keyframes stickyTransition {

  from {

    opacity: 0;

    -webkit-transform: translate3d(0, -100%, 0);

    transform: translate3d(0, -100%, 0); }

  to {

    opacity: 1;

    -webkit-transform: none;

    transform: none; } }

section.noslide {

  margin-top: 110px;

  padding: 140px 0; }



time {

  color: #999;

  font-size: 0.8em;

  margin-top: 5px; }



footer {

  background-color: #276fa6;

  padding: 80px 0; }

  @media only screen and (max-width: 768px) {

    footer {

      padding: 30px 0; } }



.footer-padding {

  padding: 0 50px; }



.foot-list {

  color: #fff;

  float: left;

  margin: 30px 0;

  padding: 0 20px;

  width: 25%; }



.foot-list li {

  padding: 5px 0;

  font-size: 0.9em;

  font-weight: 300;

  line-height: 1.2em; }



.foot-list li a {

  color: #fff; }



.foot-list li a.social:hover {

  opacity: 0.8; }



.foot-list li a:hover {

  color: #57bcf3; }



.foot-list li.head {

  background-position: 0 3px;

  background-repeat: no-repeat;

  color: #fff;

  font-size: 1.3em;

  margin-bottom: 10px;

  padding-bottom: 10px;

  font-weight: 300;

  letter-spacing: 6px; }



.copyright {

  color: #fff;

  font-size: 0.8em;

  text-align: center;

  padding: 20px 0; }



.dbone {

  margin: 0 auto;

  display: block;

  display: table;

  padding-bottom: 10px;

  opacity: 0.5; }

  .dbone img {

    width: 40px; }



.dbone:hover {

  opacity: 1; }



.tp-caption {

  opacity: 0; }



.wrapper {

  min-height: 100%;

  height: auto !important;

  height: 100%; }



.gen-text-block.double {

  width: 100%; }



.gen-text-block a:not(.btn) {

  color: #015293;

  font-weight: 500; }



.gen-text-block {

  padding: 20px 20px;

  position: relative; }



.gen-text-block a:not(.btn):hover {

  text-decoration: underline; }



.gen-text-block img {

  width: 100%; }



.gen-text-block .inner-img img {

  width: auto !important; }



.gen-text-block .inner-img img:hover {

  opacity: 0.7; }



.gen-text-block img.normal {

  width: auto; }



.inner-section.bg_white {

  background-color: #fff; }



.inner-section.bg_bluegrey {

  background-color: #4c5a65; }



.inner-section.bg_lightgrey {

  background-color: #ebebeb; }



.inner-section.bg_blue {

  background-color: #02182a; }



section.first-step.full-width {

  height: auto !important; }



section .subsection {

  padding: 100px 30px; }

  @media only screen and (max-width: 768px) {

    section .subsection {

      padding: 50px 30px; } }

  @media only screen and (max-width: 480px) {

    section .subsection {

      padding: 30px; } }



@media only screen and (max-width: 1280px) {

  header {

    height: 75px; }



  header .logo {

    height: 55px; }



  header .socials ul li {

    height: 30px; }



  header .lang ul li {

    height: 30px;

    line-height: 30px; }



  header nav.main-menu ul li {

    margin: 0 1%; }



  header nav.main-menu ul li a {

    padding: 0 0 5px 0;

    font-size: 0.8em; }



  header .main-nav.lang > li {

    margin: 7px 10px; }



  section.noslide {

    margin-top: 40px; } }

@media only screen and (max-width: 992px) {

  header {

    overflow: visible;

    padding: 0 15px; }



  /* SHRINKING HEADER RESPONSIVE */

  header.smaller nav.main-menu {

    bottom: 0; }



  header.smaller nav.main-menu ul li a {

    padding: 10px 0; }



  header .socials ul li {

    margin: 22px 5px; }



  /* END SHRINKING HEADER RESPONSIVE*/

  .toggle-class {

    cursor: pointer;

    display: block;

    /* float: left; */

    height: 50px;

    margin: 0px 0 0 85px;

    position: absolute;

    width: 50px;

    -webkit-touch-callout: none;

    -webkit-user-select: none;

    user-select: none;

    right: 0px;

    top: 50%;

    transform: translateY(-50%); }



  #toggle-id:checked ~ ul.main-nav {

    display: block;

    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";

    filter: alpha(opacity=100);

    -moz-opacity: 1;

    -khtml-opacity: 1;

    opacity: 1;

    height: auto; }



  label.main-menu-toggle {

    margin: 0;

    float: left; }



  label.toggle-class::after {

    background-image: url("../img/menu-icon-mobile.png");

    background-position: center center;

    background-repeat: no-repeat;

    box-sizing: border-box;

    content: "";

    display: block;

    height: 50px;

    left: 0;

    position: absolute;

    top: 0;

    width: 50px; }



  header nav.main-menu {

    width: 100%;

    margin: 0;

    left: 0;

    right: 0;

    bottom: 0; }



  header nav ul.main-nav {

    display: none;

    height: 0;

    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";

    filter: alpha(opacity=0);

    -moz-opacity: 0;

    -khtml-opacity: 0;

    border-top: 1px solid #ccc;

    opacity: 0;

    width: calc(100% + 30px);

    position: absolute;

    top: 100%;

    right: -15px;

    background-color: #fff;

    z-index: 100; }



  header nav ul.main-nav > li {

    display: block;

    width: 100%;

    margin: 0;

    padding: 0; }



  header nav ul.main-nav > li > a {

    display: block;

    width: 100%;

    border: 0;

    text-decoration: none;

    -webkit-box-sizing: border-box;

    -moz-box-sizing: border-box;

    box-sizing: border-box;

    border-bottom: 1px solid transparent;

    text-align: center;

    padding: 14px 0; }



  header nav.main-menu ul li a.active {

    border-bottom: 1px solid #ccc;

    color: #005596; }



  header nav.main-menu ul li a {

    border-bottom: 1px solid #ccc;

    color: #666; }



  header .logo {

    width: 60px;

    overflow: hidden; }



  header .main-nav.lang {

    position: absolute;

    right: auto;

    background-color: transparent;

    width: auto;

    border-top: none;

    top: 0; }

    header .main-nav.lang li {

      width: 40px;

      float: left;

      margin: 0;

      margin-top: 20px;

      background-color: transparent;

      height: 40px; }

      header .main-nav.lang li a:not(.active) {

        border: none; }

      header .main-nav.lang li a.active {

        font-weight: bold;

        width: 36px;

        height: 36px;

        padding: 2px;

        display: flex;

        align-items: center;

        justify-content: center;

        border-radius: 50%;

        border: 2px solid #c9ecff;

        font-weight: 700;

        margin: 0;

        color: #c9ecff; }



  header.white .main-nav.lang li {

    margin-top: 10px; }



  .foot-list {

    width: 50%;

    margin: 20px 0 10px; } }

@media only screen and (max-width: 768px) {

  section.first-step {

    height: auto !important;

    margin-top: 70px; }



  .footer-padding {

    padding: 0 0; }



  .menu-footer {

    display: none; }



  .foot-list {

    width: 100%;

    margin: 10px 0 10px; } }

ul.azienda-topics li {

  width: 33.33%;

  float: left;

  background-repeat: no-repeat;

  padding: 20px 25px 10px 25px; }

  ul.azienda-topics li h3 {

    font-weight: 500;

    text-align: center; }

  ul.azienda-topics li img {

    height: 80px;

    margin: 10px auto; }

  ul.azienda-topics li p {

    text-align: justify; }



.hideme {

  opacity: 0; }

  .hideme.moveStyle {

    opacity: 1;

    -webkit-transition: all 0.3s;

    -moz-transition: all 0.3s;

    -ms-transition: all 0.3s;

    -o-transition: all 0.3s;

    transition: all 0.3s; }

  .hideme.moveUp {

    transform: translateY(100px);

    -webkit-transition: all 0.3s;

    -moz-transition: all 0.3s;

    -ms-transition: all 0.3s;

    -o-transition: all 0.3s;

    transition: all 0.3s; }

    .hideme.moveUp.moveStyle {

      opacity: 1;

      transform: translateY(0px); }

  .hideme.moveDown {

    transform: translateY(-100px);

    -webkit-transition: all 0.3s;

    -moz-transition: all 0.3s;

    -ms-transition: all 0.3s;

    -o-transition: all 0.3s;

    transition: all 0.3s; }

    .hideme.moveDown.moveStyle {

      opacity: 1;

      transform: translateY(0px); }

  .hideme.moveLeft {

    transform: translateX(-100px);

    -webkit-transition: all 0.3s;

    -moz-transition: all 0.3s;

    -ms-transition: all 0.3s;

    -o-transition: all 0.3s;

    transition: all 0.3s; }

    .hideme.moveLeft.moveStyle {

      opacity: 1;

      transform: translateX(0px); }

  .hideme.moveRight {

    transform: translateX(100px);

    -webkit-transition: all 0.3s;

    -moz-transition: all 0.3s;

    -ms-transition: all 0.3s;

    -o-transition: all 0.3s;

    transition: all 0.3s; }

    .hideme.moveRight.moveStyle {

      opacity: 1;

      transform: translateX(0px); }



a.social {

  display: inline-block;

  padding: 15px 10px;

  opacity: 0.5; }

  a.social img {

    height: 20px; }

  a.social:hover {

    opacity: 1; }



.subsection {

  width: 100%;

  float: left;

  background-position: center;

  background-size: cover; }

  .subsection .center-100 .gen-text-block {

    padding: 20px;

    width: 100%;

    max-width: 1280px;

    margin: 0;

    position: relative;

    z-index: 2;

    display: inline-block; }

    .subsection .center-100 .gen-text-block h1, .subsection .center-100 .gen-text-block h2, .subsection .center-100 .gen-text-block p {

      color: #fff; }

    .subsection .center-100 .gen-text-block h1 {

      font-family: 'Fira Sans', sans-serif;

      font-size: 3.5em;

      line-height: 1.1em;

      margin: 5px 0 40px;

      font-weight: 300;

      letter-spacing: 15px;

      text-transform: uppercase; }

    .subsection .center-100 .gen-text-block p {

      color: #fff; }

    @media only screen and (max-width: 768px) {

      .subsection .center-100 .gen-text-block {

        width: 100%; }

        .subsection .center-100 .gen-text-block h1 {

          font-size: 1.8em;

          letter-spacing: 10px; } }

  .subsection.azienda-home {

    background-image: url(../img/bg-azienda-home.webp); }

  .subsection.red-home {

    background-image: url(../img/red_bg.webp); }

  .subsection.prodotti-top {

    background-image: url(../img/prodotti_bg.webp); }

  .subsection.dev-home {

    background-image: url(../img/development_bg.webp); }

  .subsection.contatti-top {

    background-image: url(../img/contatti_bg.webp); }

  .subsection.download-area-top {

    background-image: url(../img/downloadarea_bg.webp); }



.first-section .subsection {

  padding-top: 140px; }

  @media only screen and (max-width: 768px) {

    .first-section .subsection {

      padding: 60px 20px; } }



.inner-section {

  width: 100%;

  display: inline-block;

  padding: 20px 0; }

  @media only screen and (max-width: 768px) {

    .inner-section {

      padding: 20px 0; } }



.services-development li {

  position: relative;

  padding: 20px 20px 20px 30px;

  font-size: 1.2em;

  display: flex;

  text-align: left;

  break-inside: avoid; }

  .services-development li:before {

    color: #222;

    content: "";

    background-image: url(../img/goccia.svg);

    background-size: 10px;

    background-repeat: no-repeat;

    background-position: center;

    display: block;

    font-size: 10px;

    height: 18px;

    width: 10px;

    left: 5px;

    position: absolute;

    top: 22px;

    opacity: 0.8; }

  @media only screen and (max-width: 768px) {

    .services-development li {

      width: 100%;

      font-size: 1em; } }



.services-development {

  padding-left: 20px;

  padding-right: 20px;

  width: 50%;

  float: left; }

  .services-development ul {

    column-count: 2;

    column-gap: 30px;

    column-fill: auto; }

    @media only screen and (max-width: 768px) {

      .services-development ul {

        column-count: 1; } }

  .services-development.double {

    width: 100%; }



section.first-section {

  display: flex;

  width: 100%; }



.video-wrap {

  width: 100%;

  max-height: 500px; }



.video-wrap::before {

  content: '';

  position: absolute;

  height: 100%;

  width: 100%;

  top: 0;

  right: 0;

  left: 0;

  bottom: 0;

  background: rgba(0, 0, 0, 0.5);

  z-index: 10; }



.video-wrap video {

  width: 100%;

  height: 100%; }



.content-overlay {

  position: absolute;

  width: 100%;

  max-width: 1280px;

  top: 50%;

  left: 50%;

  transform: translateY(-50%);

  z-index: 100;

  padding: 50px 0; }



.video-wrap .parallax-content {

  position: absolute;

  width: 100%;

  /* max-width: 1280px; */

  top: 0;

  left: 0;

  /* transform: translate(-50%, -50%); */

  z-index: 100;

  padding-top: 150px;

  height: 100%;

  background-color: #08518ab0; }

  @media only screen and (max-width: 768px) {

    .video-wrap .parallax-content {

      padding-top: 40px; } }



.parallax-text {

  max-width: 1024px;

  width: 90%;

  /* background: rgba(0, 0, 0, 0.5); */

  margin: 0 auto;

  padding: 50px; }



.parallax-content .parallax-text h1 {

  font-family: 'Fira Sans', sans-serif;

  font-size: 3.5em;

  line-height: 1.1em;

  margin: 5px 0 40px;

  font-weight: 300;

  letter-spacing: 0px;

  text-transform: uppercase;

  color: #fff;

  text-align: center; }

  @media only screen and (max-width: 768px) {

    .parallax-content .parallax-text h1 {

      font-size: 2.5em; } }



.parallax-text > h2 {

  font-size: 45px;

  font-weight: 300;

  color: #fff;

  text-align: center; }



.parallax-text h3.subtitle {

  color: #fff; }



.parallax-text > p {

  line-height: 1.5;

  margin-top: 35px;

  color: #fff;

  text-align: center; }



@media only screen and (max-width: 768px) {

  .flex.blueblocks {

    display: block; } }



@media only screen and (max-width: 768px) {

  .fp-section {

    max-height: 430px; } }



/*# sourceMappingURL=main.css.map */