
/*services*/
/*services*/

.container-services {
    /*background:#F2F2F2;*/
    padding-bottom: 100px;
  }
  @media (min-width: 1024px) {
    .text-section02 {
      /*margin-left: 7.3rem;*/
      width: 65%;
      /*padding-top: 50px;*/
      padding: 43px 60px;
    }
    .text-services {
      /*background-color: #f0f0f0;*/
      padding-top: 38px;
      border-radius: 10px;
    }
    .inner-page-header01 {
        height:711px
    }
    .header-banner {
      height:auto !important
  }
  }
  
  .text-services h6 {
    color: #00a6e0;
    font-size: 15px;
    margin-bottom: 1rem;
    font-weight: 600;
  }
  .text-services h2 {
    color: #2e2c70;
    margin-bottom: 1rem;
    margin-left: -3px;
  }
  .text-services p {
    margin-bottom: 1rem;
  }
  @media (min-width: 900px) {
    .text-services h2 {
      color: #2e2c70;
      font-size: 50px;
      font-weight: 300;
      margin-left: -3px;
    }
  }
  
  @media (max-width: 1000px) {
    .text-section02 {
      /*margin-left: 5rem;*/
      width: 100%;
      padding: 45px 55px !important;
    }
    .text-services h6 {
      color: #00a6e0;
      font-size: 65px !important;
    }
    .text-services h2 {
      color: #2e2c70;
      font-size: 100px !important;
      font-weight: 300;
    }
    .text-services p {
      margin-bottom: 1rem;
      font-size: 45px !important;
    }
    .text-services {
      /*margin-top: 10rem;*/
    }
  
    .card {
      min-width: 550px;
      min-height: 200px;
      font-size: 2rem !important;
    }
    .card__wrapper h2 {
      font-size: 2.5rem !important;
      line-height: 1.5em;
      font-weight: 300;
    }
  }
  .container-services  .main-fs {
    display: flex;
    /*flex-wrap: wrap;*/
    gap: 0rem;
    /*max-width: 1450px;*/
    margin: auto;
  }
  @media (max-width: 1000px) {
    .card {
      width: 20%;
      max-width: 350px;
      padding-top: 40.5% !important;
    }
  }
  .card {
    width: 20%;
    max-width: 350px;
    padding-top: 20.5%;
    position: relative;
    overflow: hidden;
    font-weight: 400;
    font-size: 0.8rem;
    line-height: 1.43em;
    height: 10px;
  }
  .card__media {
    position: absolute;
    /*top: 0;*/
    left: 0;
    bottom: 0;
    right: 0;
    transform-origin: center bottom;
    transition: transform 800ms ease-out, filter 800ms ease-out;
  }
  .card__media::before {
    position: absolute;
    bottom: 0;
    left: 0;
    z-index: 1;
    content: "";
    display: block;
    width: 100%;
    height: 5%;
    background-image: linear-gradient(
      180deg,
      rgba(0, 0, 0, 0) 0%,
      rgba(0, 0, 0, 1) 100%
    );
    opacity: 0.8;
  }
  .card__media img {
    width: 100%;
    /* height: 125%; */
    height: 100%;
    display: block;
    /* object-fit: cover;
    object-position: bottom center; */
    object-fit: fill;
    object-position:  center;
  }
  .card__content {
    --padding: 1rem;
    position: relative;
    z-index: 2;
    width: calc(100% - var(--padding) * 2);
    height: calc(100% - var(--padding) * 2);
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    padding: var(--padding);
    color: white;
  }
  .card__wrapper {
    transform: translateY(80%);
    transition: transform 350ms ease-out;
    margin-left: 0.5rem;
  }
  .card__wrapper h2 {
    margin: 0;
    transform: translateY(-100%);
    font-weight: 300;
    font-size: 1.5rem;
    line-height: 1.3em;
    transition: transform 150ms ease-out;
  }
  .card__wrapper p {
    padding-bottom: 65px;
  }
  .card__wrapper a {
    background-color: white;
    display: inline-block;
    padding: 0.8rem 1rem;
    border-radius: 0.5rem;
    text-decoration: none;
    color: black;
    font-weight: 500;
  }
  .card:hover .card__wrapper {
    transform: translateY(0);
  }
  .card:hover .card__wrapper h2 {
    transform: translateY(0);
  }
  
  /*cursor*/
  @media (max-width: 1000px) {
    .cursor-text {
      display: none;
    }
    .card__content {
      position: absolute;
      left: 50%;
      transform: translate(-50%, 100%);
    }
  }
  @media (min-width: 1024px) {
    .custom-cursor-section {
      position: relative;
      cursor: none !important;
    }
  
    .custom-cursor {
      position: absolute;
      border-radius: 50%;
      display: flex;
      align-items: center;
      justify-content: center;
      pointer-events: none;
      user-select: none;
      z-index: 9999; /* Adjust the z-index as needed */
      transform: translate(-50%, -50%);
    }
  
    .cursor-text {
      position: absolute;
      width: 65px;
      height: 65px;
      color: #fff;
      background-color: #00a6e0;
      border-radius: 50%;
      display: flex;
      align-items: center;
      justify-content: center;
      pointer-events: none;
      user-select: none;
      z-index: 9999; /* Adjust the z-index as needed */
      transform: translate(-50%, -50%);
      font-size:12px;
    }
    .card__content {
      position: absolute;
      top: 100%;
      transform: translate(-50%, -50%);
    }
  }
  .card {
    position: relative;
    overflow: hidden;
    transition: transform 0.5s ease-out, filter 0.5s ease-out;
  }
  
 .card:hover {
    filter: grayscale(100%);
    transform: scale(1.1);
    z-index: 999;
  }

  .card.custom-cursor-section:hover .card__media {
      /* filter: brightness(30%); */
      filter: brightness(10%);
  }
  .card__media {
    width: 100%;
    /*height: 100%;*/
  }
  
  .card__content {
    position: absolute;
    left: 50%;
  }
  
  .features__filler {
    overflow: auto;
    display: block;
    min-height: 490px;
    margin: auto;
    box-sizing: border-box;
  }
  
  /*3*/
  .features__filler .features__wrap .features__scroller02 {
    position: relative;
    left: 0;
    width: 2040px;
    /*margin: 39px auto;*/
    z-index: -0;
  }
  .container-services  .scroll__wrap02 {
    cursor: pointer;
  }
  
   .container-services .scroll__wrap02 .scrollbar__big02 {
    margin: auto;
    width: 800px;
    height: 9px;
    background-color: #dbdbdb;
    /*margin-left: 35rem;*/
    border-radius: 15px;
  }
  
   .container-services .scroll__wrap02 .scrollbar__big02 .scrollbar__runner02 {
    height: 9px;
    width: 40%;
    background-color: #00a6e0;
    border-radius: 15px;
  }
  
  @media only screen and (min-width:1200px){
      .slider_wrap003{
          overflow:hidden !important
      }
      .slider-wrap003{
          overflow:hidden !important
      }
  }
  @media (max-width: 1200px) and (min-width: 50px) {
  .slider_wrap003{
          overflow: scroll !important;
  }
  .slider-wrap003{
          overflow: scroll !important;
  }
    /*.slider003 {*/
    /*  overflow-x: visible;*/
      /*overflow-y: visible;*/
    /*  overflow-y: scroll;*/
    /*  scrollbar-color:  #00a6e0 lightblue;*/ 
      /*margin-bottom: 60px;*/
    /*}*/
    /* .slider003 {
  max-width: 100vw;
  overflow-x: scroll;
  position: relative;
  scrollbar-color: #00a6e0 #00a6e0;
  scrollbar-width: thin;
  -ms-overflow-style: none;
}
    .slider003::-webkit-scrollbar {
  height: 5px;
}

.slider003::-webkit-scrollbar-track {
  -webkit-box-shadow: inset 0 0 0px rgba(0, 0, 0, 0);
}

.slider003::-webkit-scrollbar-thumb {
  height: 5px;
  background-color: #00a6e0;
}

.slider003::-webkit-scrollbar-thumb:hover {
  background-color: #00a6e0;
} */

    .holder003 {
      width: 130%;
    }
    /* .slide003 {
      float: left;
      width: 300px;
      height: 500px;
      position: relative;
      background-position: -100px 0;
    } */
    .temp {
      position: absolute;
      color: white;
      font-size: 25px;
      bottom: 15px;
      left: 15px;
      font-weight: 100;
    }
    #slide-0 {
      background-image: url("./Images/webp/GymaApi.webp");
    }
    #slide-1 {
      background-image: url("./Images/webp/GymaCDMO.webp");
    }
    #slide-2 {
      background-image: url("./Images/BusinessDevelopment.png");
    }
    #slide-3 {
      background-image: url("./Images/webp/Scientific-Affairs.webp");
    }
    #slide-4 {
      background-image: url("./Images/Fully-Integrated Logistics.png");
    }
    #slide-5 {
      background-image: url("./Images/webp/GymaCDMO.webp");
    }
    /* .slide003:before {
      content: "";
      position: absolute;
      bottom: 0;
      left: 0;
      width: 100%;
      height: 40%;
      background: linear-gradient(transparent, black);
    } */

    .text-partners h2 {
      width: 95% !important;
    }
    .card__wrapper {
      margin-left: -5px !important;
    }
  }
  
  @media (max-width: 1000px) {
   
  
    .container-services {
      height: auto !important;
    }
    .gyma-sci {
      margin-top: 4rem !important;
    }
    .gyma-bio {
      margin-top: 3rem !important;
    }
  }
  
  @media (min-width: 1024px) {
  
    .gyma-sci {
      margin-top: 1.5rem !important;
    }
    .gyma-bio {
      margin-top: 0.9rem !important;
    }
  
  }
  
  @media (max-width: 1000px) {
    .text-section02 {
      /*margin-left: 5rem;*/
      width: 100%;
      padding: 45px 55px !important;
    }
    .text-services h6 {
      color: #00a6e0;
      font-size: 28px !important;
    }
    .text-services h2 {
      color: #2e2c70;
      font-size: 100px !important;
      font-weight: 300;
    }
    .text-services p {
      margin-bottom: 1rem;
      font-size: 45px !important;
    }
  
    .card {
      min-width: 550px;
      min-height: 200px;
      font-size: 2rem !important;
    }
    .card__wrapper h2 {
      font-size: 2.5rem !important;
      line-height: 1.5em;
      font-weight: 300;
    }
  }
  
  @media (max-width: 1000px) {
    .card {
      width: 100%;
      /*max-width: 350px;*/
      padding-top: 40.5% !important;
      height: 800px !important;
    }
  }
  
  .card {
    width: 100%;
    /*max-width: 350px;*/
    /*padding-top: 20.5%;*/
    position: relative;
    overflow: hidden;
    font-weight: 400;
    font-size: 0.8rem;
    line-height: 1.43em;
    height: 540px;
    margin-top: -10rem;
    margin-bottom: 3rem;
  }
  .card__media {
    position: absolute;
    /*top: 0;*/
    left: 0;
    bottom: 0;
    right: 0;
    transform-origin: center bottom;
    transition: transform 800ms ease-out, filter 800ms ease-out;
  }
  .card__media::before {
    position: absolute;
    bottom: 0;
    left: 0;
    z-index: 1;
    content: "";
    display: block;
    width: 100%;
    height: 45%;
    background-image: linear-gradient(
      180deg,
      rgba(0, 0, 0, 0) 0%,
      rgba(0, 0, 0, 1) 100%
    );
    opacity: 0.8;
  }
  /* .card__media img {
    width: 100%;
    height: 125%;
    display: block;
    object-fit: cover;
    object-position: bottom center;
  } */
  .card__content {
    --padding: 1rem;
    position: relative;
    z-index: 2;
    width: calc(100% - var(--padding) * 2);
    height: calc(100% - var(--padding) * 2);
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    padding: var(--padding);
    color: white;
  }
  .card__wrapper {
    transform: translateY(80%);
    transition: transform 350ms ease-out;
    margin-left: 0.5rem;
    text-align: left;
  }
  .card__wrapper h2 {
    margin: 0;
    transform: translateY(-100%);
    font-weight: 300;
    font-size: 1.5rem;
    line-height: 1.3em;
    transition: transform 150ms ease-out;
  }
  .card__wrapper p {
    padding-bottom: 65px;
  }
  .card__wrapper a {
    background-color: white;
    display: inline-block;
    padding: 0.8rem 1rem;
    border-radius: 0.5rem;
    text-decoration: none;
    color: black;
    font-weight: 500;
  }
  .card:hover .card__wrapper {
    transform: translateY(0);
  }
  .card:hover .card__wrapper h2 {
    transform: translateY(0);
  }
  
  @media (max-width: 1024px) {
    .container-services  .scroll__wrap {
      display: none !important;
    }
     .container-services .scroll__wrap02 {
      display: none !important;
    }
  }
  

  
  /* @media (max-width: 1024px) {
    .container-services .scroll__wrap {
      display: none !important;
    }
    .container-services .scroll__wrap02 {
      display: none !important;
    }
  } */

  
  