@keyframes fadeIn {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

html .RichContent {
    font-size: 16px;
    font-family: 'Source Sans 3', 'Montserrat', sans-serif; }
  
  body .RichContent {
    padding: 0;
    margin: 0;
  }
  
    .productcard {
      margin: 50px 50px;
      padding: 10px 0 10px;
      max-width: 1100px;
      overflow: hidden; }
    @media (max-width: 576px) {
      .productcard {
          padding: 10px 0; } }
    /* .productcard * {
      box-sizing: border-box; } */
    
    @keyframes fadeIn {
      0% {
          opacity: 0; }
      100% {
          opacity: 1; } }
    @font-face {
      font-family: 'Siemens Sans';
      src: url("./fonts/SiemensSans-Roman.woff2") format("woff2"), url("./fonts/SiemensSans-Roman.woff") format("woff"), url("./fonts/SiemensSans-Roman.ttf") format("truetype");
      font-weight: normal;
      font-style: normal;
      font-display: swap; }
    @font-face {
      font-family: 'Siemens Sans';
      src: url("./fonts/SiemensSans-Black.woff2") format("woff2"), url("./fonts/SiemensSans-Black.woff") format("woff"), url("./fonts/SiemensSans-Black.ttf") format("truetype");
      font-weight: 900;
      font-style: normal;
      font-display: swap; }

      p{
        margin: 0;
        padding: 0;
      }

  

      /* <!-- -- -- -- VIDEO -- -- -- --> */
      .header__logo {
  position: absolute;
  padding-top: 35px;
  padding-left: 45px;
  top: 60px;
  left: 40px;
  height: 30px;
  width: auto;
  z-index: 5;
}
@media (max-width: 576px){
  .header__logo {

    padding-top: 35px;
    padding-left: 45px;
    width: 0px;
    height: 0px;
    
  }
}
      .video {
    padding: 50px 57px;
    position: relative;
}

@media (max-width: 576px) {
    .video {
        padding: 40px 24px;

    }
}

.video__bg {
    position: relative;
    z-index: 3;
    width: 100%;
    height: 320px;
    padding-left: 22%;
    object-fit: cover;
}

@media (max-width: 576px) {
    .video__bg {
        height: auto;
        margin-bottom: 30px;
        float: right;
    }
}

      .video__mask {
        position: absolute;
        z-index: -1;
        left: 0;
        top: 0;
        width: 100%;
        height: 100%;
        background:  #000028 ;
        opacity: 1;
        transform: rotate(deg);}
            @media (max-width: 576px) {
            .video__mask {
              height: 0%;  
                } }

      .video__info {
        position: absolute;
        z-index: 5;
        bottom: 95px;
        left: 110px; 
        width: 500px;}
        @media (max-width: 576px) {
            .video__info {
                    position: static;
                    width: 500px;
                    } }

      .video__info-title {
        font-family: 'Source Sans 3';
        font-style: normal;
        font-weight: 600;
        font-size: 33px;
        color: #fff;
        position: relative;
       /* padding-left: 25px;*/
        margin-bottom: 20px;
        max-width: 100%; }
            @media (max-width: 576px) {
            .video__info-title {
              font-style: normal;
              font-weight: 600;
              font-size: 25px;
              line-height: 120%;
              color:#000;
              max-width: 65%; } }
       /*.video__info-title:before {
        content: "";
        position: absolute;
        left: 0;
        top: 0;
        width: 5px;
        height: 100%;
        background: linear-gradient(to bottom, #00FEBA, #00E7DB); }*/
      .video__info-text {
        font-family: 'Source Sans 3';
        font-style: normal;
        font-weight: 600;
        font-size: 20px;
        line-height: 120%;
        color: #fff;
        margin: 0;
        max-width: 90%; }
      @media (max-width: 576px) {
        .video__info-text {
        font-family: 'Source Sans 3'; 
        font-style: normal;
        font-weight: 600;
        font-size: 18px;
        line-height: 120%;
        color:#000; 
      width:80%;} }

      /* <!-- -- -- -- ABOUT -- -- -- --> */

      .about {
        padding: 50px 57px;
        max-width: 100%;
        margin: 0 auto; }
            @media (max-width: 576px) {
                .about {
                  padding: 30px 24px; } }
       .about__text {
        font-family: 'Source Sans 3';
        font-style: normal;
        font-weight: 600;
        line-height: 120%;
        color: #000000;
        letter-spacing: 0.2px;

        text-align: center;
        font-size: 36px;
        margin: 0 auto 50px;
        width: 100%; }
            @media (max-width: 576px) {
                .about__text {
                  font-family: 'Source Sans 3';
                  font-style: normal;
                  font-weight: 600;
                  font-size: 22px;
                  line-height: 120%;
                  margin-bottom:30px;} }

       .about__row {
        display: flex;
        align-items: center;
        justify-content: space-between; }
            @media (max-width: 576px) {
                .about__row {
                    flex-direction: column; } }

       .about__video {
        width: 60%; }
            @media (max-width: 576px) {
                .about__video {
                    width: 100%;
                  margin-bottom:30px;} }

       .about__video img {
        display: block;
        width: 100%;
        height: auto; }
       .about__info {
        width: 40%; 
        padding-left:80px;}
            @media (max-width: 576px) {
                .about__info {
                    width: 100%;
                    margin-top: 10px; 
                    padding-left:0px;} }
       .about__info-title {
        font-size: 28px;
        font-weight: bold;
        line-height: 120%;
        color: #000;
        position: relative;
        padding-left: 23px;
        margin-bottom: 40px; }
            @media (max-width: 576px) {
                .about__info-title {
                    font-size: 18px; } }
       .about__info-title:before {
        content: "";
        position: absolute;
        left: 0;
        top: 0;
        width: 5px;
        height: 100%;
        background: linear-gradient(to bottom, #00FEBA, #00E7DB); }
       .about__info-text {
        font-family: 'Source Sans 3';
        font-style: normal;
        font-weight: 400;
        font-size: 17px;
        line-height: 120%;
        color: #000;
        margin: 0; }
            @media (max-width: 576px) {
                .about__info-text {
                    font-size: 15px; } }

/* <!-- -- -- -- HOTSPOT -- -- -- --> */



.features {
    padding: 50px 57px; }
    @media (Max-width: 576px){
      .features {
        padding: 30px 24px; }
    }
.features__image {
    /* position: absolute; */
    right: 0;
    /* width: 200px; */
    height: auto;
    z-index: 2;
    border-image: linear-gradient(to bottom, #00FFB9, #00E6DC) 1;
    border-left: 8px solid;
    background-color: #fff;
    width: 50%;
    position: relative;
    margin-right:50px; }

    .features__image img {   
    display: block;
    z-index: 2;
    width: 100%;
    height: auto;}
@media (max-width: 576px) {
  .features__image {
    width: 60%; } }  
@media (max-width: 768px) {
  .features__image {
    width: 80%; } }  
@media (max-width: 481px) {
  .features__image {
    width: 100%; } } 
@media (max-width: 320px) {
  .features__image {
    width: 100%; } }  


   .features__wrapper {
    max-width: 100%;
    margin: 0 auto;
    position: relative;
    z-index: 3;
    display: flex;
    /* align-items: center; */
    justify-content: space-between;
    flex-direction: row-reverse; }


  @media (max-width: 576px) {
     .features__wrapper {
        padding: 0 10px;
        flex-direction: column; } }


   .features__accordions {
    width: 50%;
    padding-left: 50px;
    padding-top:80px }
  @media (max-width: 576px) {
     .features__accordions {
        width: 100%; 
        padding:0;} }
   .features__accordion {
    display: flex;
    margin-bottom: 40px;
    cursor: pointer; }
  @media (max-width: 576px) {
     .features__accordion {
        margin-bottom: 15px; } }
  
.features__accordion-title {
          font-size: 20px;
          font-weight: 600;
          line-height: 120%;
          color: #000;
          margin: 0 0 10px;}
  
  
  .accordion > input[type="checkbox"] {
    position: absolute;
    left: -100vw;
  }
  
  .accordion .content {
    max-height: 0;
    overflow: hidden;
    font-size: 17px;
    font-weight: normal;
    line-height: 120%;
    color: #000;
    margin: 0;
    transition: 0.25s ease-in-out;
    padding-left:15px;  
  }
  
  .accordion > input[type="checkbox"]:checked ~ .content {
    height: auto;
    overflow: visible;
    max-height: 50vh;
    padding: 15px;
  }
  @media(max-width:576px){
    .accordion > input[type="checkbox"]:checked ~ .content {
      padding: 20px 15px;
    }
  }
  
  .accordion label {
    display: block;
  }
  
  
  .accordion {
    margin-bottom: 20px;
  }
  
  
  .accordion .handle {
    margin: 0;
    font-size: 1.125em;
    line-height: 120%;
  }
  
  .accordion label {
    font-family: 'Source Sans 3';
    font-style: normal;
    font-weight: 600;
    font-size: 20px;
    line-height: 120%;
    cursor: pointer;
    color: #000;
    margin: 0 0 10px;
  }
  @media(max-width:576px){
    .accordion label {
      font-size: 16px;
    }
  }

  .accordion .handle label:before {
    content: "";
    display: inline-block;
    margin-right: 10px;
    vertical-align: middle;
    width: 0;
    height: 0;
    border-top: 13px solid transparent;
    border-left: 26px solid #009B9A;
    border-bottom: 13px solid transparent;
    position: absolute;
    margin-top:2px;
    transform-origin: center;
    transition: all 0.25s ease-in-out;
  }
  
  .accordion > input[type="checkbox"]:checked ~ .handle label:before {
    content: "";
    display: inline-block;
    margin-right: 10px;
    vertical-align: middle;
    width: 0;
    height: 0;
    border-top: 13px solid transparent;
    border-left: 25px solid #08FDB7;
    border-bottom: 13px solid transparent;
    transform-origin: center;
    transition: all 0.25s ease-in-out;
    transform: translateY(3px) rotate(90deg); }
  
  
 

  .accordion_text{
    margin-left:40px;
  }
  
  .accordion p:last-child {
    margin-bottom: 0;
  }
  
  
  
  .BornHS__Wrapper {
    position: relative;
    height: 600px;
    width: 600px;
    margin:auto;
  }
  
  .BornHS__Wrapper img{
    height:600px;
  }
  .hotspot-content-close {
    display: none;
  }
  .hotspot-content-wrapper {
    position: relative;
  }
  .hotspot-content {
    background: #009999;
    border-radius: 5px;
    box-shadow: 0 0 24px rgba(0, 0, 0, 0.22);
    color: #fff;
    opacity: 0;
    position: absolute;
    transition: all 0.3s ease-in-out;
    visibility: hidden;
    width: 360px;
    z-index: 4;
  }
  .hotspot-content-wrapper {
    padding: 20px;
  }
  .hotspot-content-title {
    font-size: 20px;
    text-transform: uppercase;
  }
  .hotspot-content-wrapper p {
    font-size: 13px;
    margin: 0;
    padding: 0;
  }
  .dot_hotspot_input {
    height: 0;
    opacity: 0;
    overflow: hidden;
    position: absolute;
    text-indent: -9999px;
    width: 0;
    z-index: -1;
  }
  
  .dot_hotspot {
      position: absolute;
      z-index: 2;
      width: 50px;
      height: 50px;
      font-size: 20px;;
      border: none;
      box-shadow: 0 0 0 0 rgba(255, 255, 255, 0.7);
      border-radius: 50%;
      /* vertical-align: middle; */
      background: #009999;
      cursor: pointer;
      -webkit-animation: pulse 1.5s infinite cubic-bezier(0.66, 0, 0, 1);
      -moz-animation: pulse 1.5s infinite cubic-bezier(0.66, 0, 0, 1);
      animation: pulse 1.5s infinite cubic-bezier(0.66, 0, 0, 1);
      text-align: center;
  }
  @-webkit-keyframes pulse {
    to {
      box-shadow: 0 0 0 25px rgba(255, 255, 255, 0);
    }
  }
  
  @keyframes pulse {
    to {
      box-shadow: 0 0 0 25px rgba(255, 255, 255, 0);
    }
  }
  
  
  @media (min-width: 768px) {
  .dot_hotspot {
      height: 50px;
      width: 50px;
   }
  }
  
  .dot_hotspot:before,.dot_hotspot:after  {
  
    background: #fff;
    content: "";
    cursor: pointer;
    display: block;
    left: 50%;
    position: absolute;
    top: 50%;
    transform: translate(-50%, -50%);
  }
  .dot_hotspot:before{
    height: 3px;
    width: 15px;
  }
  .dot_hotspot:after{
    height: 15px;
    width: 3px;
  }
  
  
  
  .dot_hotspot_input ~ .BornHS__Overlay {
    display: none;
    height: 100%;
    left: 0;
    position: absolute;
    width: 100%;
    top: 0;
    z-index: 3;
  }
  .dot_hotspot_input[type=checkbox]:checked + .dot_hotspot {
    transform: rotate(45deg);
  }
  .dot_hotspot_input:checked ~ .hotspot-content {
    opacity: 1;
    visibility: visible;
  }
  .dot_hotspot_input:checked ~ .BornHS__Overlay {
    display: block;
  }
  
  .dot_hotspot_input:checked ~ .accordion .content {
    height: auto;
    overflow: visible;
    max-height: 50vh;
    padding: 15px;
  }

.dot_hotspot_input[type=checkbox]:checked + label ~ .dot_hotspot {
  transform: rotate(45deg);
}

  
  
  
  
  .hotspots-container {
    bottom: 0;
    height: 100%;
    left: 0;
    position: absolute;
    top: 0;
    right: 0;
    width: 100%;
    z-index: 1;
  }
  @media (max-width: 768px) {
  .hotspot-content {
      bottom: auto !important;
      left: 50% !important;
      top: 50% !important;
      transform: translate(-50%, -50%) !important;
   }
  .hotspot-content .hotspot-content-close {
      background: #009B9A;
      border-radius: 50%;
      cursor: pointer;
      display: block;
      height: 20px;
      right: -5px;
      position: absolute;
      top: -5px;
      transition: all 300ms ease;
      transform: rotate(45deg);
      width: 20px;
      z-index: 5;
   }
  .hotspot-content-close:before, .hotspot-content-close:after {
      background: #fff;
      content:"";
      cursor: pointer;
      display: block;
      left: 50%;
      position: absolute;
      top: 50%;
      transform: translate(-50%, -50%);
   }
  .hotspot-content-close:before {
      height: 2px;
      width: 40%;
   }
  .hotspot-content-close:after {
      height: 40%;
      width: 2px;
   }
  }
  
  .img-fluid{
    max-width:1900px;
    height:auto;
    
  }

  /* <!-- -- -- -- TIMELINE -- -- -- --> */


.timeline {
    padding: 50px 0;
  } 
  @media(max-width:576px){
    .timeline{
    padding: 30px 24px;}
  }
  .timelina_wrapper{
    margin:auto;
    box-sizing: border-box;
    max-width: 90%;
  }
  @media(max-width:576px){
    .timelina_wrapper{
      max-width:100%;
      padding: 0 10px;
    }
  }
  
  .timeline__title {
    text-align: center;
    font-size: 36px;
    font-weight: bold;
    line-height: 120%;
    color: #000;
    margin: 0 0 70px; }
  
  .timeline__slide {
    align-items: center;
    justify-content: space-between;
    animation: fadeIn 0.25s ease-in-out forwards;
    display: flex;
    justify-content: space-between;
    grid-template-columns: 1fr 1fr ;
    grid-template-rows: 1fr;
    grid-template-areas: 
    "timeline__slide-image timeline__slide-text";
  max-width:1152px;
  margin:auto; }
  
  @media(max-width:576px){
    .timeline__slide{
      display:block;
    }
  
  }
  
    .timeline__slide-image {
      grid-area: timeline__slide-image;
      position: relative; 
        width:40%;
        margin-left: auto; 
        margin-right: 0;}
      @media(max-width:576px){
        .timeline__slide-image {
          width:100%;
        }
      }
    .timeline__slide-image img {
      display: block;
      position: relative;
      z-index: 2;
      width: 90%;
      height: auto;
      object-fit: contain;
      object-position: center;
      margin-left: auto;
      margin-right: 0; }
    
    .timeline__slide-text {
      grid-area: timeline__slide-text;
      font-size: 17px;
      font-weight: 400;
      line-height: 120%;
      color: #000; 
      padding-left:50px; 
      width: 40%;
      margin-left: 0;
      margin-right: auto;}
      @media (max-width:576px){
        .timeline__slide-text {
        width:100%;}
      }
  
    .timeline__info-title {
        font-size: 20px;
        font-weight: bold;
        line-height: 120%;
        color: #000;
        position: relative;
        padding-left: 23px;
        margin-bottom: 40px; }
        @media(max-width:576px){
          .timeline__info-title{
            font-family: 'Source Sans 3';
            font-style: normal;
            font-weight: 600;
            font-size: 20px;
            line-height: 120%;
          }
        }
            @media (max-width: 576px) {
                .about__info-title {
                    font-size: 26px; } }
       .timeline__info-title:before {
        content: "";
        position: absolute;
        left: 0;
        top: 0;
        width: 5px;
        height: 100%;
        background: linear-gradient(to bottom, #00FEBA, #00E7DB); }
       .timeline__info-text {
        font-family: 'Source Sans 3';
        font-style: normal;
        font-weight: 400;
        font-size: 17px;
        line-height: 120%;
        color: #000;
        margin: 0; }
            @media (max-width: 576px) {
                .about__info-text {
                  font-family: 'Source Sans 3';
                  font-style: normal;
                  font-weight: 400;
                  font-size: 19px;
                  line-height: 120%; } }
    
    ul.slides {
        display: block;
        position: relative;
        height: 470px;
        margin: 0;
        padding: 0;
        overflow: hidden;
        list-style: none;
    }
    @media(max-width:767px){
      ul.slides{
        height: 650px;
      } 
      .timeline__slide-text {
        margin-top:30px;
        padding: 0}
    }
  
    @media(max-width:360px){
      ul.slides{
        height: 680px;
      } 
    }
    
    .slides * {
        user-select: none;
        -ms-user-select: none;
        -moz-user-select: none;
        -khtml-user-select: none;
        -webkit-user-select: none;
        -webkit-touch-callout: none;
    }
    
    ul.slides input {
        display: none; 
    }
    
    
    .slide-container { 
        display: block; 
    }
    
    .slide-image {
        display: block;
        position: absolute;
        width: 100%;
        height: 100%;
        top: 0;
        opacity: 0;
        transition: all .7s ease-in-out;
    }   
  
  
  
  
    
  .carousel-dot {
        display: inline-block;
        width: 30px;
        height: 30px;
        border-radius: 50%;
        cursor: pointer;
   
    }
  
    @media(max-width: 576px){
    .box{
      width: 112%!Important;
      margin: 0 -6%;
    }
    .box-text{
      display:none;
    }
    }
    
    input:checked + .slide-container .slide-image {
        opacity: 1;
        transform: scale(1);
        transition: opacity 1s ease-in-out;
    }
    
    input:checked + .slide-container .carousel-controls label {
display: block;
    }
    input#img-1:checked ~ .dotscontainer .box label#img-dot-1,
    input#img-2:checked ~ .dotscontainer .box label#img-dot-2,
    input#img-3:checked ~ .dotscontainer .box label#img-dot-3,
    input#img-4:checked ~ .dotscontainer .box label#img-dot-4,
    input#img-5:checked ~ .dotscontainer .box label#img-dot-5,
    input#img-6:checked ~ .dotscontainer .box label#img-dot-6,
    input#img-7:checked ~ .dotscontainer .box label#img-dot-7 {
      background: #00FFB9;
      border: 5px solid #ffffff;
    }
  
    
    
    input:checked + .slide-container .nav label { display: block; }
    
  
  
  .box {
    display: flex;
  
    /* margin: 85px auto 0; */
    position: absolute;
    bottom: 10px;
    box-sizing: content-box;
    width:100%
  
  }
  
  .box>div {
    text-align: center;
    display: flex;
    flex: 1;
    flex-direction: column;
    align-items: center;
    overflow: hidden;
    padding: 0 20px;
  }
  @media(max-width:576px){
    .box>div {
      padding: 0 2px;
    }
  }
  
  @media(max-width:360px){
    .box>div {
      padding: 0 2px;
    }
  }
  
  .circle {
    display: block;
    width: 40px;
    height: 40px;
    border-radius: 50px;
    border: 5px solid #00FFB9;
    position: relative;
  }
  
  .circle:after,
  .circle:before {
    content: '';
    position: absolute;
    top: 0;
    bottom: 0;
    height: 5px;
    margin: auto;
    background: #00FFB9;
  }
  
  .circle:before {
    left: -10000%;
    width: 10000%;
  }
  
  .circle:after {
    right: -10000%;
    width: 10000%;
  }
  
  .circle--first:before {
    display: none;
  }
  
  .circle--last:after {
    display: none;
  }


  .box-text{
    position:relative;
    font-family: 'Source Sans 3';
    font-style: normal;
    font-weight: 600;
    font-size: 20px;
    line-height: 120%;
    /* or 24px */

    text-align: center;
  }

  /* FAQ */

  .features_FAQ {
    padding: 50px 57px; }
    @media (max-width: 576px){
      .features_FAQ {
        padding: 30px 24px; }
    }

.features__wrapper_FAQ{
    width:fit-content;
  
}

.accordion_FAQ{
    margin-bottom: 190px;
  
}
@media(max-width:576px){
  .accordion_FAQ{
    margin-bottom: 150px;
}
}

.accordion_FAQ > input[type="checkbox"]:checked ~ .content {
 
    opacity:100%;

    padding: 0px 0px 0px 15px;
  }

  .accordion_FAQ .content {
    max-height: 0;
    overflow: visible;
    font-size: 17px;
    font-weight: normal;
    line-height: 120%;
    color: #000;
    margin: 0;
    transition: 0.25s ease-in-out;
    padding-left:15px;  
    position:absolute;
    width:40%;
    opacity: 0%;
  }
  @media(max-width:576px){
    .accordion_FAQ .content {
      font-size: 15px; 
      width:100%;

    }
  }

.features__wrapper_right{
    padding-left: 50px;
}
@media (max-width:576px){
  .features__wrapper_right{
    padding: 10px 10px;
}
}
.features__wrapper_left{
    padding-left:10px;  
}
@media (max-width:576px){
  .features__wrapper_left{
    padding: 10px 10px;
}
}

.accordion_sub_text{
    padding-left:25px;  
}
@media(max-width:576px){
  .accordion_sub_text{
    max-width:100%;
    }
}

/* <!-- -- -- -- PRODUCT_SLIDER -- -- -- --> */

.product_slider{
    padding: 50px 60px;
    visibility: visible;
}
@media(max-width:576px){
  .product_slider{
    padding: 30px 24px;
    visibility: hidden;
    display:none;
}
}
  input.set { display:none; }


  
  #slide1:checked ~ .mask .overflow { margin-right:0; }
  #slide2:checked ~ .mask .overflow { margin-left:-33%; }
  #slide3:checked ~ .mask .overflow { margin-right:33%; }

  
  #slides { 
    width:100%; 
    position:relative;
    }
  
  #slides .mask { 
    width:100%; 
    overflow:hidden; 
    margin:auto;
    /*   */
  }

  .overflow{
    display: flex;
    flex-wrap: nowrap;
    width: 200%;
  }
  
  #slides .overflow { 
    width:300%;  
    -webkit-transition:all 0.5s ease-out; 
    -moz-transition:all 0.5s ease-out; 
    -o-transition:all 0.5s ease-out; 
    transition:all 0.5s ease-out;

   }
  
  #slides .slide { 
    width:33.333%; 
    /* height:auto; 
    line-height:200px;  */
    /* float:left;  */
    display: flex;
    /* flex-wrap: wrap; */
    
   }

   @media(max-width:576px){
    #slides .slide { 
      width:100%;
      /* height:auto; 
      line-height:200px;  */
      /* float:left;  */
      display: flex;
      /* flex-wrap: wrap; */
      
     }
   }
  
  /* #controls { 
    width:100%; } */
  
  #controls  label  { 
    display:none; 
    width:60px; 
    height:60px; 
    opacity:1; 
    position:absolute; 
    top:30%; 
    margin-top:-30px; 
    cursor:pointer; 
    background: transparent;
    /* border-radius: 100%; */
  
    
  }
  
  @media(max-width:767px){
    #controls  label{
      top:30%; 
    }
  }
  
  #slide1:checked ~ #controls label:nth-child(2):hover, 
  #slide2:checked ~ #controls label:nth-child(1):hover{ border-left: 26px solid #00FFB9;  }
  /* #slide4:checked ~ #controls label:nth-child(1):hover{ opacity:0.9; } */
  
  #slide1:checked ~ #controls label:nth-child(1):hover,
  #slide2:checked ~ #controls label:nth-child(2):hover{border-left: 26px solid #00FFB9; }
  /* #slide4:checked ~ #controls label:nth-child(3):hover{ opacity:0.9; } */
  
  
  
  #slide1:checked ~ #controls label:nth-child(2)
  { 
    right:0;  
    content: "";
    display: inline-block;
    margin-right: 10px;
    vertical-align: middle;
    width: 0;
    height: 0;
    border-top: 13px solid transparent;
    border-left: 26px solid #00FFB9;
    border-bottom: 13px solid transparent;
    position: absolute;
    margin-top: 2px;    
  }
  #slide2:checked ~ #controls label:nth-child(2)
  { 
    right:0;  
    content: "";
    display: inline-block;
    margin-right: 10px;
    vertical-align: middle;
    width: 0;
    height: 0;
    border-top: 13px solid transparent;
    border-left: 26px solid #009999;
    border-bottom: 13px solid transparent;
    position: absolute;
    margin-top: 2px;  

  }
  
  
  
  #slide1:checked ~ #controls label:nth-child(1)
  { left:0;
    right:0;  
    content: "";
    display: inline-block;
    margin-right: 10px;
    vertical-align: middle;
    width: 0;
    height: 0;
    border-top: 13px solid transparent;
    border-left: 26px solid #009999;
    border-bottom: 13px solid transparent;
    position: absolute;
    margin-top: 2px;
    transform: rotateY(0deg) rotate(180deg);
   }
   #slide2:checked ~ #controls label:nth-child(1)
   { left:0;
     right:0;  
     content: "";
     display: inline-block;
     margin-right: 10px;
     vertical-align: middle;
     width: 0;
     height: 0;
     border-top: 13px solid transparent;
     border-left: 26px solid #00FFB9;
     border-bottom: 13px solid transparent;
     position: absolute;
     margin-top: 2px;
     transform: rotateY(0deg) rotate(180deg);
    }
  
   
  
  .carousel__slide {
    position: relative;
    flex: 1 0 1%;
    width: 290px;
    margin-right: 45px;
    margin-left: 45px;
  }
  
  .carousel__snapper {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    scroll-snap-align: center;
  }
  
  .slide__info {
    /* text-align: center; */
    /* max-width: 80%; */
    margin: 30px 0px 0px 0px; }
    
  .slide__title {
    font-size: 22px;
    font-weight: bold;
    line-height: 120%;
    color: #000; }
  
  .slide__text {
    font-size: 18px;
    font-weight: normal;
    line-height: 120%;
    color: #000; }
  
    .slide__image {
      display: block;
      width: 70%;
      height: auto;
      max-height: 350px;
      object-fit: cover;
      object-position: center;}

      .slide__info-title {
        font-size: 28px;
        font-weight: bold;
        line-height: 120%;
        color: #000;
        position: relative;
        padding-left: 23px;
        margin-bottom: 40px; }
            @media (max-width: 576px) {
                .about__info-title {
                  font-family: 'Source Sans 3';
                  font-style: normal;
                  font-weight: 600;
                  font-size: 28px;
                  line-height: 120%;
                  margin-bottom: 40px; } }
       .slide__info-title:before {
        content: "";
        position: absolute;
        left: 0;
        top: 0;
        width: 5px;
        height: 100%;
        background: linear-gradient(to bottom, #00FEBA, #00E7DB); }
       .slide__info-text {
        font-family: 'Source Sans 3';
        font-style: normal;
        font-weight: 400;
        font-size: 16px;
        line-height: 120%;
        color: #000;
        margin: 0; }
            @media (max-width: 576px) {
                .about__info-text {
                    font-size: 19px; } }
/* <!-- -- -- -- PROCUST_SLIDER_MINI -- -- -- --> */



                    
/* <!-- -- -- -- SLIDER_FULLSCREEN -- -- -- --> */
.slider_fullscreen{
    padding:50px 60px;
}
@media(max-width:576px){
  .slider_fullscreen{
    padding-top:30px;
    padding-left: 24px;
    padding-right:24px;
    padding-bottom:70px;
}
}

input.set_fullscreen {
  display:none;
}

#slide_fullscreen1:checked ~ .mask_fullscreen .overflow_fullscreen { margin-left:0; }
#slide_fullscreen2:checked ~ .mask_fullscreen .overflow_fullscreen { margin-left:-100%; }
#slide_fullscreen3:checked ~ .mask_fullscreen .overflow_fullscreen { margin-left:-200%; }
/* #slide4:checked ~ .mask .overflow { margin-left:-300%; } */

#slides_fullscreen {

  position:relative;
}

#slides_fullscreen .mask_fullscreen {
  width:100%;
  overflow:hidden;
  margin:auto;

  
  
}
@media(max-width:576px){
  #slides_fullscreen .mask_fullscreen {
    overflow-x: auto;
    scroll-behavior:initial;
    -webkit-overflow-scrolling: touch;
    /* scroll-snap-points-x: repeat(100%); */
    scroll-snap-type: mandatory;
    
}
}

#slides_fullscreen .overflow_fullscreen {
  width:300%;
}

