.hp div::before,
  .hp div::after,
  .hp span::before,
  .hp span::after,
  .hp label::before,
  .hp label::after,
  .hp a::before,
  .hp a::after,
  .hp h1,
  .hp h2,
  .hp h3,
  .hp h4,
  .hp h5,
  .hp a,
  .hp img,
  .hp iframe.youtube,
  .hp ul,
  .hp ol,
  .hp li,
  .hp label,
  .hp button,
  .hp input,
  .hp select,
  .hp textarea,
  .hp input:focus,
  .hp input[type=text],
  .hp h6,
  .hp h1 strong,
  .hp h2 strong,
  .hp h3 strong,
  .hp dd,
  .hp dl,
  .hp fieldset,
  .hp a:hover,
  .hp a:active,
  .hp input[type=search],
  .hp input[type=email],
  .hp input[type=number],
  .hp input[type=password],
  .hp input[type=text].invalid,
  .hp input[type=search].invalid,
  .hp input[type=email].invalid,
  .hp input[type=number].invalid,
  .hp input[type=password].invalid,
  .hp select.invalid,
  .hp textarea.invalid,
  .hp input[type=radio],
  .hp input[type=checkbox],
  .hp {
      font-weight: initial;
      letter-spacing: initial;
      font-size: initial;
      list-style: initial;
      font-family: initial;
      cursor: initial;
      color: initial;
      line-height: initial;
      margin-block-start: initial;
      margin-block-end: initial;
      text-decoration: initial;
      outline: initial;
      max-width: initial;
      max-height: initial;
      padding: initial;
      margin-bottom: initial;
      border: initial;
      border-color: initial;
      margin: initial;
      vertical-align: initial;
      box-sizing: initial;
      transition: initial;
      border-radius: initial;
      background: initial;
      appearance: initial;
      margin-right: initial;
      vertical-align: initial;
      content: initial
  }

  .hp div::before,
  .hp div::after,
  .hp span::before,
  .hp span::after,
  .hp label::before,
  .hp label::after,
  .hp a::before,
  .hp a::after,
  .hp h1,
  .hp h2,
  .hp h3,
  .hp h4,
  .hp h5,
  .hp a,
  .hp img,
  .hp iframe.youtube,
  .hp ul,
  .hp ol,
  .hp li,
  .hp label,
  .hp button,
  .hp input,
  .hp select,
  .hp textarea,
  .hp input:focus,
  .hp input[type=text],
  .hp h6,
  .hp h1 strong,
  .hp h2 strong,
  .hp h3 strong,
  .hp dd,
  .hp dl,
  .hp fieldset,
  .hp a:hover,
  .hp a:active,
  .hp input[type=search],
  .hp input[type=email],
  .hp input[type=number],
  .hp input[type=password],
  .hp input[type=text].invalid,
  .hp input[type=search].invalid,
  .hp input[type=email].invalid,
  .hp input[type=number].invalid,
  .hp input[type=password].invalid,
  .hp select.invalid,
  .hp textarea.invalid,
  .hp input[type=radio],
  .hp input[type=checkbox] {
      font-weight: inherit;
      letter-spacing: inherit;
      font-size: inherit;
      list-style: inherit;
      font-family: inherit;
      cursor: inherit;
      color: inherit;
      line-height: inherit
  }

  .hp * {
      box-sizing: border-box;
      margin: 0;
      padding: 0
  }

 

  @font-face {
      font-family: 'FormaRegular';
      src: url(../fonts/FormaDJRDisplay-Regular.woff);
      font-display: swap
  }

  @font-face {
      font-family: 'FormaMicro';
      src: url(../fonts/FormaDJRMicro-Regular.woff);
      font-display: swap
  }

  .hp .hp-btn {
    font-family: 'FormaRegular', 'Arial', 'sans-serif';
    background-color: #000;
    color: #fff;
    padding: 5px 20px;
    font-size: 20px;
    border: 1px solid #000;
    cursor: pointer;
    transition: all 0.3s ease-in-out;
    margin-left: 14px;
  } 

  .hp .hp-btn:hover {
    font-family: 'FormaRegular', 'Arial', 'sans-serif';
    margin-left: 14px;

    padding: 5px 20px;
    font-size: 20px;
    cursor: pointer;
    background-color: #fff;
    color: #000;
    border: 1px solid #000;
  }

  .hp .HP-body {
      font-family: 'FormaMicro', 'Arial', 'sans-serif';
      background-color: #e6e6e6
  }

  .hp .wrapper {
      margin: 0 auto;
      width: 100%;
      max-width: 1500px
  }

  .hp .line {
    height: 1px;
    border: 0;
    border-top: 1px solid #000;
    padding: 0;
  }

  .hp .main_title {
      font-family: 'FormaRegular', 'Arial', 'sans-serif';
      padding: 30px 0;
      background-color: #0197d6;

      h1 {
          margin-left: 30px;
          font-size: 90px;
      }
  }

  .hp .txt_index {
      font-size: 50px
  }

  .hp .second_title {
      font-family: 'FormaRegular', 'Arial', 'sans-serif';
      padding: 30px 0;
      background-color: #4cb5e2;

      h2 {
          font-size: 50px;
          margin-left: 30px;
          /* font-size: 30px; */
      }
  }

  .hp .main_add {
      background-color: #7fcaea
  }

  .hp .logo {
      padding: 30px 0;
      margin-left: 30px
  }

  .hp .picture_container {
      position: relative
  }

  .hp .picture_main {
      margin-bottom: -5px;
      width: 100%
  }

  .hp .picture_bottom {
      position: absolute;
      bottom: 80px;
      left: 30px
  }

  .hp .picture_bottom_txt {
      margin-left: 40px;
      padding: 10px;
      font-size: 20px
  }

  .hp .picture_bottom_bcg {
      position: absolute;
      bottom: 0;
      background-color: rgba(255, 255, 255, .4);
      width: 100%
  }

  .hp .picture_product_item,
      .hp .picture_product_item--left {
      width: 100%;
      }

  .hp .description {
      background-color: #cdeaf8
  }

  .hp .description_title {
      font-family: 'FormaRegular', 'Arial', 'sans-serif';
      padding: 20px;
      font-size: 70px;
      text-align: center;
      line-height: 1em;
  }

 

  .hp .description_txt {
      padding: 36px;
      font-size: 32px;
      text-align: center;
      line-height: 1em;
  }

  .hp .product {
      background-color: #e6e6e6;
      position: relative
  }

  .hp .flex {
      display: flex;
      flex-direction: row;
      align-items: center
  }

  .hp .product_description_right,
  .hp .product_description_right50 {
      text-align: left;
      border-right: 2px solid #000;
      align-self: center
  }

  .hp .product_description_right50,
  .hp .product_description--left50 {
         flex-basis: 50%;
      border: none !important
  }

  .hp .product_description--left,
  .hp .product_description--left50 {
       flex-basis: 50%;
      border-left: 2px solid #000;
      background-color: #e6e6e6;
      align-self: center
  }

  .hp .product_slogan {
      font-family: 'FormaRegular', 'Arial', 'sans-serif';
      font-size: 70px;
      padding: 30px 0 30px 30px;
      border-bottom: 1px solid #000;
      line-height: 1em;
  }

  .hp .product_name {
      padding: 30px 0 20px 30px;
      font-size: 36px
  }

  .hp .product_txt {
      padding: 20px 30px 30px 30px;
      font-size: 30px
  }

  .hp .product_feature {
      font-size: 24px;
      padding: 10px 100px 0 30px
  }

  .hp .product_feature::after {
      content: '';
      display: inline-block;
      width: 100%;
      border-bottom: 1px solid #000
  }

  .hp .product_feature:last-child {
      margin-bottom: 30px
  }

  .hp .reverse {
      flex-direction: row-reverse
  }

  .hp .product_slogan--left {
      font-family: 'FormaRegular', 'Arial', 'sans-serif';
      font-size: 70px;
      padding: 30px;
      border-bottom: 1px solid #000;
      line-height: 1em;
  }

  .hp .product_name--left {
      padding: 30px 30px 0 30px;
      font-size: 30px
  }

  .hp .product_txt--left {
      padding: 20px 30px 30px 30px;
      font-size: 30px
  }

  .hp .product_list {
    padding: 0 30px;
    font-size: 30px;
    text-align: left;
}
.hp .product_list--left {
    padding: 30px 30px 0 30px;
}

  .hp .product_list li {
    list-style-type: square;
    padding: 5px 0;
    margin: 0;
    margin-left: 20px;
  }

  .hp .product_list li::marker {
    
    font-size: 12px;
  
  }

  .hp .product_feature--left {
      font-size: 24px;
      padding: 10px 80px 10px 30px;
  }

  .hp .product_feature--left::after {
      content: '';
      display: inline-block;
      width: 100%;
      border-bottom: 1px solid #000
  }

  .hp .product_feature--left:last-child {
      margin-bottom: 30px
  }

  .hp .picture_product {
      display: flex;
      position: relative;
      align-items: center;
      justify-content: center;
      flex-basis: 50%;
  }

  .hp .picture_product2 {
    display: flex;
    position: relative;
    align-items: center;
    justify-content: center;
}

  .hp .picture_product_addons {
      position: absolute;
      left: 30px;
      bottom: calc(1*16px)
  }

  .hp .product>.wrapper {
      align-items: stretch
  }

  .hp .margin_reset {
      margin: 0
  }

  .hp .picture_product_logo {
      margin-bottom: 30px
  }

  .hp .picture_product_txt {
      font-size: 19.5px;
      padding-bottom: 10px;
  }

  .hp .picture_product--line {
      border-left: 2px solid #000
  }

  .hp .didascalia {
      font-family: 'FormaRegular', 'Arial', 'sans-serif';
      font-size: 12px;
      padding: 90px 40px;
      box-sizing: border-box
  }

  .hp li {
      padding: 0 15px;
      margin: 20px;
      list-style: decimal
  }

  .hp .product_feature:last-child::after {
      border-bottom: none
  }

  .hp .product_feature--left:last-child::after {
      border-bottom: none
  }

  .hp .hp-footer {
    font-family: 'FormaRegular', 'Arial', 'sans-serif';
    font-size: 12px;
    padding: 20px 0;
    background-color: #ffffff;
  }

  .hp .footer_list{
    padding: 0 20px;
  }


  @media(max-width:1100px) {
    .hp br {
      display: none;
    }
      .hp .HP-body {
          text-align: center
      }

      .hp .main_title {
          h1 {
              font-size: 50px;
          }
      }

      .hp .txt_index {
          font-size: 30px
      }

      .hp .second_title {
          padding: 30px 10px;

          h2 {
              font-size: 30px;
          }
      }

      .hp .logo {
          padding: 20px 0
      }

      .hp .picture_main {
          max-width: 100%;
          height: auto
      }

      .hp .picture_bottom {
          position: absolute;
          bottom: 60px;
          left: 0;
          z-index: 10
      }

      .hp .picture_bottom_txt {
          padding: 10px;
          font-size: 12px;
          margin-left: 0
      }

      .hp .picture_bottom_logo {
          width: 60%
      }

      .hp .description_title {
          padding: 30px 10px;
          font-size: 35px
      }

      .hp .description_txt {
          padding: 30px 10px;
          font-size: 22px
      }

      .hp .flex {
          flex-direction: column
      }

      .hp .product_description_right,
      .hp .product_description_right50 {
          text-align: center;
          border-right: none
      }

      .hp .product_description--left,
      .hp .product_description--left50 {
          border-left: none
      }

      .hp .product_description_right50,
      .hp .product_description--left50 {
          width: 100%
      }

      .hp .product_slogan,
      .hp .product_slogan--left {
          font-size: 35px
      }

      .hp .product_name,
      .hp .product_name--left {
          padding: 30px 0 0
      }

      .hp .product_txt,
      .hp .product_txt--left {
          padding: 20px 15px;
          font-size: 20px
      }

      .hp .product_list {
        /* padding: 0 30px; */
        font-size: 20px;
    }

      .hp .product_feature,
      .hp .product_feature--left {
          font-size: 18px;
          margin-bottom: 15px;
          padding: 0 30px
      }

      .hp .product_feature:last-child,
      .hp .product_feature--left:last-child {
          margin-bottom: 10px
      }

      .hp .reverse {
          flex-direction: column
      }

      .hp .picture_product,
      .hp .picture_product2 {
          display: flex;
          flex-direction: column;
          align-items: center;
          justify-content: center;
          overflow: hidden;
      }

      .hp .picture_product_addons {
          position: relative;
          left: 0;
          bottom: calc(1*16px);
          margin: 30px
      }

      .hp .product>.wrapper {
          align-items: stretch
      }

      .hp .picture_product_item,
      .hp .picture_product_item--left {
          max-width: 100%;
          height: auto;
          margin-left: 0
      }

      .hp .didascalia {
          font-size: 15px;
          padding: 35px 20px;
          text-align: left
      }

      .hp li {
          padding: 0 10px;
          margin: 20px;
          list-style: decimal
      }
      .hp .hp-btn {
        margin-left: 0;
        display: block;
        margin-top: 20px;
      }

      .hp .hp-btn:hover {
        margin-left: 0;
        margin-top: 20px;
      }
  }

  @media(min-width:800px)and (max-width:1100px) {
    
      .hp .picture_bottom {
          bottom: 40px
      }

      .hp .picture_bottom_txt {
          font-size: 15px
      }

      .hp .picture_bottom_logo {
          width: 80%
      }

      .hp .picture_product_item,
      .hp .picture_product_item--left {
          padding: 0 50px
      }

      .hp .product_txt--left {
          padding: 45px 40px
      }

      .hp .product_feature,
      .hp .product_feature--left {
          padding: 0 100px
      }

      .hp .product_feature:last-child,
      .hp .product_feature--left:last-child {
          margin-bottom: 10px
      }
  }

  @media(min-width:1101px)and (max-width:1600px) {
    .hp br {
      display: block;
    }
      .hp .main_title {
          h1 {
              margin-left: 30px;
              font-size: 50px;
          }
      }

      .hp .txt_index {
          font-size: 30px
      }

      .hp .second_title {
          padding: 30px 10px;

          h2 {
              margin-left: 30px;
              font-size: 30px;
          }
      }

      .hp .logo {
          margin-left: 30px;
          padding: 20px 0
      }

      .hp .picture_main {
          max-width: 100%;
          height: auto
      }

      .hp .description_title {
          padding: 30px 10px;
          font-size: 35px
      }

      .hp .description_txt {
          padding: 30px 10px;
          font-size: 22px
      }

      .hp .product_description_right,
      .hp .product_description--left {
          max-width: 30%
      }

      .hp .product_description_right50,
      .hp .product_description--left50 {
          max-width: 50%;
          width: 100%
      }

      .hp .product_slogan,
      .hp .product_slogan--left {
          font-size: 40px;
          padding: 30px
      }

      .hp .product_name,
      .hp .product_name--left {
          padding: 30px 30px 0 30px
      }

      .hp .product_txt,
      .hp .product_txt--left {
          padding: 20px 30px 30px 30px;
          font-size: 20px
      }

      .hp .product_list {
        /* padding: 0 30px; */
        font-size: 20px
    }

      .hp .product_feature,
      .hp .product_feature--left {
          font-size: 20px;
          padding: 10px 30px
      }

      .hp .product_feature:last-child,
      .hp .product_feature--left:last-child {
          margin-bottom: 10px
      }

      .hp .picture_product {
          text-align: center
      }

      .hp .picture_product_addons {
          text-align: left
      }

      .hp .picture_product_item,
      .hp .picture_product_item--left {
        max-width: 100%;
        height: auto;
        text-align: center;
        object-fit: none;
        object-position: right;
      }

      .hp .picture_product_item2, .hp .picture_product_item2--left {
        max-width: 80%;
        height: auto;
        text-align: center;
    }

      .hp .didascalia {
          font-size: 15px;
          padding: 30px
      }
     
  }

  @media only screen and (max-width:720px) {
      .hp .wrapper {
          max-width: fit-content
      }

      .hp .main_title h1 {
          margin-left: 0
      }

      .hp .second_title h2 {
          margin-left: 0
      }

      .hp .logo {
          margin-left: 0
      }

      .hp .product_slogan {
          padding: 30px 0
      }

      .hp .picture_product_item--left {
          margin-right: 0
      }

      

  }

  body {
      width: 100%;
      margin: 0;
      padding: 0;
  }