.philosophie {
  background-image: url("../img/wms-bg.png");
  background-repeat: no-repeat;
  background-position: top center;
  position: relative;
  padding: 100px 0 0;
  @media (max-width: 991px) {
    padding: 50px 0 0;
  }

  .text-cont {
    text-align: center;

    h2.section-title {
      span {
        position: relative;

        img {
          position: absolute;
          left: 0;
          bottom: -20px;
        }
      }
    }
  }

  .point {
    height: 100vh;
    width: 100%;
    padding-top: 50px;


    @media only screen and (max-width: 991px) {
      height: auto;
      width: auto;
    }


  }


  .swapper-content-wrapper h3 {
    font-family: $Inter;
    font-size: 40px;
    font-weight: 600;
    line-height: 48px;
    color: #000;
    margin-bottom: 20px;
    @media only screen and (max-width: 1024px) {
      font-size: 28px;
      line-height: 30px;
    }
  }

  .swapper-content-wrapper p {
    font-family: $Inter;
    font-size: 18px;
    font-weight: 400;
    line-height: 21px;
    text-align: left;
    color: #5F5F5F;

    @media only screen and (max-width: 1024px) {
      font-size: 14px;
      line-height: 24px;
    }
    @media only screen and (max-width: 767px) {
     text-align: center;
    }
  }
  .swapper-content-wrapper{
    ul{
      list-style: none;
      margin: 35px 0 0 ;
      li{
        font-family: $Inter;
        font-size: 18px;
        font-weight: 400;
        line-height: 35px;
        color: #000;
        margin-bottom: 10px;
        position: relative;
        @media only screen and (max-width: 767px) {
          text-align: left;
        }
        &:after{
          content: url('data:image/svg+xml,<svg width="18" height="18" viewBox="0 0 18 18" fill="none" xmlns="http://www.w3.org/2000/svg"><circle cx="9" cy="9" r="9" fill="white"/><path d="M7.94005 9.64345L5.8066 6.2304C5.66934 6.00938 5.69493 5.72554 5.86709 5.53244C6.04158 5.33933 6.32077 5.28582 6.55342 5.3975L14.231 9.11998C14.4311 9.21769 14.5591 9.4201 14.5591 9.64345C14.5591 9.8668 14.4311 10.0692 14.231 10.1669L6.55342 13.8894C6.472 13.929 6.38591 13.9476 6.29983 13.9476C6.1393 13.9476 5.97877 13.8801 5.86709 13.7545C5.69493 13.5614 5.66934 13.2775 5.8066 13.0565L7.94005 9.64345ZM12.6443 9.64345L7.86327 7.32621L9.11961 9.33634C9.23826 9.5248 9.23826 9.76443 9.11961 9.95288L7.86327 11.963L12.6443 9.64345Z" fill="url(%23paint0_linear_377_6332)"/><path d="M4.12946 5.42794C4.40166 5.25811 4.75995 5.33954 4.93212 5.61174L7.25867 9.33422C7.37732 9.52267 7.37732 9.76231 7.25867 9.95076L4.93212 13.6732C4.82277 13.8501 4.63199 13.9454 4.43889 13.9454C4.33419 13.9454 4.22717 13.9175 4.13178 13.857C3.85958 13.6872 3.77582 13.3289 3.94799 13.0544L6.07911 9.64365L3.94566 6.2306C3.77582 5.95607 3.85725 5.59778 4.12946 5.42794Z" fill="url(%23paint1_linear_377_6332)"/><defs><linearGradient id="paint0_linear_377_6332" x1="14.5591" y1="9.64395" x2="5.71857" y2="9.64395" gradientUnits="userSpaceOnUse"><stop stop-color="%235558A6"/><stop offset="0.5" stop-color="%234AB9EA"/><stop offset="1" stop-color="%23D7DF23"/></linearGradient><linearGradient id="paint1_linear_377_6332" x1="7.34766" y1="9.64265" x2="3.85707" y2="9.64265" gradientUnits="userSpaceOnUse"><stop stop-color="%235558A6"/><stop offset="0.5" stop-color="%234AB9EA"/><stop offset="1" stop-color="%23D7DF23"/></linearGradient></defs></svg>');
          position: absolute;
          left: -35px;
          top: 0;
          bottom: 0;
          margin: auto;
        }
      }
    }
  }


  .wrapper {
    height: 100vh;
    width: 100%;

    @media only screen and (max-width: 991px) {
      height: auto;
      width: auto;
    }
    @media only screen and (max-width: 767px) {
      text-align: center;
      padding: 0 50px;
    }
    @media only screen and (max-width: 425px) {
      text-align: center;
      padding: 0 0px;
    }
  }

  .point .panel-image {
    margin-right: auto;
    overflow: hidden;
    height: 100vh;

    @media only screen and (max-width: 991px) {
      height: auto;
    }
  }

  article.panel-text.panel-text-one {
    transform: translate(0px, 100px);

    @media only screen and (max-width: 991px) {
      transform: none;
    }
  }

  .point img {
    float: right;
    width: 100%;

    @media only screen and (max-width: 991px) {
      float: none;
      width: auto;
    }

  }

  .imagetoch1 {
    opacity: 1 !important;
    visibility: visible !important;
    position: relative;
    z-index: 6;
  }

  .imagetoch2 {
    opacity: 1 !important;
    visibility: visible !important;
    position: relative;
    z-index: 5;
  }

  .imagetoch3 {
    opacity: 1 !important;
    visibility: visible !important;
    position: relative;
    z-index: 4;
  }

  .imagetoch4 {
    opacity: 1 !important;
    visibility: visible !important;
    position: relative;
    z-index: 3;
  }

  .imagetoch5 {
    opacity: 1 !important;
    visibility: visible !important;
    position: relative;
    z-index: 2;
  }

  .imagetoch6 {
    opacity: 1 !important;
    visibility: visible !important;
    position: relative;
    z-index: 1;
  }

}