#slides_fullscreen .slide_fullscreen {
  width:33.333%;
  height:auto;
  line-height:200px;
  float:left;
  
  
}

/* #controls {
  width:100%; } */

#controls_fullscreen  label  {
  display:none;
  width:60px;
  height:60px;
  opacity:1;
  position:absolute;
  top:30%;
  margin-top:-30px;
  cursor:pointer;
  background:transparent;
}

@media(max-width:576px){
  #controls_fullscreen  label{
    top: 100%;
    bottom: 0%;
  }
}
.s-control_fullscreen {
  visibility: hidden;
  position: absolute;
  bottom: 18px;
  left: 50%;
  text-align: center;
  transform: translateX(-50%);
  transition-timing-function: ease-out;
}
@media(max-width:576px){
  .s-control_fullscreen{
  visibility: visible;
  bottom:auto;
}
}
.s-control_fullscreen> label[class^="s-c-"] {
  display: inline-block;
  width: 5px;
  height: 33px;
  margin-right: 10px;
  border: 1px solid #009999;
  cursor: pointer;
  background-color: #009999;
}

#slide_fullscreen1:checked ~ .s-control_fullscreen .s-c-1,
#slide_fullscreen2:checked ~ .s-control_fullscreen .s-c-2,
#slide_fullscreen3:checked ~ .s-control_fullscreen .s-c-3{
  background-color: #00FFB9;
  border: 1px solid #00FFB9;}

