@import url("https://fonts.googleapis.com/css?family=Montserrat");
@import url("https://fonts.googleapis.com/css?family=Lato");
@import url("https://fonts.googleapis.com/css?family=Chivo:300");
@import url("https://fonts.googleapis.com/css?family=Comfortaa:700");
#header {
  padding: 10px 0 10px 0; }
  #header .menu-icon {
    position: absolute;
    width: 25px;
    height: 15px;
    top: 30px;
    left: 2%; }
  #header .contact-icons {
    position: absolute;
    right: 2%;
    top: 30px; }
    #header .contact-icons .contact-svg {
      display: inline-block;
      margin-left: 10px;
      width: 20px;
      height: auto; }
      #header .contact-icons .contact-svg path {
        fill: #fff; }
      #header .contact-icons .contact-svg:hover path {
        fill: #21b5ff; }
  #header .logo {
    width: 500px;
    height: auto;
    margin: auto;
    padding-top: 30vh; }
    @media screen and (max-width: 520px) {
      #header .logo {
        width: 420px; } }
    @media screen and (max-width: 480px) {
      #header .logo {
        width: 90%; } }
  #header .navigation {
    background-color: #fff;
    text-align: center;
    position: fixed;
    top: 0;
    right: 0;
    width: 100%;
    height: 100%;
    -webkit-transform: translateY(-100%);
            transform: translateY(-100%);
    -webkit-transition: -webkit-transform 0.6s ease;
    transition: -webkit-transform 0.6s ease;
    transition: transform 0.6s ease;
    transition: transform 0.6s ease, -webkit-transform 0.6s ease;
    z-index: 1; }
    #header .navigation a {
      color: #494949;
      text-decoration: none;
      text-transform: uppercase;
      line-height: 10vh;
      font-family: arial, sans-serif;
      letter-spacing: 2px; }
      #header .navigation a:hover {
        color: #555; }
    #header .navigation ul {
      margin: 0;
      padding: 0;
      padding-top: 40px; }
    #header .navigation .open_logo {
      margin: 0 auto;
      width: 120px;
      height: 40px;
      padding-top: 50px; }
  #header .open {
    -webkit-transform: translateY(0);
            transform: translateY(0); }
  #header #modal {
    background-color: rgba(0, 0, 0, 0.95);
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    display: none; }
    #header #modal .modal-view {
      width: 30%;
      height: 80px;
      margin: 10% auto;
      background-color: #fff; }
      @media screen and (max-width: 640px) {
        #header #modal .modal-view {
          width: 80%; } }
      #header #modal .modal-view .ix {
        float: right;
        padding: 10px 20px;
        cursor: pointer;
        color: #333;
        font-family: "Lato", sans-serif;
        font-weight: 100;
        -webkit-transition: 2s;
        transition: 2s; }
        #header #modal .modal-view .ix:hover {
          color: red;
          -webkit-transition: 2s;
          transition: 2s; }
      #header #modal .modal-view h3 {
        padding: 15px 0 0 10%;
        font-family: "Lato", sans-serif;
        font-style: italic;
        color: #333;
        font-weight: 100; }
      #header #modal .modal-view p {
        padding: 5px 0 0 10%;
        text-decoration: none;
        font-family: "Lato", sans-serif;
        font-size: 14px;
        font-weight: bold; }
      #header #modal .modal-view hr {
        margin-left: 10%;
        width: 40%; }
  #header #modal-position {
    background-color: rgba(0, 0, 0, 0.95);
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    display: none; }
    #header #modal-position .modal-view {
      width: 30%;
      height: 90px;
      margin: 10% auto;
      background-color: #fff; }
      @media screen and (max-width: 740px) {
        #header #modal-position .modal-view {
          width: 80%; } }
      #header #modal-position .modal-view .ix {
        float: right;
        padding: 10px 20px;
        cursor: pointer;
        color: #333;
        font-family: "Lato", sans-serif;
        font-weight: 100;
        -webkit-transition: 2s;
        transition: 2s; }
        #header #modal-position .modal-view .ix:hover {
          color: red;
          -webkit-transition: 2s;
          transition: 2s; }
      #header #modal-position .modal-view h3 {
        padding: 15px 0 0 10%;
        font-family: "Lato", sans-serif;
        font-style: italic;
        color: #333;
        font-weight: 100; }
      #header #modal-position .modal-view p {
        padding: 5px 0 0 10%;
        text-decoration: none;
        font-family: "Lato", sans-serif;
        font-size: 14px;
        font-weight: bold; }
      #header #modal-position .modal-view hr {
        margin-left: 10%;
        width: 40%; }
  #header #modal-mail {
    background-color: rgba(0, 0, 0, 0.95);
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    display: none; }
    #header #modal-mail .modal-view {
      width: 30%;
      height: 80px;
      margin: 10% auto;
      background-color: #fff; }
      @media screen and (max-width: 640px) {
        #header #modal-mail .modal-view {
          width: 80%; } }
      #header #modal-mail .modal-view .ix {
        float: right;
        padding: 10px 20px;
        cursor: pointer;
        color: #333;
        font-family: "Lato", sans-serif;
        font-weight: 100;
        -webkit-transition: 2s;
        transition: 2s; }
        #header #modal-mail .modal-view .ix:hover {
          color: red;
          -webkit-transition: 2s;
          transition: 2s; }
      #header #modal-mail .modal-view h3 {
        padding: 15px 0 0 10%;
        font-family: "Lato", sans-serif;
        font-style: italic;
        color: #333;
        font-weight: 100; }
      #header #modal-mail .modal-view p {
        padding: 5px 0 0 10%;
        text-decoration: none;
        font-family: "Lato", sans-serif;
        font-size: 14px;
        font-weight: bold; }
      #header #modal-mail .modal-view hr {
        margin-left: 10%;
        width: 40%; }

