
.hero-section{
    position: relative;
    color: #fff;
    text-align: center;
    background-repeat: no-repeat;
    background-size: cover;
    background-position: 50%;
    background-attachment: fixed;
    z-index: 1;
    padding: 100px 0 0;
    height: 600px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}
.hero-section.answer-book-project-page{
    background-image: url('../../assets/projects/answerbook/answerbook.webp');
}
.hero-section.bryllance-project-page{
    background-image: url('../../assets/projects/bryllance/Bryllance 4.png');
}
.hero-section.eccocar-project-page{
    background-image: url('../../assets/projects/eccocar/hero-eccocar.webp');
}
.hero-section.remedo-project-page{
    background-image: url('../../assets/projects/remedo/Remedo-Home-1.png');
}
.hero-section.petaments-project-page{
    background-image: url('../../assets/projects/petaments/hero-imh');
}
.hero-section.sonetel-project-page{
    background-image: url('../../assets/projects/sonetel/Sonetel 1.png');
    background-position-y: 148%;
}
.hero-section.pincc-project-page{
  background-image: url('../../assets/projects/pincc/1.png');
  background-position-y: 148%;
}
.hero-section.tapsmart-project-page{
  background-image: url('../../assets/projects/tapsmart/ts1.png');
  background-position-y: 148%;
}
.hero-section.pipeline-project-page{
  background-image: url('../../assets/projects/pipeline/hero-pipeline');
}
.hero-section.shopout-project-page{
  background-image: url('../../assets/projects/shopout/Web-Shopout.png');
}
.hero-section.bluebird-project-page{
  background-image: url('../../assets/projects/bluebird/bluebird.1.png');
}
.hero-section.compose-project-page{
  background-image: url('../../assets/projects/compose/Compose5.jpeg');
}
.hero-section.noobStrom-project-page{
  background-image: url('../../assets/projects/noobstrom/noob-web-1.png');
}
.hero-section::before{
    content: "";
    position: absolute;
    background-color: #000;
    opacity: 0.5;
    top: 0;
    left: 0;
    height: 100%;
    width: 100%;
}
.hero-section.bryllance-project-page::before{
    opacity: 0.7;
}
.hero-section.eccocar-project-page::before{
    opacity: 0.7;
}
.hero-section.remedo-project-page::before{
    opacity: 0.7;
}
.hero-section.sonetel-project-page::before{
    opacity: 0.7;
}
.hero-section.shopout-project-page::before{
  opacity: 0.7;
}
.hero-section.bluebird-project-page::before{
  opacity: 0.7;
}
.hero-section.noobStrom-project-page::before{
  opacity: 0.7;
}
.hero-section.compose-project-page::before{
  opacity: 0.7;
}
.project-name{
    height: 100%;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
}
.project-name p{
    font-size: 16px;
    color: #fff;
}
.project-name h2{
    font-size: 60px;
    font-weight: 600;
    color: #fff;
    letter-spacing: 1px;
}
.common-title{
    font-weight: 500;
    font-size: 22px;
    color: #000;
    margin: 0;
}
.common-title i{
    margin-right: 10px;
    background: linear-gradient(to right, #333231 0%, #8f8278 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}
.common-badge{
    font-size: 14px !important;
    background-color: transparent !important;
    color: #111 !important;
    opacity: 0.6;
    padding: 0 !important;
}
.pd-about-text{
    font-weight: 400;
    font-size: 14px;
    letter-spacing: 0.2;
}
.project-detials{
    background: linear-gradient(to left, #333231 -20%, #8f8278 100%);
    padding: 30px 0;
}
.project-detials-reverse{
    background: linear-gradient(to right, #333231 -20%, #8f8278 100%);
    padding: 30px 0;
}
.web-dev-part{
    background: linear-gradient(to right, #333231 -20%, #8f8278 100%);
    padding: 50px 0;
}
.address-book-page .footer-1{
    margin-top: 0;
}
.cs-image-part{
  display: flex;
  align-items: flex-end;
  margin-bottom: 1rem;
}
.cs-image-part .image-icon img{
  filter: invert(1);
}
.cs-image-part .image-icon img.throphy{
  width: 35px;
  margin-right: 10px;
}
.cs-image-part .features-container-title{
  margin-bottom: 0;
  max-width: 100%;
}

.features-container-title {
    font-family: 'Poppins', sans-serif;
    font-weight: 600;
    color: #fff;
    margin-bottom: 2rem;
    max-width: 90%;
}
.feature-heading-text{
    font-family: 'Poppins', sans-serif !important;
    font-size: 16px;
    font-weight: 300;
    max-width: 85%;
    opacity: 0.8;
}
.feature-details{
    margin-bottom: 0.5rem;
}
.feature-heading {
    font-family: 'Poppins', sans-serif !important;
    font-size: 16px;
    line-height: 30px;
    letter-spacing: 0.6px;
    font-weight: 300;
    max-width: 85%;
    opacity: 0.8;
    position: relative;
    margin-left: 10px;
}
.feature-heading::before{
    position: absolute;
    content: '';
    background-color: #fff;
    height: 8px;
    width: 8px;
    border-radius: 50%;
    left: -18px;
    top: 11px;
}
.inner-right-content{
    text-align: left;
}
.inner-right-content h6{
    font-size: 20px;
    font-weight: 600;
    margin-bottom: 16px;
}
.inner-right-content p{
    margin-bottom: 4px;
    font-weight: 400;
    font-size: 15px;
}





body {
    margin: 0;
    background: #EEE;
    user-select: none;
    font-family: sans-serif;
  }

  #slider {
    position: relative;
    width: 60%;
    height: 15vw;
    margin: 50px auto 100px;
    font-family: 'Helvetica Neue', sans-serif;
    perspective: 1400px;
    transform-style: preserve-3d;
  }
  #slider-desktop{
    position: relative;
    width: 80%;
    height: 20vw;
    min-height: 500px;
    margin: 50px auto 100px;
    font-family: 'Helvetica Neue', sans-serif;
    perspective: 1400px;
    transform-style: preserve-3d;
  }
  #slider2 {
    position: relative;
    width: 15%;
    height: 500px;
    perspective: auto;
    Perspective: 1400px;
    margin: 50px auto 100px;
    font-family: 'Helvetica Neue', sans-serif;
    transform-style: preserve-3d;
  }
  #slider.slider-remedo{
    width: 15%;
    height: 500px;
    perspective: auto;
  }
  #slider.slider-sonetel{
    margin: 50px auto 80px;
  }

  #slider.slider-tapsmart{
    width: 20%;
    height: 450px;
  }

  .tap-smart-left img{
    width: 35vw;
  }

  .tap-smart-right {
    width: 35vw;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
  }

  .tap-smart-feature-heading {
    font-size: 18px;
    margin-bottom: 16px;
    color: #fff;
  }


  #slider label,
  #slider label img {
    position: absolute;
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
    color: white;
    font-size: 70px;
    font-weight: bold;
    border-radius: 3px;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: transform 400ms ease;
  }
  #slider-desktop label, #slider-desktop label img{
    position: absolute;
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
    color: white;
    font-size: 70px;
    font-weight: bold;
    border-radius: 3px;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: transform 400ms ease;
  }
  #slider.slider-sonetel label, #slider.slider-sonetel label img{
    width: 100%;
    height: auto;
  }
  #slider.slider-remedo label, #slider.slider-remedo label img {
    width: 240px;
    height: 500px;
  }
  #slider2 label,
  #slider2 label img {
    position: absolute;
    width: 240px;
    height: 500px;
    left: 0;
    top: 0;
    color: white;
    font-size: 70px;
    font-weight: bold;
    border-radius: 3px;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: transform 400ms ease;
  }

  /* Slider Functionality */
  /* Active Slide */
  #s1:checked~#slide1,
  #s2:checked~#slide2,
  #s3:checked~#slide3,
  #s4:checked~#slide4,
  #s5:checked~#slide5 {
    box-shadow: 0 13px 26px rgba(0, 0, 0, 0.3), 0 12px 6px rgba(0, 0, 0, 0.2);
    transform: translate3d(0%, 0, 0px);
  }

  /* Next Slide */
  #s1:checked~#slide2,
  #s2:checked~#slide3,
  #s3:checked~#slide4,
  #s4:checked~#slide5,
  #s5:checked~#slide1 {
    box-shadow: 0 6px 10px rgba(0, 0, 0, 0.3), 0 2px 2px rgba(0, 0, 0, 0.2);
    transform: translate3d(20%, 0, -100px);
  }

  /* Next to Next Slide */
  #s1:checked~#slide3,
  #s2:checked~#slide4,
  #s3:checked~#slide5,
  #s4:checked~#slide1,
  #s5:checked~#slide2 {
    box-shadow: 0 1px 4px rgba(0, 0, 0, 0.4);
    transform: translate3d(40%, 0, -250px);
  }

  /* Previous to Previous Slide */
  #s1:checked~#slide4,
  #s2:checked~#slide5,
  #s3:checked~#slide1,
  #s4:checked~#slide2,
  #s5:checked~#slide3 {
    box-shadow: 0 1px 4px rgba(0, 0, 0, 0.4);
    transform: translate3d(-40%, 0, -250px);
  }

  /* Previous Slide */
  #s1:checked~#slide5,
  #s2:checked~#slide1,
  #s3:checked~#slide2,
  #s4:checked~#slide3,
  #s5:checked~#slide4 {
    box-shadow: 0 6px 10px rgba(0, 0, 0, 0.3), 0 2px 2px rgba(0, 0, 0, 0.2);
    transform: translate3d(-20%, 0, -100px);
  }

  /*desktop-slider */

  #s1-desktop:checked~#slide1-desktop,
  #s2-desktop:checked~#slide2-desktop,
  #s3-desktop:checked~#slide3-desktop,
  #s4-desktop:checked~#slide4-desktop,
  #s5-desktop:checked~#slide5-desktop {
    box-shadow: 0 13px 26px rgba(0, 0, 0, 0.3), 0 12px 6px rgba(0, 0, 0, 0.2);
    transform: translate3d(0%, 0, 0px);
  }

  /* Next Slide */
  #s1-desktop:checked~#slide2-desktop,
  #s2-desktop:checked~#slide3-desktop,
  #s3-desktop:checked~#slide4-desktop,
  #s4-desktop:checked~#slide5-desktop,
  #s5-desktop:checked~#slide1-desktop {
    box-shadow: 0 6px 10px rgba(0, 0, 0, 0.3), 0 2px 2px rgba(0, 0, 0, 0.2);
    transform: translate3d(20%, 0, -100px);
  }

  /* Next to Next Slide */
  #s1-desktop:checked~#slide3-desktop,
  #s2-desktop:checked~#slide4-desktop,
  #s3-desktop:checked~#slide5-desktop,
  #s4-desktop:checked~#slide1-desktop,
  #s5-desktop:checked~#slide2-desktop {
    box-shadow: 0 1px 4px rgba(0, 0, 0, 0.4);
    transform: translate3d(40%, 0, -250px);
  }

  /* Previous to Previous Slide */
  #s1-desktop:checked~#slide4-desktop,
  #s2-desktop:checked~#slide5-desktop,
  #s3-desktop:checked~#slide1-desktop,
  #s4-desktop:checked~#slide2-desktop,
  #s5-desktop:checked~#slide3-desktop {
    box-shadow: 0 1px 4px rgba(0, 0, 0, 0.4);
    transform: translate3d(-40%, 0, -250px);
  }

  /* Previous Slide */
  #s1-desktop:checked~#slide5-desktop,
  #s2-desktop:checked~#slide1-desktop,
  #s3-desktop:checked~#slide2-desktop,
  #s4-desktop:checked~#slide3-desktop,
  #s5-desktop:checked~#slide4-desktop {
    box-shadow: 0 6px 10px rgba(0, 0, 0, 0.3), 0 2px 2px rgba(0, 0, 0, 0.2);
    transform: translate3d(-20%, 0, -100px);
  }



  /* Slider Functionality */
  /* Active Slide */


  /* REMEDO-SLIDER-PART */
  #slider.slider-remedo #s1:checked~#slide1,
  #slider.slider-remedo #s2:checked~#slide2,
  #slider.slider-remedo #s3:checked~#slide3,
  #slider.slider-remedo #s4:checked~#slide4,
  #slider.slider-remedo #s5:checked~#slide5 {
    box-shadow: none;
    transform: translate3d(0%, 0, 0px);
  }

  /* Next Slide */
  #slider.slider-remedo #s1:checked~#slide2,
  #slider.slider-remedo #s2:checked~#slide3,
  #slider.slider-remedo #s3:checked~#slide4,
  #slider.slider-remedo #s4:checked~#slide5,
  #slider.slider-remedo #s5:checked~#slide1 {
    box-shadow: none;
    transform: translate3d(75%, 0, -100px);
  }

  /* Next to Next Slide */
  #slider.slider-remedo #s1:checked~#slide3,
  #slider.slider-remedo #s2:checked~#slide4,
  #slider.slider-remedo #s3:checked~#slide5,
  #slider.slider-remedo #s4:checked~#slide1,
  #slider.slider-remedo #s5:checked~#slide2 {
    box-shadow: none;
    transform: translate3d(160%, 0, -250px);
  }

  /* Previous to Previous Slide */
  #slider.slider-remedo #s1:checked~#slide4,
  #slider.slider-remedo #s2:checked~#slide5,
  #slider.slider-remedo #s3:checked~#slide1,
  #slider.slider-remedo #s4:checked~#slide2,
  #slider.slider-remedo #s5:checked~#slide3 {
    box-shadow: none;
    transform: translate3d(-160%, 0, -250px);
  }

  /* Previous Slide */
  #slider.slider-remedo #s1:checked~#slide5,
  #slider.slider-remedo #s2:checked~#slide1,
  #slider.slider-remedo #s3:checked~#slide2,
  #slider.slider-remedo #s4:checked~#slide3,
  #slider.slider-remedo #s5:checked~#slide4 {
    box-shadow: none;
    transform: translate3d(-75%, 0, -100px);
  }

  /* REMEDO-SLIDER-PART */
  #slider2.slider-remedo #s11:checked~#slide11,
  #slider2.slider-remedo #s21:checked~#slide21,
  #slider2.slider-remedo #s31:checked~#slide31,
  #slider2.slider-remedo #s41:checked~#slide41,
  #slider2.slider-remedo #s51:checked~#slide51 {
    box-shadow: none;
    transform: translate3d(0%, 0, 0px);
  }

  /* Next Slide */
  #slider2.slider-remedo #s11:checked~#slide21,
  #slider2.slider-remedo #s21:checked~#slide31,
  #slider2.slider-remedo #s31:checked~#slide41,
  #slider2.slider-remedo #s41:checked~#slide51,
  #slider2.slider-remedo #s51:checked~#slide11 {
    box-shadow: none;
    transform: translate3d(75%, 0, -100px);
  }

  /* Next to Next Slide */
  #slider2.slider-remedo #s11:checked~#slide31,
  #slider2.slider-remedo #s21:checked~#slide41,
  #slider2.slider-remedo #s31:checked~#slide51,
  #slider2.slider-remedo #s41:checked~#slide11,
  #slider2.slider-remedo #s51:checked~#slide21 {
    box-shadow: none;
    transform: translate3d(160%, 0, -250px);
  }

  /* Previous to Previous Slide */
  #slider2.slider-remedo #s11:checked~#slide41,
  #slider2.slider-remedo #s21:checked~#slide51,
  #slider2.slider-remedo #s31:checked~#slide11,
  #slider2.slider-remedo #s41:checked~#slide21,
  #slider2.slider-remedo #s51:checked~#slide31 {
    box-shadow: none;
    transform: translate3d(-160%, 0, -250px);
  }

  /* Previous Slide */
  #slider2.slider-remedo #s11:checked~#slide51,
  #slider2.slider-remedo #s21:checked~#slide11,
  #slider2.slider-remedo #s31:checked~#slide21,
  #slider2.slider-remedo #s41:checked~#slide31,
  #slider2.slider-remedo #s51:checked~#slide41 {
    box-shadow: none;
    transform: translate3d(-75%, 0, -100px);
  }



  input[type="radio"] {
   
    display: none;
  }
  .slider-section{
    overflow: hidden;
  }

  .feature-content.obstacles{
    margin-left: 20px;
}