#slide_fullscreen1:checked ~ #controls_fullscreen label:nth-child(2):hover,
#slide_fullscreen2:checked ~ #controls_fullscreen label:nth-child(3):hover,
#slide_fullscreen3:checked ~ #controls_fullscreen label:nth-child(4):hover {border-left: 26px solid #00FFB9; }
/* #slide4:checked ~ #controls label:nth-child(1):hover{ opacity:0.9; } */

#slide_fullscreen1:checked ~ #controls_fullscreen label:nth-child(4):hover,
#slide_fullscreen2:checked ~ #controls_fullscreen label:nth-child(1):hover,
#slide_fullscreen3:checked ~ #controls_fullscreen label:nth-child(2):hover {border-left: 26px solid #00FFB9; }
/* #slide4:checked ~ #controls label:nth-child(3):hover{ opacity:0.9; } */



#slide_fullscreen1:checked ~ #controls_fullscreen label:nth-child(2),
#slide_fullscreen2:checked ~ #controls_fullscreen label:nth-child(3),
#slide_fullscreen3:checked ~ #controls_fullscreen label:nth-child(1)
{
    right:0;
    content: "";
    display: inline-block;
    margin-right: 10px;
    vertical-align: middle;
    width: 0;
    height: 0;
    border-top: 13px solid transparent;
    border-left: 26px solid #009999;
    border-bottom: 13px solid transparent;
    position: absolute;
    margin-top: 2px;
}
@media(max-width:576px){
#slide_fullscreen1:checked ~ #controls_fullscreen label:nth-child(2),
#slide_fullscreen2:checked ~ #controls_fullscreen label:nth-child(3),
#slide_fullscreen3:checked ~ #controls_fullscreen label:nth-child(1){

  margin-right:0px;
}
}