#chisiamo::after {
  content: "";
  display: table;
  clear: both; }

#chisiamo h1 {
  text-align: left;
  padding-top: 50px;
  color: #494949;
  font-family: arial black, sans-serif;
  font-size: 24px;
  font-weight: bold; }

#chisiamo p {
  font-size: 14px;
  font-family: arial, sans-serif;
  font-weight: 400;
  color: #555; }

#chisiamo .brake {
  padding-top: 5px; }

#chisiamo .text-sotto {
  padding-top: 20px;
  padding-bottom: 50px; }

#chisiamo .lista {
  background: -webkit-gradient(linear, left top, right top, from(rgba(0, 0, 0, 0.1)), color-stop(rgba(0, 0, 0, 0.05)), to(transparent));
  background: linear-gradient(to right, rgba(0, 0, 0, 0.1), rgba(0, 0, 0, 0.05), transparent);
  color: #333;
  padding: 10px; }

#chisiamo .about-us {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex; }
  #chisiamo .about-us .box {
    width: 50%;
    padding-top: 30px; }
  #chisiamo .about-us .text {
    margin: auto; }
  #chisiamo .about-us .foto {
    background: url(../immagini/about.png) center center no-repeat;
    background-size: cover;
    height: 250px;
    margin: auto; }
  @media screen and (max-width: 740px) {
    #chisiamo .about-us {
      display: block; }
      #chisiamo .about-us .box {
        width: 100%; }
      #chisiamo .about-us .foto {
        padding-top: 20px; } }

#offerte {
  background-color: #111; }
  #offerte::after {
    content: "";
    display: table;
    clear: both; }
  #offerte h1 {
    text-align: left;
    padding-top: 50px;
    color: #fff;
    font-family: arial black, sans-serif;
    font-size: 24px;
    font-weight: bold; }
  #offerte hr {
    background-image: -webkit-gradient(linear, left top, right top, from(white), color-stop(rgba(255, 255, 255, 0.65)), to(rgba(255, 255, 255, 0)));
    background-image: linear-gradient(to right, white, rgba(255, 255, 255, 0.65), rgba(255, 255, 255, 0)); }
  #offerte .offerte {
    padding-top: 50px;
    padding-bottom: 50px;
    text-align: center; }
    #offerte .offerte::after {
      content: "";
      display: table;
      clear: both; }
    #offerte .offerte .box {
      margin-top: 10px;
      margin-right: 5px;
      width: 30%;
      text-align: center;
      float: left;
      display: inline-block;
      background-color: #333;
      padding: 10px;
      -webkit-transition: 1s;
      transition: 1s; }
      @media screen and (max-width: 1080px) {
        #offerte .offerte .box {
          width: 45%; } }
      @media screen and (max-width: 740px) {
        #offerte .offerte .box {
          display: block;
          margin-left: 0;
          width: 95%;
          text-align: center; } }
      #offerte .offerte .box p {
        text-align: left;
        font-family: "Lato", sans-serif;
        font-size: 14px;
        padding-top: 5px;
        color: #333; }
    #offerte .offerte .offerta {
      height: 100px;
      -webkit-transition: 2s;
      transition: 2s;
      background-color: #fff; }
      #offerte .offerte .offerta:hover {
        -webkit-box-shadow: 0 2px 5px #000;
                box-shadow: 0 2px 5px #000;
        -webkit-transition: 2s;
        transition: 2s; }
      #offerte .offerte .offerta .dettagli-prodotto {
        color: #555;
        text-align: left;
        font-size: 12px;
        font-family: "Lato", sans-serif;
        cursor: default; }
      #offerte .offerte .offerta .prezzo-prodotto {
        font-weight: bold;
        font-style: italic;
        cursor: pointer;
        color: #333;
        -webkit-transition: 1s;
        transition: 1s; }
      #offerte .offerte .offerta .pic-offerte {
        float: left;
        padding: 5px;
        margin-right: 5px;
        background-size: cover; }

#prodotti-btn {
  background-color: #111;
  padding: 20px 0 50px 0; }
  #prodotti-btn .prodotti {
    padding: 20px;
    width: 200px;
    margin: auto;
    background-color: #fff;
    font-family: "Lato", sans-serif;
    font-size: 14px;
    -webkit-transition: 1s;
    transition: 1s;
    text-align: center;
    color: #555; }
    #prodotti-btn .prodotti a {
      text-decoration: none;
      color: #555;
      -webkit-transition: 1s;
      transition: 1s;
      transition: 1s; }
    #prodotti-btn .prodotti:hover {
      background-color: #aaa;
      -webkit-transition: 1s;
      transition: 1s;
      color: #fff; }