#slide_fullscreen1:checked ~ #controls_fullscreen label:nth-child(3),
#slide_fullscreen2:checked ~ #controls_fullscreen label:nth-child(1),
#slide_fullscreen3:checked ~ #controls_fullscreen label:nth-child(2)
{   left:0;

    content: "";
    display: inline-block;
    margin-right: 10px;
    vertical-align: middle;
    width: 0;
    height: 0;
    border-top: 13px solid transparent;
    border-left: 26px solid #009999;
    border-bottom: 13px solid transparent;
    position: absolute;
    margin-top: 2px;
    transform: rotateY(0deg) rotate(180deg);
}

@media(max-width:576px){
  #slide_fullscreen1:checked ~ #controls_fullscreen label:nth-child(3),
  #slide_fullscreen2:checked ~ #controls_fullscreen label:nth-child(1),
  #slide_fullscreen3:checked ~ #controls_fullscreen label:nth-child(2){
  
    margin-right:0px;
  }
  }



.carousel__slide_fullscreen {
  position: relative;
  flex: 0 0 100%;
  width: 90%;
  padding: 0 5%;
}
@media(max-width:576px){
.carousel__slide_fullscreen {
  position: relative;
  flex: 0 0 100%;
  width: 100%;
  padding: 0 0;
}}