#servizi {
  background-color: #efefef;
  padding-bottom: 100px; }
  #servizi::after {
    content: "";
    display: table;
    clear: both; }
  #servizi h1 {
    text-align: left;
    padding-top: 50px;
    color: #494949;
    font-family: arial black, sans-serif;
    font-size: 24px;
    font-weight: bold;
    cursor: default; }
  #servizi .box {
    margin-top: 50px;
    margin-right: 5px;
    width: 30%;
    text-align: center;
    float: left;
    display: inline-block;
    background-color: #fff;
    padding: 10px;
    -webkit-transition: 1s;
    transition: 1s; }
    #servizi .box:hover {
      -webkit-box-shadow: 0 2px 5px #333;
              box-shadow: 0 2px 5px #333;
      -webkit-transition: 1s;
      transition: 1s; }
    @media screen and (max-width: 1080px) {
      #servizi .box {
        width: 45%; } }
    @media screen and (max-width: 740px) {
      #servizi .box {
        display: block;
        margin-left: 0;
        width: 95%;
        text-align: center; } }
    #servizi .box p {
      text-align: left;
      font-family: "Lato", sans-serif;
      font-size: 14px;
      padding-top: 5px;
      color: #333; }
  #servizi .materiali-box {
    height: 100px;
    -webkit-transition: 2s;
    transition: 2s; }
    #servizi .materiali-box:hover {
      background-color: #efefef;
      -webkit-transition: 2s;
      transition: 2s; }
    #servizi .materiali-box .bio {
      color: #555;
      text-align: left;
      font-size: 12px;
      font-family: "Lato", sans-serif;
      cursor: default; }
    #servizi .materiali-box .btn-leggi {
      font-weight: bold;
      font-style: italic;
      cursor: pointer;
      color: #21b5ff;
      -webkit-transition: 1s;
      transition: 1s; }
      #servizi .materiali-box .btn-leggi:hover {
        color: #777;
        -webkit-transition: 1s;
        transition: 1s; }
    #servizi .materiali-box .materiali {
      float: left;
      padding: 10px;
      width: 50px;
      height: 50px; }
      #servizi .materiali-box .materiali path {
        fill: #333; }
    #servizi .materiali-box .consulenza {
      float: left;
      padding: 10px;
      width: 50px;
      height: 50px; }
      #servizi .materiali-box .consulenza path {
        fill: #333; }
      #servizi .materiali-box .consulenza polygon {
        fill: #333; }
    #servizi .materiali-box .corsi {
      float: left;
      padding: 10px;
      width: 50px;
      height: 50px; }
      #servizi .materiali-box .corsi path {
        fill: #333; }
    #servizi .materiali-box .visite {
      float: left;
      padding: 10px;
      width: 50px;
      height: 50px; }
      #servizi .materiali-box .visite path {
        fill: #333; }
    #servizi .materiali-box .appuntamenti {
      float: left;
      padding: 10px;
      width: 50px;
      height: 50px; }
      #servizi .materiali-box .appuntamenti path {
        fill: #333; }
    #servizi .materiali-box .agenzia {
      float: left;
      padding: 10px;
      width: 50px;
      height: 50px; }
      #servizi .materiali-box .agenzia path {
        fill: #333; }
  #servizi #materiali {
    background-color: rgba(0, 0, 0, 0.9);
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    display: none; }
    #servizi #materiali .bg-materiali {
      background: -webkit-gradient(linear, left top, left bottom, from(rgba(255, 255, 255, 0.9)), to(rgba(255, 255, 255, 0.9))), url(../svg_servizi/006-paint-roller.svg) center center no-repeat;
      background: linear-gradient(rgba(255, 255, 255, 0.9), rgba(255, 255, 255, 0.9)), url(../svg_servizi/006-paint-roller.svg) center center no-repeat;
      width: 100%;
      height: 80%;
      margin: auto; }
    #servizi #materiali .modal-view {
      width: 50%;
      height: 90%;
      margin: 20px auto;
      background-color: #fff;
      overflow: scroll; }
      @media screen and (max-width: 640px) {
        #servizi #materiali .modal-view {
          width: 80%; } }
      #servizi #materiali .modal-view .header-modal {
        background-color: #111;
        margin-bottom: 20px; }
        #servizi #materiali .modal-view .header-modal .ix {
          float: right;
          padding: 20px;
          cursor: pointer;
          color: #fff;
          font-family: "Lato", sans-serif;
          font-weight: 100;
          -webkit-transition: 2s;
          transition: 2s; }
          #servizi #materiali .modal-view .header-modal .ix:hover {
            color: red;
            -webkit-transition: 2s;
            transition: 2s; }
        #servizi #materiali .modal-view .header-modal .logo-servizi {
          width: 80px;
          float: left;
          padding: 5px 10px 0 5px;
          float: right;
          margin: 10px auto; }
          @media screen and (max-width: 840px) {
            #servizi #materiali .modal-view .header-modal .logo-servizi {
              display: none; } }
        #servizi #materiali .modal-view .header-modal h3 {
          padding: 20px;
          font-family: "Lato", sans-serif;
          color: #fff;
          font-weight: bold; }
      #servizi #materiali .modal-view p {
        padding: 0 20px 0 20px;
        text-decoration: none;
        font-family: "Lato", sans-serif;
        font-size: 14px; }
  #servizi #consulenza {
    background-color: rgba(0, 0, 0, 0.9);
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    display: none; }
    #servizi #consulenza .bg-consulenza {
      background: -webkit-gradient(linear, left top, left bottom, from(rgba(255, 255, 255, 0.9)), to(rgba(255, 255, 255, 0.9))), url(../svg_servizi/005-seo-consulting.svg) center center no-repeat;
      background: linear-gradient(rgba(255, 255, 255, 0.9), rgba(255, 255, 255, 0.9)), url(../svg_servizi/005-seo-consulting.svg) center center no-repeat;
      width: 100%;
      height: 80%;
      margin: auto; }
    #servizi #consulenza .modal-view {
      width: 50%;
      height: 90%;
      margin: 20px auto;
      background-color: #fff;
      overflow: scroll; }
      @media screen and (max-width: 640px) {
        #servizi #consulenza .modal-view {
          width: 80%; } }
      #servizi #consulenza .modal-view .header-modal {
        background-color: #111;
        margin-bottom: 20px; }
        #servizi #consulenza .modal-view .header-modal .ix {
          float: right;
          padding: 20px;
          cursor: pointer;
          color: #fff;
          font-family: "Lato", sans-serif;
          font-weight: 100;
          -webkit-transition: 2s;
          transition: 2s; }
          #servizi #consulenza .modal-view .header-modal .ix:hover {
            color: red;
            -webkit-transition: 2s;
            transition: 2s; }
        #servizi #consulenza .modal-view .header-modal .logo-servizi {
          width: 80px;
          float: left;
          padding: 5px 10px 0 5px;
          float: right;
          margin: 10px auto; }
          @media screen and (max-width: 840px) {
            #servizi #consulenza .modal-view .header-modal .logo-servizi {
              display: none; } }
        #servizi #consulenza .modal-view .header-modal h3 {
          padding: 20px;
          font-family: "Lato", sans-serif;
          color: #fff;
          font-weight: bold; }
      #servizi #consulenza .modal-view p {
        padding: 0 20px 0 20px;
        text-decoration: none;
        font-family: "Lato", sans-serif;
        font-size: 14px; }
  #servizi #corsi {
    background-color: rgba(0, 0, 0, 0.9);
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    display: none; }
    #servizi #corsi .bg-corsi {
      background: -webkit-gradient(linear, left top, left bottom, from(rgba(255, 255, 255, 0.9)), to(rgba(255, 255, 255, 0.9))), url(../svg_servizi/004-language.svg) center center no-repeat;
      background: linear-gradient(rgba(255, 255, 255, 0.9), rgba(255, 255, 255, 0.9)), url(../svg_servizi/004-language.svg) center center no-repeat;
      width: 100%;
      height: 80%;
      margin: auto; }
    #servizi #corsi .modal-view {
      width: 50%;
      height: 90%;
      margin: 20px auto;
      background-color: #fff;
      overflow: scroll; }
      @media screen and (max-width: 640px) {
        #servizi #corsi .modal-view {
          width: 80%; } }
      #servizi #corsi .modal-view .header-modal {
        background-color: #111;
        margin-bottom: 20px; }
        #servizi #corsi .modal-view .header-modal .ix {
          float: right;
          padding: 20px;
          cursor: pointer;
          color: #fff;
          font-family: "Lato", sans-serif;
          font-weight: 100;
          -webkit-transition: 2s;
          transition: 2s; }
          #servizi #corsi .modal-view .header-modal .ix:hover {
            color: red;
            -webkit-transition: 2s;
            transition: 2s; }
        #servizi #corsi .modal-view .header-modal .logo-servizi {
          width: 80px;
          float: left;
          padding: 5px 10px 0 5px;
          float: right;
          margin: 10px auto; }
          @media screen and (max-width: 840px) {
            #servizi #corsi .modal-view .header-modal .logo-servizi {
              display: none; } }
        #servizi #corsi .modal-view .header-modal h3 {
          padding: 20px;
          font-family: "Lato", sans-serif;
          color: #fff;
          font-weight: bold; }
      #servizi #corsi .modal-view p {
        padding: 0 20px 0 20px;
        text-decoration: none;
        font-family: "Lato", sans-serif;
        font-size: 14px; }
  #servizi #visite {
    background-color: rgba(0, 0, 0, 0.9);
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    display: none; }
    #servizi #visite .bg-visite {
      background: -webkit-gradient(linear, left top, left bottom, from(rgba(255, 255, 255, 0.9)), to(rgba(255, 255, 255, 0.9))), url(../svg_servizi/002-health-care.svg) center center no-repeat;
      background: linear-gradient(rgba(255, 255, 255, 0.9), rgba(255, 255, 255, 0.9)), url(../svg_servizi/002-health-care.svg) center center no-repeat;
      width: 100%;
      height: 80%;
      margin: auto; }
    #servizi #visite .modal-view {
      width: 50%;
      height: 90%;
      margin: 20px auto;
      background-color: #fff;
      overflow: scroll; }
      @media screen and (max-width: 640px) {
        #servizi #visite .modal-view {
          width: 80%; } }
      #servizi #visite .modal-view .header-modal {
        background-color: #111;
        margin-bottom: 20px; }
        #servizi #visite .modal-view .header-modal .ix {
          float: right;
          padding: 20px;
          cursor: pointer;
          color: #fff;
          font-family: "Lato", sans-serif;
          font-weight: 100;
          -webkit-transition: 2s;
          transition: 2s; }
          #servizi #visite .modal-view .header-modal .ix:hover {
            color: red;
            -webkit-transition: 2s;
            transition: 2s; }
        #servizi #visite .modal-view .header-modal .logo-servizi {
          width: 80px;
          float: left;
          padding: 5px 10px 0 5px;
          float: right;
          margin: 10px auto; }
          @media screen and (max-width: 840px) {
            #servizi #visite .modal-view .header-modal .logo-servizi {
              display: none; } }
        #servizi #visite .modal-view .header-modal h3 {
          padding: 20px;
          font-family: "Lato", sans-serif;
          color: #fff;
          font-weight: bold; }
      #servizi #visite .modal-view p {
        padding: 0 20px 0 20px;
        text-decoration: none;
        font-family: "Lato", sans-serif;
        font-size: 14px; }
  #servizi #appuntamenti {
    background-color: rgba(0, 0, 0, 0.9);
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    display: none; }
    #servizi #appuntamenti .bg-appuntamenti {
      background: -webkit-gradient(linear, left top, left bottom, from(rgba(255, 255, 255, 0.9)), to(rgba(255, 255, 255, 0.9))), url(../svg_servizi/003-calendar-page.svg) center center no-repeat;
      background: linear-gradient(rgba(255, 255, 255, 0.9), rgba(255, 255, 255, 0.9)), url(../svg_servizi/003-calendar-page.svg) center center no-repeat;
      width: 100%;
      height: 80%;
      margin: auto; }
    #servizi #appuntamenti .modal-view {
      width: 50%;
      height: 90%;
      margin: 20px auto;
      background-color: #fff;
      overflow: scroll; }
      @media screen and (max-width: 640px) {
        #servizi #appuntamenti .modal-view {
          width: 80%; } }
      #servizi #appuntamenti .modal-view .header-modal {
        background-color: #111;
        margin-bottom: 20px; }
        #servizi #appuntamenti .modal-view .header-modal .ix {
          float: right;
          padding: 20px;
          cursor: pointer;
          color: #fff;
          font-family: "Lato", sans-serif;
          font-weight: 100;
          -webkit-transition: 2s;
          transition: 2s; }
          #servizi #appuntamenti .modal-view .header-modal .ix:hover {
            color: red;
            -webkit-transition: 2s;
            transition: 2s; }
        #servizi #appuntamenti .modal-view .header-modal .logo-servizi {
          width: 80px;
          float: left;
          padding: 5px 10px 0 5px;
          float: right;
          margin: 10px auto; }
          @media screen and (max-width: 840px) {
            #servizi #appuntamenti .modal-view .header-modal .logo-servizi {
              display: none; } }
        #servizi #appuntamenti .modal-view .header-modal h3 {
          padding: 20px;
          font-family: "Lato", sans-serif;
          color: #fff;
          font-weight: bold; }
      #servizi #appuntamenti .modal-view p {
        padding: 0 20px 0 20px;
        text-decoration: none;
        font-family: "Lato", sans-serif;
        font-size: 14px; }
  #servizi #agenzia {
    background-color: rgba(0, 0, 0, 0.9);
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    display: none; }
    #servizi #agenzia .bg-agenzia {
      background: -webkit-gradient(linear, left top, left bottom, from(rgba(255, 255, 255, 0.9)), to(rgba(255, 255, 255, 0.9))), url(../svg_servizi/001-house.svg) center center no-repeat;
      background: linear-gradient(rgba(255, 255, 255, 0.9), rgba(255, 255, 255, 0.9)), url(../svg_servizi/001-house.svg) center center no-repeat;
      width: 100%;
      height: 80%;
      margin: auto; }
    #servizi #agenzia .modal-view {
      width: 50%;
      height: 90%;
      margin: 20px auto;
      background-color: #fff;
      overflow: scroll; }
      @media screen and (max-width: 640px) {
        #servizi #agenzia .modal-view {
          width: 80%; } }
      #servizi #agenzia .modal-view .header-modal {
        background-color: #111;
        margin-bottom: 20px; }
        #servizi #agenzia .modal-view .header-modal .ix {
          float: right;
          padding: 20px;
          cursor: pointer;
          color: #fff;
          font-family: "Lato", sans-serif;
          font-weight: 100;
          -webkit-transition: 2s;
          transition: 2s; }
          #servizi #agenzia .modal-view .header-modal .ix:hover {
            color: red;
            -webkit-transition: 2s;
            transition: 2s; }
        #servizi #agenzia .modal-view .header-modal .logo-servizi {
          width: 80px;
          float: left;
          padding: 5px 10px 0 5px;
          float: right;
          margin: 10px auto; }
          @media screen and (max-width: 840px) {
            #servizi #agenzia .modal-view .header-modal .logo-servizi {
              display: none; } }
        #servizi #agenzia .modal-view .header-modal h3 {
          padding: 20px;
          font-family: "Lato", sans-serif;
          color: #fff;
          font-weight: bold; }
      #servizi #agenzia .modal-view p {
        padding: 0 20px 0 20px;
        text-decoration: none;
        font-family: "Lato", sans-serif;
        font-size: 14px; }

#preventivo {
  height: 100%; }
  #preventivo h1 {
    text-align: left;
    padding-top: 50px;
    color: #494949;
    font-family: arial black, sans-serif;
    font-size: 24px;
    font-weight: bold; }
  #preventivo .preventivo::after {
    content: "";
    display: table;
    clear: both; }
  #preventivo .preventivo .box {
    width: 49%;
    display: inline-block;
    padding-bottom: 100px; }
    @media screen and (max-width: 940px) {
      #preventivo .preventivo .box {
        padding-bottom: 10px;
        width: 90%; } }
  #preventivo .preventivo .partners {
    text-align: center;
    float: right;
    display: inline-block;
    padding-top: 50px;
    padding-bottom: 100px; }
    @media screen and (max-width: 940px) {
      #preventivo .preventivo .partners {
        float: none; } }
    #preventivo .preventivo .partners .logos {
      display: inline-block;
      padding: 20px; }
      #preventivo .preventivo .partners .logos img {
        width: 100px;
        height: 40px; }
  #preventivo .contact-form {
    float: left;
    width: 400px;
    margin: 0 auto;
    text-align: center;
    padding-top: 50px;
    padding-bottom: 20px;
    padding-right: 10px;
    -webkit-border-radius: 0; }
    @media screen and (max-width: 440px) {
      #preventivo .contact-form {
        width: 100%;
        padding-top: 50px; } }
    @media screen and (max-width: 940px) {
      #preventivo .contact-form {
        float: none; } }
    #preventivo .contact-form input::-webkit-input-placeholder {
      color: #494949;
      opacity: 0.3;
      font-style: italic;
      font-size: 14px; }
    #preventivo .contact-form textarea::-webkit-input-placeholder {
      color: #494949;
      opacity: 0.3;
      font-style: italic;
      font-size: 14px; }
    #preventivo .contact-form input, #preventivo .contact-form textarea {
      border: none;
      -webkit-border-radius: 0;
      border-bottom: 1px solid #555;
      width: 100%;
      -webkit-box-sizing: border-box;
              box-sizing: border-box;
      height: 40px;
      padding: 5px 20px 5px 20px;
      font-size: 16px;
      font-family: arial, sans-serif;
      color: #494949; }
      #preventivo .contact-form input:focus, #preventivo .contact-form textarea:focus {
        outline: none;
        border-color: #21b5ff; }
    #preventivo .contact-form input {
      margin-bottom: 10px; }
    #preventivo .contact-form [type="submit"] {
      border: 1px solid #555;
      -webkit-border-radius: 0;
      color: #777;
      padding-bottom: 5px;
      cursor: pointer;
      background-color: #fff;
      -webkit-transition: 1s;
      transition: 1s; }
      #preventivo .contact-form [type="submit"]:hover {
        background-color: #efefef;
        -webkit-transition: 1s;
        transition: 1s; }
    #preventivo .contact-form textarea {
      margin-bottom: 10px;
      height: 150px;
      padding-top: 20px; }