.carousel__snapper_fullscreen {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  scroll-snap-align: center;
}

.slide__info_fullscreen {
  text-align: left;
  max-width: 50%;
  margin: 45px auto 0;
  border-image: linear-gradient(to bottom, #00FFB9, #00E6DC) 1;
  border-left: 5px solid; }

  @media(max-width:576px){
    .slide__info_fullscreen {
      max-width: 100%;
      margin: 30px auto 30px;
      }
  }
  
.slide__title_fullscreen {
    font-size: 28px;
    font-weight: bold;
    line-height: 120%;
    color: #000;
    position: relative;
    padding-left: 15px;
    margin-bottom: 30px; }

  .slide__text_fullscreen {
    font-family: 'Source Sans 3';
    font-style: normal;
    font-weight: 400;
    font-size: 16px;
    line-height: 120%;
    color: #000;
    padding-left:15px;
    margin: 0; }
        @media (max-width: 576px) {
            .about__info-text {
              font-family: 'Source Sans 3';
              font-style: normal;
              font-weight: 400;
              font-size: 19px;
              line-height: 120%;
              margin-bottom:0px;} }

  .slide__image_fullscreen{
    display: block;
    width: 100%;
    height: auto;
    max-height: 350px;
    object-fit: cover;
    object-position: center;}



    /* BENEFIT PRODUCT */
.benefits_product{
    padding: 50px 50px;
}
@media(max-width:576px){
  .benefits_product{
    padding: 30px 24px;
}
}

#benefits_product_container{
    position: relative;
    width:100%;
    display: flex;
}
@media(max-width:576px){
  #benefits_product_container{

    display: block;
}
}