#contattaci {
  background-color: #111; }
  #contattaci h1 {
    text-align: left;
    padding-top: 50px;
    color: #fff;
    font-family: arial black, sans-serif;
    font-size: 24px;
    font-weight: bold; }
  #contattaci hr {
    background-image: -webkit-gradient(linear, left top, right top, from(white), color-stop(rgba(255, 255, 255, 0.65)), to(rgba(255, 255, 255, 0)));
    background-image: linear-gradient(to right, white, rgba(255, 255, 255, 0.65), rgba(255, 255, 255, 0)); }
  #contattaci .contact {
    padding-top: 50px;
    padding-bottom: 50px;
    font-family: arial, sans-serif;
    color: #fff; }
    #contattaci .contact .mobile-icon {
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex; }
      #contattaci .contact .mobile-icon .mobile {
        width: 15px;
        height: 15px; }
        #contattaci .contact .mobile-icon .mobile path {
          fill: #fff; }
    #contattaci .contact .mail-icon {
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      padding-top: 15px; }
      #contattaci .contact .mail-icon .mail {
        width: 15px;
        height: 15px; }
        #contattaci .contact .mail-icon .mail path {
          fill: #fff; }
    #contattaci .contact .position-icon {
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      padding-top: 15px; }
      #contattaci .contact .position-icon .position {
        width: 15px;
        height: 15px; }
        #contattaci .contact .position-icon .position path {
          fill: #fff; }
    #contattaci .contact .box {
      width: 50px;
      text-align: center; }
    #contattaci .contact .text {
      margin-left: 10px;
      text-decoration: none;
      text-rendering: auto; }
  #contattaci #googleMap {
    background-color: #111;
    width: 100%;
    height: 300px;
    margin: 0 auto; }

footer {
  background: -webkit-gradient(linear, left top, left bottom, from(rgba(0, 0, 0, 0.7)), to(rgba(0, 0, 0, 0.7))), url(../immagini/bg_1.jpg) no-repeat;
  background: linear-gradient(rgba(0, 0, 0, 0.7), rgba(0, 0, 0, 0.7)), url(../immagini/bg_1.jpg) no-repeat;
  background-size: cover; }
  footer .logo_footer {
    padding-top: 50px;
    margin: 0 auto;
    width: 170px;
    height: 70px; }
  footer .navigation {
    padding-top: 20px;
    padding-bottom: 50px;
    text-align: center; }
    footer .navigation a {
      text-align: center;
      margin: 10px;
      text-decoration: none;
      text-transform: uppercase;
      color: #fff;
      font-size: 12px;
      font-family: arial, sans-serif; }
      footer .navigation a:hover {
        color: #aaa; }
  footer .copyright {
    text-align: center;
    text-transform: uppercase;
    padding-bottom: 20px;
    color: #fff;
    font-size: 12px;
    font-weight: 100;
    font-family: arial, sans-serif; }

* {
  margin: 0;
  padding: 0; }

hr {
  width: 250px;
  height: 1px;
  background-image: -webkit-gradient(linear, left top, right top, from(rgba(0, 0, 0, 0.65)), color-stop(rgba(0, 0, 0, 0.65)), to(transparent));
  background-image: linear-gradient(to right, rgba(0, 0, 0, 0.65), rgba(0, 0, 0, 0.65), transparent);
  border: none; }

.container {
  width: 70%;
  margin: 0 auto; }
  @media screen and (max-width: 640px) {
    .container {
      width: 95%; } }

footer .copyright a {
  text-decoration: none;
  color: #21b5ff;
  -webkit-transition: 1s;
  transition: 1s; }
  footer .copyright a:hover {
    color: aqua;
    -webkit-transition: 1s;
    transition: 1s; }

#pagina-prodotti {
  background-color: #efefef; }
  #pagina-prodotti::after {
    content: "";
    display: table;
    clear: both; }
  #pagina-prodotti .box {
    margin-top: 10px;
    margin-right: 5px;
    width: 30%;
    text-align: center;
    float: left;
    display: inline-block;
    background-color: #fff;
    padding: 10px;
    -webkit-transition: 1s;
    transition: 1s; }
    #pagina-prodotti .box:hover {
      -webkit-box-shadow: 0 2px 5px #000;
              box-shadow: 0 2px 5px #000;
      -webkit-transition: 2s;
      transition: 2s; }
    @media screen and (max-width: 1080px) {
      #pagina-prodotti .box {
        width: 45%; } }
    @media screen and (max-width: 740px) {
      #pagina-prodotti .box {
        display: block;
        margin-left: 0;
        width: 90%;
        text-align: center; } }
    #pagina-prodotti .box p {
      text-align: left;
      font-family: "Lato", sans-serif;
      font-size: 14px;
      padding-top: 5px;
      color: #333; }
  #pagina-prodotti .offerta {
    height: 100px;
    background-color: #fff; }
    #pagina-prodotti .offerta .dettagli-prodotto {
      color: #555;
      text-align: left;
      font-size: 12px;
      font-family: "Lato", sans-serif;
      cursor: default; }
    #pagina-prodotti .offerta .prezzo-prodotto {
      font-weight: bold;
      font-style: italic;
      cursor: pointer;
      color: #333;
      -webkit-transition: 1s;
      transition: 1s; }
    #pagina-prodotti .offerta .pic-offerte {
      float: left;
      padding: 5px;
      margin-right: 5px;
      background-size: cover; }
  #pagina-prodotti #left-header {
    clear: both;
    position: fixed;
    overflow-y: scroll;
    width: 320px;
    height: 100%;
    background-color: #111;
    text-align: right; }
    #pagina-prodotti #left-header a {
      text-decoration: none; }
    #pagina-prodotti #left-header .logo {
      width: 285px;
      padding: 20px; }
    #pagina-prodotti #left-header h1 {
      font-family: "Lato", sans-serif;
      text-align: right;
      padding-right: 20px;
      font-weight: 100;
      color: #fff;
      padding-bottom: 30px; }
    #pagina-prodotti #left-header .Submenu_centrale {
      display: inline-block;
      z-index: 100; }
      #pagina-prodotti #left-header .Submenu_centrale nav ul li {
        list-style: none; }
        #pagina-prodotti #left-header .Submenu_centrale nav ul li a {
          padding-right: 20px;
          color: #fff;
          font-family: "Lato", sans-serif;
          text-decoration: none;
          font-size: 14px;
          margin-top: 20px;
          font-weight: 100;
          -webkit-transition: 1s;
          transition: 1s; }
          #pagina-prodotti #left-header .Submenu_centrale nav ul li a:hover {
            -webkit-transition: 1s;
            transition: 1s;
            color: #21b5ff; }
    #pagina-prodotti #left-header .menuitem {
      display: none; }
  #pagina-prodotti #right-header {
    margin-left: 340px; }
  @media screen and (max-width: 960px) {
    #pagina-prodotti h1 {
      padding-top: 30px;
      font-size: 14px; }
    #pagina-prodotti #left-header {
      overflow-y: auto;
      position: fixed;
      top: 0;
      width: 100%;
      height: 100px;
      display: inline-block; }
      #pagina-prodotti #left-header .Submenu_centrale {
        display: none; }
      #pagina-prodotti #left-header .mobile-prodotti {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex; }
        #pagina-prodotti #left-header .mobile-prodotti .toggleslow {
          margin-left: auto;
          text-align: right; }
        #pagina-prodotti #left-header .mobile-prodotti .logo {
          width: 120px; }
        #pagina-prodotti #left-header .mobile-prodotti .menuitem {
          padding-right: 20px;
          text-align: right; }
    #pagina-prodotti #right-header {
      margin-left: 10px;
      margin-top: 100px; } }