.benefit_producs {
    position: relative;
    flex: 1 0 1%;
    width: 290px;
    margin-right: 30px;
    margin-left: 30px;
  }
  @media(max-width:576px){
    .benefit_producs {
      position: relative;
      flex: 1 0 1%;
      width: 290px;
      margin: 0 auto;
    }
  }

    /* BENEFIT PRODUCT2 */

.benefits_product2{
        padding: 50px 50px;
}
@media(max-width:576px){
  .benefits_product2{
    padding: 30px 24px;
}
}


.proudct2{
    display:flex;
    margin-bottom:20px;
}
@media(max-width:576px){
  .proudct2{
    display:block;
    margin-bottom:20px;
}
}
.benefits_product2_img{
    width:50%;
    padding-left:50px;
    margin-right: 0;
    margin-left: auto;
}
@media(max-width:576px){
  .benefits_product2_img{
    width:auto;
    padding: 0 10px;
    margin-bottom: 20px;
}
}

.benefits_product2_img img{
    width:90%;
}
@media(max-width:576px){
  .benefits_product2_img img{
    width:90%;

}
}
.benefits_product2_text{
    width:70%;
    font-family: 'Source Sans 3';
    font-style: normal;
    font-weight: 400;
    font-size: 17px;
    line-height: 120%;
    display: flex;
    justify-content: center;
    align-items: center;
}
@media(max-width:576px){
  .benefits_product2_text{
    width:auto;
    padding: 0 10px;
    margin-bottom: 20px;
}
}