#footer-prd {
  margin-left: 320px; }
  @media screen and (max-width: 960px) {
    #footer-prd {
      margin-left: 0; } }

.show-products .cat-prodotti-cat {
  float: left;
  width: 100%;
  display: block; }
  .show-products .cat-prodotti-cat .cat-prodotti-testo {
    padding: 20px 0 5px 0;
    font-family: "Lato", sans-serif;
    font-size: 18px;
    color: #333;
    font-weight: bold; }

.leggidipiu {
  text-decoration: none;
  font-weight: bold;
  font-style: italic;
  cursor: pointer;
  -webkit-transition: 1s;
  transition: 1s; }
  .leggidipiu a {
    text-decoration: none;
    color: #21b5ff; }
    .leggidipiu a:hover {
      color: #777;
      -webkit-transition: 1s;
      transition: 1s; }

#slideshow .menuitem {
  display: none; }

#slideshow h1 {
  display: none; }

@media screen and (max-width: 960px) {
  #slideshow h1 {
    display: block;
    font-family: "Lato", sans-serif;
    font-weight: 100;
    color: #fff;
    padding-left: 20px;
    padding-bottom: 10px;
    position: fixed;
    top: 20px;
    right: 20px;
    z-index: 101; }
  #slideshow .menuitem {
    display: block; } }

.Submenu {
  background-color: #fff;
  text-align: center;
  position: fixed;
  top: 0;
  right: 0;
  width: 100%;
  height: 100%;
  -webkit-transform: translateY(-100%);
  transform: translateY(-100%);
  -webkit-transition: -webkit-transform 0.6s ease;
  transition: -webkit-transform 0.6s ease;
  transition: transform 0.6s ease;
  transition: transform 0.6s ease, -webkit-transform 0.6s ease;
  z-index: 101; }
  .Submenu nav {
    padding-bottom: 20px; }
    .Submenu nav ul {
      margin: 0;
      padding: 0;
      padding-top: 40px; }
      .Submenu nav ul li {
        list-style: none; }
        .Submenu nav ul li a {
          color: #333;
          font-family: "Lato", sans-serif, sans-serif;
          text-decoration: none;
          font-size: 14px;
          font-weight: 100;
          -webkit-transition: 1s;
          transition: 1s; }
          .Submenu nav ul li a:hover {
            -webkit-transition: 1s;
            transition: 1s;
            color: #21b5ff; }

.open {
  -webkit-transform: translateY(0);
          transform: translateY(0); }

.menuitem {
  display: block;
  color: #21b5ff;
  font-family: "Lato", sans-serif;
  font-size: 16px;
  font-weight: bold;
  text-transform: uppercase;
  position: fixed;
  top: 50px;
  right: 20px;
  z-index: 101;
  cursor: pointer; }

.all {
  background-color: #efefef; }

#product-showroom {
  width: 100%; }
  #product-showroom hr {
    width: 100%;
    background: #efefef; }
  #product-showroom::after {
    content: ' ';
    display: table;
    clear: both; }
  #product-showroom .product-left {
    float: left;
    width: 56%;
    margin: 2%;
    background-color: #fff; }
    #product-showroom .product-left h1, #product-showroom .product-left p, #product-showroom .product-left img {
      padding: 20px; }
    #product-showroom .product-left h1 {
      font-family: "Lato", sans-serif;
      font-size: 18px;
      color: #444; }
    #product-showroom .product-left p {
      font-family: "Lato", sans-serif;
      font-size: 14px;
      color: #444; }
    #product-showroom .product-left img {
      max-width: 420px;
      height: auto; }
    @media (max-width: 770px) {
      #product-showroom .product-left {
        float: none;
        width: 96%; } }
    @media (max-width: 420px) {
      #product-showroom .product-left img {
        width: 80%;
        height: auto; } }
  #product-showroom .product-right {
    float: right;
    width: 38%;
    margin: 2% 2% 2% 0%;
    background-color: #fff; }
    #product-showroom .product-right::after {
      content: ' ';
      display: table;
      clear: both; }
    #product-showroom .product-right h2 {
      font-size: 14px;
      font-family: "Lato", sans-serif;
      color: #444;
      padding: 20px; }
    #product-showroom .product-right .facebook {
      padding: 20px; }
    #product-showroom .product-right .altri-prodotti {
      padding: 20px; }
    #product-showroom .product-right .box-altri {
      float: left;
      margin: 0 auto;
      width: 50%;
      height: 200px; }
      #product-showroom .product-right .box-altri .offerta-altri {
        text-align: center; }
    @media (max-width: 770px) {
      #product-showroom .product-right {
        float: none;
        width: 96%;
        margin: 2%; } }

#header-product {
  background: -webkit-gradient(linear, left top, left bottom, from(rgba(0, 0, 0, 0.7)), to(rgba(0, 0, 0, 0.7))), url(../immagini/bg_1.jpg) no-repeat;
  background: linear-gradient(rgba(0, 0, 0, 0.7), rgba(0, 0, 0, 0.7)), url(../immagini/bg_1.jpg) no-repeat;
  background-size: cover; }
  #header-product .navigation {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    padding: 20px; }
    #header-product .navigation .brand {
      margin-right: auto;
      width: 150px; }
    #header-product .navigation .nav {
      padding-top: 25px; }
      #header-product .navigation .nav a {
        text-decoration: none;
        font-size: 14px;
        color: #fff;
        font-size: 14px;
        font-family: arial, sans-serif;
        -webkit-transition: 1s;
        transition: 1s;
        margin-right: 20px; }
        #header-product .navigation .nav a:hover {
          color: #aaa;
          -webkit-transition: 1s;
          transition: 1s; }

#parallax {
  background: -webkit-gradient(linear, left top, left bottom, from(rgba(0, 0, 0, 0.7)), to(rgba(0, 0, 0, 0.7))), url(../immagini/bg_1.jpg) center center no-repeat;
  background: linear-gradient(rgba(0, 0, 0, 0.7), rgba(0, 0, 0, 0.7)), url(../immagini/bg_1.jpg) center center no-repeat;
  background-size: cover;
  background-attachment: fixed;
  height: 100vh; }
  @media screen and (max-width: 840px) {
    #parallax {
      background-attachment: scroll; } }
  @media screen and (max-width: 640px) {
    #parallax {
      background-attachment: scroll; } }

.success-page {
  margin: auto;
  width: 450px; }
  .success-page .logo {
    width: 450px;
    -webkit-backface-visibility: hidden; }
  .success-page .text {
    font-family: "Lato", sans-serif;
    padding: 20px;
    border: 3px solid green;
    text-align: center;
    font-size: 14px;
    margin-top: 30px; }
  .success-page a {
    margin-top: 20px;
    font-size: 14px;
    text-align: center;
    font-family: "Lato", sans-serif;
    text-decoration: none;
    text-transform: uppercase;
    color: green; }
    .success-page a:hover {
      color: #333; }
  @media screen and (max-width: 560px) {
    .success-page {
      width: 310px; }
      .success-page .logo {
        width: 310px; } }

.social-media {
  padding-top: 20px;
  width: 150px;
  text-align: center;
  margin: auto; }
  .social-media::after {
    content: "";
    display: table;
    clear: both; }
  .social-media .box-media {
    float: left;
    padding: 10px; }
    .social-media .box-media a path {
      fill: #fff;
      -webkit-transition: 1s;
      transition: 1s; }
    .social-media .box-media a polygon {
      fill: #fff;
      -webkit-transition: 1s;
      transition: 1s; }
    .social-media .box-media a:hover path {
      fill: #21b5ff;
      -webkit-transition: 1s;
      transition: 1s; }
    .social-media .box-media a:hover polygon {
      fill: #21b5ff;
      -webkit-transition: 1s;
      transition: 1s; }