.benefits_product2_subtitle{
    border-image: linear-gradient(to bottom, #00FFB9, #00E6DC) 1;
    border-left: 5px solid;
    padding: 0 50px 0 20px;
}
@media(max-width:576px){
  .benefits_product2_subtitle{

    padding: 0 0 0 26px;

}
}



/* APPLICATION */

.application{
    padding: 50px 50px;
}
@media(max-width:576px){
  .application{
    padding: 30px 24px;
}
}

.application_container{
    display: flex;
    padding: 0px 15px 0px 15px;
    justify-content: center;
    height:500px;

}
@media(max-width:576px){
  .application_container{
    display: flex;
    padding: 0px 10px 0px 10px;
    /* height: 322px; */
    flex-direction: column-reverse;
    flex-wrap: nowrap;
    align-items: center;
    justify-content: flex-end;
    height:auto;
}

}


.application_box{
    margin: 0 15px 0 15px;
    border-image: linear-gradient(to bottom, #00FFB9, #00E6DC) 1;
    border-left: 5px solid;

}
@media(max-width:576px){
  .application_box{
  height: 322px;
  width: 317;
  overflow: hidden;
  margin-bottom: 20px;
}}
.application_img{
    position:relative;

}


  input[type="checkbox"].hide-input:checked + .shadow {
    width:100%;
    height:500px;;
    opacity: 1;
    
    -webkit-transition-duration: 0.8s;
    -moz-transition-duration: 0.8s;
    -o-transition-duration: 0.8s;
    transition-duration: 0.8s;  
}
input[type="checkbox"].hide-input:not(:checked) + .shadow {
  width:100%;
  height:500px;;
  opacity: 0;
  
  -webkit-transition-duration: 0.8s;
  -moz-transition-duration: 0.8s;
  -o-transition-duration: 0.8s;
  transition-duration: 0.8s;  
}
  input[type="checkbox"].hide-input:checked + .shadow .arrow_animation{
    -webkit-transition-duration: 0.8s;
    -moz-transition-duration: 0.8s;
    -o-transition-duration: 0.8s;
    transition-duration: 0.8s;  

    
}
    input[type="checkbox"].hide-input:checked + .shadow .arrow_animation{
        -webkit-transition-duration: 0.8s;
        -moz-transition-duration: 0.8s;
        -o-transition-duration: 0.8s;
        transition-duration: 0.8s;  

        
}
input[type="checkbox"].hide-input:not(:checked) + .shadow .arrow_animation{
  -webkit-transition-duration: 0.8s;
  -moz-transition-duration: 0.8s;
  -o-transition-duration: 0.8s;
  transition-duration: 0.8s;  

  
}
  input[type="checkbox"].hide-input:not(:checked) + .shadow .arrow_animation{
      -webkit-transition-duration: 0.8s;
      -moz-transition-duration: 0.8s;
      -o-transition-duration: 0.8s;
      transition-duration: 0.8s;  

      
  }
      
  
  input.hide-input {
    position: absolute;
    left: -999em;
  }
  label.toggle {
    cursor: pointer;
  }

  .shadow{
    background: linear-gradient(180deg, rgba(0, 255, 185, 0.9) 0%, rgba(0, 230, 220, 0.9) 100%);
    backdrop-filter: blur(5px);
    z-index:2;
    width:100%;
    height:500px;;
    position: absolute;
    opacity: 0.0;
    

  }

  @media(max-width:576px){
    .shadow{
     height:auto;
      
  
    }
  }

  .RichContent .arrow {
    left:5%;
    top:25px;  
    content: "";
    display: inline-block;
    margin-right: 10px;
    vertical-align: middle;
    width: 0;
    height: 0;
    border-top: 13px solid transparent;
    border-left: 26px solid #00FFB9;
    border-bottom: 13px solid transparent;
    position: absolute;
    margin-top: 2px; 

  }

  .arrow_animation{
    left:5%;
    top:25px;  
    content: "";
    display: inline-block;
    margin-right: 10px;
    vertical-align: middle;
    width: 0;
    height: 0;
    border-top: 13px solid transparent;
    border-left: 26px solid #FFFFFF;
    border-bottom: 13px solid transparent;
    position: absolute;
    margin-top: 2px; 
    /* transform: rotateY(0deg) rotate(180deg); */
  }

  .shadow_text{
    padding: 25px 35px;
    display: flex;
    margin-top:50%;
    font-family: 'Source Sans 3';
    font-style: normal;
    font-weight: 400;
    font-size: 17px;
    line-height: 120%;
  }
  @media(max-width:576px){
    .shadow_text{
 
      margin-top:25%;

    }
  }




 .bottom {
  margin: 50px 50px;
  padding: 60px 0 50px;
  position: relative;
  background-color: #000028;}
@media (max-width: 576px) {
   .bottom {
      margin: 30px 24px; 
      position: absolute;
      padding:auto;
      background-color: #000028;} }
 .bottom:before {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 20px;
  background: linear-gradient(to right, #00FEBA, #00E7DB); }
 .bottom__image {
  position: absolute;
  right: 0;
  bottom: 0;
  width: 30%;
  height: auto;
  z-index: 2; }
 .bottom__wrapper {
  max-width: 90%;
  margin: 0 auto;
  position: relative;
  z-index: 3; }
 .bottom__row {
  display: flex;
  align-items: center;
  justify-content: space-between; }
 .bottom__text {
  font-size: 28px;
  text-align: left;
  font-weight: bold;
  line-height: 1.35;
  color: #ffffff;
  position: relative;
  padding-left: 30px;
  margin-bottom: 40px;
  max-width: 55%; }
@media (max-width: 576px) {
   .bottom__text {
      font-size: 22px;
      max-width: 100%; } }
 .bottom__text:before {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  width: 5px;
  height: 100%;
  background: linear-gradient(to bottom, #00FEBA, #00E7DB); }
 .bottom__logo {
  margin-top: 50px;
  display: block;
  width: auto;
  height: 30px; }