body,
      html {
        padding: 0;
        margin: 0;
        box-sizing: border-box;
        font-family: Arial, sans-serif;
        font-display: swap
      }

      *,
      ::after,
      ::before {
        box-sizing: inherit
      }

      .speech-section {
        background-color: #f9f9f9;
        padding: 2rem 0
      }

      .overlay-section {
        position: relative
      }

      .background-img {
        position: absolute;
        width: 30vw;
        height: 30vw;
        max-width: 100%;
        z-index: 1
      }

      .main-section-speech {
        padding: 1vw;
        display: flex;
        justify-content: center;
        align-items: center;
        flex-direction: column;
        text-align: center
      }

      .speech-title-section {
        padding: 0 5vw;
        font-size: 2.5rem
      }

      .title-text {
        margin-left: 2vw
      }

      .speech-subtitle-section {
        margin-left: 10vw;
        margin-right: 10vw;
        margin-top: 1rem;
        font-display: swap
      }

      .subtitle-text {
        font-size: 1.3rem
      }

      .secondary-container {
        max-width: 1320px;
        margin: 0 auto;
        padding: 1rem 2.5rem
      }

      .text,
      .text-second {
        margin-bottom: 7px;
        color: #000
      }

      .ratio-color {
        color: #333333;
      }

      .db-text-to-speech-secondary {
        background-color: #fff;
        box-shadow: 0 4px 8px rgba(0, 0, 0, .1);
        border-radius: 10px;
        padding: 2rem 2rem 3rem
      }

      .choose-voice,
      .custom-select {
        position: relative;
        appearance: none;
        transition: border-color .3s;
        outline: 0;
        box-shadow: 0 2px 4px rgba(0, 0, 0, .1);
        font-weight: 600;
        cursor: pointer
      }

      .db-first-section,
      .db-second-section {
        background: #f9f9f9;
        padding: 1rem;
        height: auto;
        font-size: 18px;
        display: flex
      }

      .db-second-section {
        flex-direction: column;
        margin-top: 1rem;
        gap: 10px
      }

      .first-section-content,
      .second-section-content {
        font-size: 1rem
      }

      .first-section-content {
        flex: 5;
        margin-left: 1rem;
        font-size: 18px
      }

      .second-section-content {
        flex: 1;
        margin-left: 1rem
      }

      .db-textarea-section {
        display: flex;
        align-items: flex-end;
        justify-content: space-between;
        width: 100%;
        background-color: #f9f9f9;
        border-radius: 10px;
        border: 1px solid #d9d9d9
      }

      .textarea-input-section {
        width: 100%;
        border: none;
        outline: 0;
        height: 40vh;
        padding: .4rem;
        border-radius: 10px;
        font-size: 18px
      }

      .custom-select {
        background-color: #fff;
        border-radius: 20px;
        padding: .5rem 1.5rem;
        font-size: 1rem;
        background-image: url('https://dubninja.com/icons/down-arrow.png');
        color: #333;
        border: 1px solid #6c1aa6;
        width: 150px;
        background-position: right 1rem center;
        background-repeat: no-repeat;
        background-size: 1rem;
        display: flex !important;
        gap: 2rem !important
      }

      .btn-delete {
        background: 0 0;
        cursor: pointer;
        border: none
      }

      .db-input-sections,
      .result-section {
        margin-top: 2rem
      }

      .generate-output {
        display: flex;
        justify-content: center
      }

      .generate-button {
        font-size: 1.2rem;
        background-color: #8b3dff;
        padding: 1rem;
        border-radius: 10px;
        border: 1px solid #8b3dff;
        color: #fff;
        cursor: pointer
      }

      .generate-button:hover {
        background-color: #6e32cc
      }

      .dropdown-sections {
        position: relative;
        display: inline-block;
        width: 200px
      }

      .choose-voice {
        pointer-events: auto;
        background-color: #fff;
        border-radius: 20px;
        padding: .5rem 2.5rem;
        font-size: 1rem;
        background-image: url('https://dubninja.com/icons/down-arrow.png');
        color: #333;
        border: 1px solid #6c1aa6;
        width: 100%;
        max-width: 200px;
        z-index: 2;
        background-position: right 1rem center;
        background-repeat: no-repeat;
        background-size: 1rem
      }

      .content-sample,
      .forth-sample,
      .is-invalid,
      .sample-fifth,
      .second-content,
      .sixth-content,
      .third-content {
        font-size: 18px
      }

      .ts-dropdown-content {
        display: none;
        position: absolute;
        z-index: 1;
        min-width: 210px;
        background-color: #fff;
        border-radius: 5px;
        overflow: hidden;
        border: 1px solid #d4d0d0;
        padding: 5px;
        margin-top: 2.5rem
      }

      .active {
        background-color: #1967d2;
        color: #fff
      }

      .show {
        display: block
      }

      .ts-dropdown-content ul {
        list-style-type: none;
        padding: 0;
        margin: 0
      }

      .ts-dropdown-content ul li {
        padding: 4px;
        cursor: pointer;
        transition: background-color .3s
      }

      .language-demo-section {
        width: 100%;
        background-color: #fff;
        border: 1px solid #e0e0e0;
        border-radius: 10px;
        padding: 1rem
      }

      .grid-container {
        display: grid;
        grid-template-columns: repeat(3, 1fr);
        grid-gap: 10px
      }

      .grid-item {
        background-color: #f0f0f0;
        padding: 7px;
        height: 122px
      }

      .first-avatar {
        width: 50px;
        height: 50px;
        background-size: contain;
        background-position: center
      }

      .fifth-voice-sample,
      .first-samples-videos,
      .forth-voice-sample,
      .second-sample-videos,
      .sixth-sample-voice,
      .third-sample-videos {
        display: flex;
        gap: 20px
      }

      .avatar-fifth,
      .avatar-first,
      .avatar-forth,
      .avatar-second,
      .avatar-sixth,
      .avatar-third {
        flex: 1
      }

      #audioPlayer,
      .hidden-results,
      .img-hidden,
      .text-hidden {
        display: none
      }

      .characters {
        text-align: end;
        color: #000;
        margin-right: 1.5rem
      }

      #is-invalid-id,
      .is-invalid {
        color: red
      }

      .img-loading {
        display: flex;
        justify-content: center;
        flex-direction: column;
        align-items: center;
        margin-top: 1rem;
        gap: 1px
      }

      .other-info {
        display: flex;
        justify-content: space-between
      }

      .fifth-avatar,
      .forth-avatar,
      .second-avatar,
      .sixth-avatar,
      .third-avatar {
        width: 50px;
        height: 50px
      }

      .radio-section label {
        display: block;
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        cursor: pointer
      }

      /* Visually hide the label while keeping it accessible */
      /* Hide the radio input but keep it interactive */
      .radio-one {
        position: absolute;
        opacity: 0;
        cursor: pointer;
      }

      /* Screen reader only */
      .sr_only {
        position: absolute;
        width: 1px;
        height: 1px;
        margin: -1px;
        padding: 0;
        overflow: hidden;
        clip: rect(0, 0, 0, 0);
        border: 0;
      }

      /* Style for radio button section */
      .radio-section {
        display: inline-block;
        position: relative;
        width: 2rem;
        height: 2rem;
        background-color: #fff;
        border: 2px solid #999;
        border-radius: 5px;
        cursor: pointer;
        transition: border-color 0.2s;
      }

      /* Add focus state for keyboard navigation */
      .radio-section:focus {
        outline: none;
        border-color: #007bff;
      }

      /* Style for the radio indicator (the square/checkbox) */
      .radio-indicator {
        display: block;
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        cursor: pointer;
      }

      /* Style the checkmark when radio button is checked */
      .radio-one:checked+.radio-indicator::after {
        content: "\2713";
        /* Unicode checkmark */
        position: absolute;
        left: 8px;
        top: 2px;
        font-size: 20px;
        color: #00f;
        /* Color of the checkmark */
      }

      /* Style for radio buttons when checked */
      .radio-section[aria-checked="true"] {
        border-color: #007bff;
        /* Blue border when selected */
        background-color: #f0f8ff;
      }

      /* Transition effect for better UX */
      .radio-section[aria-checked="true"] .radio-indicator::after {
        transition: all 0.3s ease-in-out;
      }


      .breeze-info,
      .tale-content,
      .text-forth,
      .title-slack {
        font-weight: 700;
        color: #000
      }

      .player-icons {
        flex: 1;
        display: flex;
        align-items: center;
        flex-direction: column;
        gap: 15px
      }

      .glow-text,
      .zephyr-text {
        font-weight: 600;
        color: #000
      }

      .preview-btn,
      .preview-btn-second {
        background-color: #fff;
        width: 2.5rem;
        height: 2.5rem;
        border: none;
        border-radius: 50%;
        display: flex;
        justify-content: center;
        align-items: center;
        cursor: pointer;
        transition: background-color .3s
      }

      .audio-player,
      .audio-section {
        border-color: rgba(125, 135, 155, .2)
      }

      .audio-player,
      .forward-controls {
        display: flex;
        align-items: center
      }

      .preview-btn-second:hover,
      .preview-btn:hover {
        background-color: #bcbcb8
      }

      .audio-section {
        background-color: #f9f9f9
      }

      .audio-player {
        padding: 1rem;
        margin-top: 1rem;
        gap: 1.5rem;
        margin-right: auto;
        margin-left: auto;
        width: 100%;
        box-sizing: border-box
      }

      .play-button {
        flex-shrink: 0
      }

      .btn-play {
        display: flex;
        justify-content: center;
        align-items: center;
        width: 3.5rem;
        height: 3.5rem;
        border-radius: 9999px;
        background-color: #6e6e6e;
        border: none
      }

      .play-img {
        width: 1.5rem;
        height: 1.5rem;
        fill: #fafcfc
      }

      .play-controls {
        flex: 1;
        padding: .75rem
      }

      .controls-section {
        display: flex;
        gap: 1.5rem;
        flex: 1
      }

      .forward-controls {
        gap: 1rem
      }

      .full-width,
      .player-width {
        align-items: center;
        display: flex
      }

      .backward-btn,
      .forward-btn {
        border-radius: 9999px;
        border: none;
        background: 0 0
      }

      .backward-img,
      .download-img,
      .forward-img {
        stroke: #64748b;
        width: 1.5rem;
        height: 1.5rem
      }

      .progress-bar,
      .track-section {
        height: 8px;
        border-radius: .25rem
      }

      .player-width {
        flex: 1
      }

      .full-width {
        width: 100%
      }

      .wrapper-section {
        display: flex;
        align-items: center;
        justify-content: space-between;
        width: 100%;
        gap: .5rem
      }

      .track-section {
        position: relative;
        flex-grow: 1;
        background-color: #e0e0e0;
        width: 100%;
        margin-left: 0
      }

      .progress-bar {
        width: 0%;
        background-color: #2c2338;
        transition: width .1s
      }

      .pause-img {
        width: 1.5rem;
        height: 1.5rem;
        fill: #fff
      }

      .time-stamps {
        display: flex;
        gap: .5rem;
        color: #7d879b;
        font-size: .875rem
      }

      .download-btn {
        border-radius: 9999px;
        border: none;
        background-color: transparent
      }

      .result-text {
        font-size: 18px;
        text-align: center;
        margin-top: 1rem
      }

      #result-ids {
        height: 90px
      }

      .text {
        font-weight: 700
      }

      #text-content {
        font-size: 20px;
        color: #000
      }

      @media(max-width:355px) {
        .db-second-section {
          padding: .5rem
        }

        .grid-item {
          height: 30vh !important
        }

        .ts-dropdown-content {
          left: 20%
        }
      }

      @media(min-width:355px) and (max-width:370px) {
        .grid-item {
          height: 35vh !important
        }

        .ts-dropdown-content {
          left: 20%
        }
      }

      @media(min-width:370px) and (max-width:376px) {
        .grid-item {
          height: 35vh !important
        }

        .ts-dropdown-content {
          left: 22%
        }
      }

      @media(min-width:376px) and (max-width:400px) {
        .grid-item {
          height: 25vh !important
        }

        .ts-dropdown-content {
          left: 22%
        }
      }

      @media(min-width:400px) and (max-width:435px) {
        .ts-dropdown-content {
          left: 25%
        }

        .grid-item {
          height: 20vh !important
        }
      }

      @media(min-width:435px) and (max-width:470px) {
        .ts-dropdown-content {
          left: 27%
        }

        .grid-item {
          height: 25vh !important
        }
      }

      @media(min-width:470px) and (max-width:500px) {
        .ts-dropdown-content {
          left: 28%
        }
      }

      @media(min-width:500px) and (max-width:530px) {
        .ts-dropdown-content {
          left: 30%
        }
      }

      @media(min-width:530px) and (max-width:560px) {
        .ts-dropdown-content {
          left: 31%
        }

        .third-sample-videos {
          gap: 1.5rem
        }

        .third-content {
          flex: 7
        }
      }

      @media(min-width:560px) and (max-width:576px) {
        .ts-dropdown-content {
          left: 32%
        }

        .third-content {
          flex: 8
        }
      }

      @media(max-width:576px) {
        .grid-container {
          display: grid;
          grid-template-columns: repeat(1, 1fr);
          gap: 10px
        }

        .dropdown-sections,
        .second-section-content {
          margin: auto
        }

        .grid-item {
          height: 30vh
        }

        .speech-title-section {
          padding: 0;
          font-size: 1.5rem;
          line-height: 1
        }

        .forward-controls {
          position: absolute;
          z-index: 1;
          top: 60%
        }

        .subtitle-text {
          font-size: 18px
        }

        .title-text {
          margin-left: 0
        }

        .speech-subtitle-section {
          margin-left: 0;
          margin-right: 0;
          margin-top: 1rem
        }

        .db-first-section {
          display: flex;
          flex-direction: column;
          gap: 15px
        }

        .choose-voice {
          padding: .5rem 2.5rem
        }

        .db-text-to-speech-secondary {
          padding-left: 1rem;
          padding-right: 1rem;
          padding-top: 1rem
        }

        .audio-player {
          display: flex;
          padding: 1rem .5rem;
          align-items: center
        }

        .controls-section {
          position: relative
        }

        .download-img {
          width: 2rem;
          height: 2rem
        }

        .dropdown {
          margin-left: .3rem
        }
      }

      @media(min-width:576px) and (max-width:660px) {
        .ts-dropdown-content {
          left: 32%
        }

        .forth-sample,
        .second-content,
        .sixth-content {
          flex: 8
        }
      }

      @media(min-width:660px) and (max-width:700px) {
        .ts-dropdown-content {
          left: 34%
        }

        .content-sample,
        .second-content {
          flex: 8
        }

        .forth-sample,
        .sample-fifth,
        .sixth-content {
          flex: 7
        }
      }

      @media(min-width:630px) and (max-width:660px) {
        .ts-dropdown-content {
          left: 34%
        }

        .content-sample,
        .forth-sample,
        .second-content {
          flex: 8
        }

        .sample-fifth,
        .sixth-content {
          flex: 7
        }
      }

      @media(min-width:576px) and (max-width:700px) {
        .grid-container {
          display: grid;
          grid-template-columns: repeat(1, 1fr);
          gap: 10px
        }

        .third-content {
          flex: 8
        }

        .dropdown-sections {
          margin: auto
        }

        .speech-title-section {
          font-size: 2rem
        }

        .title-text {
          margin-left: 0
        }
      }

      @media(min-width:700px) and (max-width:850px) {
        .grid-container {
          display: grid;
          grid-template-columns: repeat(1, 1fr);
          gap: 10px
        }

        .speech-title-section {
          font-size: 2rem
        }

        .title-text {
          margin-left: 1rem
        }

        .subtitle-text {
          font-size: 18px
        }

        .content-sample,
        .forth-sample,
        .sample-fifth,
        .second-content,
        .sixth-content,
        .third-content {
          flex: 8
        }
      }

      @media(min-width:850px) and (max-width:1000px) {
        .grid-container {
          display: grid;
          grid-template-columns: repeat(2, 1fr);
          gap: 10px
        }

        .speech-title-section {
          padding: 0 5vw;
          font-size: 2.3rem
        }

        .title-text {
          margin-left: 1rem
        }

        .grid-item {
          height: 15vh
        }
      }

      @media(min-width:870px) and (max-width:1000px) {
        .grid-item {
          height: 15vh !important
        }
      }

      @media(min-width:300px) and (max-width:400px) and (min-height:600px) and (max-height:700px) {
        .grid-item {
          height: 30vh !important
        }

        .language-demo-section {
          padding-left: 0 !important;
          padding-right: 0 !important
        }
      }

      @media(min-width:900px) and (max-width:1000px) and (min-height:1300px) and (max-height:1400px) {
        .grid-item {
          height: 10vh !important
        }
      }

      @media(min-width:800px) and (max-width:1000px) and (min-height:400px) and (max-height:500px) {
        .grid-item {
          height: 30vh !important
        }
      }

      @media(min-width:500px) and (min-height:700px) and (max-width:600px) and (max-height:800px) {
        .grid-item {
          height: 20vh !important
        }
      }

      @media(min-width:1000px) and (max-width:1200px) {
        .speech-title-section {
          font-size: 2.3rem
        }

        .grid-container {
          display: grid;
          grid-template-columns: repeat(2, 1fr);
          gap: 10px
        }

        .grid-item {
          height: 20vh
        }

        .content-sample,
        .forth-sample,
        .sample-fifth,
        .second-content,
        .sixth-content,
        .third-content {
          flex: 8
        }
      }

      @media(min-width:1100px) and (max-width:1200px) and (min-height:800px) and (max-height:900px) {
        .grid-item {
          height: 15vh !important
        }
      }

      @media(min-width:1000px) and (max-width:1100px) and (min-height:1300px) and (max-height:1400px) {
        .grid-item {
          height: 10vh !important
        }
      }

      @media(min-width:1200px) and (max-width:1300px) and (min-height:800px) and (max-height:900px) {
        .grid-item {
          height: 17vh !important
        }
      }

      @media(min-width:1300px) and (max-width:1400px) and (min-height:1000px) and (max-height:1100px) {
        .grid-item {
          height: 15vh !important
        }
      }

      @media(min-width:1300px) and (max-width:1400px) and (min-height:900px) and (max-height:1000px) {
        .grid-item {
          height: 15vh !important
        }
      }

      @media(min-width:1200px) and (max-width:1400px) {
        .grid-item {
          height: 30vh
        }
      }

      @media(min-width:1600px) and (max-width:1800px) {
        .speech-subtitle-section {
          margin-left: 15vw;
          margin-right: 15vw;
          margin-top: 1rem
        }
      }

      @media(min-width:1800px) and (max-width:2000px) {
        .speech-subtitle-section {
          margin-left: 19vw;
          margin-right: 19vw;
          margin-top: 1rem
        }
      }

      @media(min-width:2000px) {
        .speech-subtitle-section {
          margin-left: 27vw;
          margin-right: 27vw;
          margin-top: 1rem
        }
      }
      @media(min-width:1500px) and (max-width:1600px){
        .subtitle-text{
          padding: 0 3vw !important;
        }
      }

      @media(min-width:3000px) and (max-width:4000px) {
        .speech-subtitle-section {
          margin-left: 35vw;
          margin-right: 35vw;
          margin-top: 1rem
        }
      }
      @media(min-width:4000px) and (max-width:4100px){
        .subtitle-text{
          padding: 0 9vw !important;
        }
      }
      @media(min-width:4100px){
        .subtitle-text{
          padding: 0 12vw !important;
        }
      }

      .login-btn {
        color: #000000 !important;
      }

      @media(min-width:820px) {
        body {
          padding-right: 0px !important;
        }
      }

      /*Navbar Section*/

      .navbar-logo-text {
        font-weight: 700;
        font-size: 20px;
      }

      .hero-main {
        height: 85vh;
      }

      /*Hero Section*/
      .hero-heading {
        color: white;
        border-radius: 5px;
        padding: 0.1rem 0.2rem;
      }

      @media(min-width:300px) and (max-width:400px) {
        .hero-main {
          height: 55vh !important;
        }
      }

      @media(min-width :400px) and (max-width:576px) {
        .hero-main {
          height: 45vh !important;
        }
      }

      @media(min-width:576px) and (max-width:920px) {
        .hero-main {
          height: 40vh !important;
        }
      }

      @media(min-width:921px) and (max-width:1000px) {
        .hero-main {
          height: 60vh !important;
        }
      }

      @media(min-width:1001px) and (max-width:1300px) {
        .hero-main {
          height: 60vh !important;
        }

        .main-nav {
          padding-left: 0rem !important;
          padding-right: 0rem !important;
        }

        .nav-link-custom {
          padding: .5rem 1rem !important;
        }
      }

      @media(max-width:576px) {
        .main-section {
          margin-top: 25vw;
        }

        .headline-hero {
          font-weight: 700;
          line-height: 1.25;
          font-size: 22px;
        }

        .lead {
          font-size: 20px;
        }
      }

      @media(min-width:578px) and (max-width:912px) {
        .headline-hero {
          font-size: calc(1.45rem + 1.7vw);
          line-height: 1.25;
          font-weight: 700;
        }
      }

      @media(min-width:913px) and (max-width:1200px) {
        .headline-hero {
          font-size: calc(1.5rem + 2.1vw);
          line-height: 1.25;
          font-weight: 700;
        }
      }

      /*demo-section*/
      .demo-container-tagline {
        align-items: center;
      }

      .demo-container-price {
        padding-bottom: 2rem;
      }

      .demo-main-section {
        height: 80%;
      }

      .demo-text {
        text-align: center;
        font-size: 2.07rem;
      }

      .tagline-demo {
        text-align: center;
      }

      .demoSection .badge {
        background-color: #e9ecef;
        border: 2px solid blueviolet;
        margin: 10px;
        padding: 8px 15px;
        display: flex;
        flex-direction: row;
        align-items: center;
        justify-content: center;
        gap: 3px;
        border-radius: 10px;
      }

      .demoSection .text {
        line-height: 30px;
        font-size: 18px;
        text-transform: capitalize;
        font-weight: 500;
        color: black;
      }

      .demoSection .view-line {
        width: 1px;
        border-right: 1px solid black;
        height: 21px;
      }

      .demoSection .image-art-icon,
      .demoSection .image-gaming-icon,
      .demoSection .image-product-icon,
      .demoSection .image-books-icon,
      .demoSection .image-music-icon {
        width: 34px;
        height: 34px;
        overflow: hidden;
        flex-shrink: 0;
      }

      .img-repeat {
        background-image: url(../img/pattern-square.svg);
        background-repeat: repeat-y
      }

      .demoSection {
        max-width: 1200px;
        width: 100%;
        background-color: white;
        border-radius: 10px;
      }

      .group-type {
        display: flex;
        flex-wrap: wrap;
        justify-content: center;
        margin-top: 25px;
        font-size: 20px;
      }

      .blogSection {
        width: 100%;
        padding-top: 1vw;
        display: flex;
        flex-wrap: wrap;
        justify-content: center;
      }

      .video-container {
        position: relative;
        margin: 10px;
        padding: 10px;
        border-radius: 10px;
        flex: 1 1 300px;
        max-width: 100%;
        overflow: hidden;
        padding-bottom: 35%;
      }

      .box2 {
        border: 2px solid blueviolet;
        padding: 30px;
        border-radius: 15px;
        flex: 1 1 230px;
        margin: 10px;
      }

      .title1 {
        font-size: 20px;
        margin-bottom: 10px;
      }

      .text1,
      .text2,
      .text3,
      .text4,
      .text5,
      .text6,
      .text7,
      .text8 {
        line-height: 30px;
        text-transform: capitalize;
        font-weight: 500;
        margin-left: 10px;
        font-size: 18px;
      }

      .box2>div.active {
        background: #8b3dff;
        color: #fff;
      }

      .box2>div .active {
        color: #fff;
      }

      .box2>div {
        background: none;
      }

      .active-white>div {
        color: #fff;
      }

      .group-type>div.active {
        background: #8b3dff;
        color: white;
      }

      .group-type>div.active .text {
        background: #8b3dff;
        color: white;
      }

      .group-type>div {
        background: none;
      }

      .button1,
      .button2,
      .button3,
      .button4,
      .button5,
      .button6,
      .button7 {
        padding: 5px;
        margin-bottom: 5px;
        border-radius: 5px;
      }

      @media(max-width:576px) {
        .blogSection {
          display: flex;
          flex-direction: column;
          height: auto;
        }

        .demo-text {
          font-size: 22px;
          line-height: 1.25;
        }

        video {
          width: 100%;
        }

        .video-container {
          margin-left: 16px;
        }

        .box2 {
          margin-left: 16px;
          width: 100%;
        }
      }

      @media(min-width:768px) and (max-width:915px) {
        .blogSection {
          display: flex;
          flex-direction: column;
          height: auto;
        }

        .lead {
          font-size: 20px;
        }

        video {
          width: 100%;
        }

        .video-container {
          margin: 15px 17px;
        }

        .box2 {
          margin: 15px 17px;
          width: 100%;
        }
      }

      @media(min-width:915px) and (max-width:1200px) {
        .blogSection {
          display: flex;
          flex-direction: row;
          width: 100%;
          margin: auto;
        }

        .button1,
        .button2,
        .button3,
        .button4,
        .button5,
        .button6,
        .button7 {
          padding: 2px;
          margin-bottom: 5px;
          border-radius: 5px;
        }

        .box2 {
          height: 90%;
          padding: 10px;
        }
      }


      @media(min-width:1200px) and (max-width:2000px) {
        .box2 {
          padding: 30px;
        }

        .blogSection {
          margin: auto;
        }
      }

      /* Feature Section */
      .feature-container {
        margin-bottom: 2rem;
      }

      .feature-section {
        width: 100%;
        min-height: 70%;
        display: flex;
        align-items: center;
        justify-content: center;
        padding: 2rem 1rem;
        background-color: #f8f9fa;
      }

      .features {
        width: 100%;
        display: flex;
        flex-wrap: wrap;
        gap: 1rem;
        justify-content: center;
      }

      .title {
        font-size: 2rem;
      }

      .tagline-feature {
        font-size: 18px;
      }

      .cards {
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: center;
        width: 100%;
        max-width: 250px;
        aspect-ratio: 1;
        padding: 10px;
        border-radius: 20px;
        border: 1px solid #8b3dff;
        text-align: center;
        gap: 0.5rem;
        background-color: #fff;
        box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
        transition: transform 0.3s, box-shadow 0.3s;
      }

      .cards:hover {
        transform: translateY(-10px);
        box-shadow: 0 8px 16px rgba(0, 0, 0, 0.2);
      }

      .cards img {
        max-width: 60%;
        height: auto;
      }

      .cards h3 {
        margin: 10px 0;
        font-size: 18px;
        color: #333;
      }

      .cards p {
        font-weight: 300;
        font-size: 18px;
        color: #666;
        text-align: center;
      }

      /* Responsive Adjustments */
      @media(min-width:351px) and (max-width:376px) {
        .cards {
          height: 40vh;
          padding: 14px;
          max-width: 300px;
          aspect-ratio: 1;
          margin: auto;
        }

        .cards h3 {
          font-size: 18px;
        }

        .title {
          font-size: 22px;
          line-height: 1.25;
        }

        .cards p {
          font-size: 18px;
        }
      }

      @media(min-width:341px) and (max-width:350px) {
        .cards {
          height: 30vh;
          padding: 10px;
          aspect-ratio: 1;
          margin: auto;
        }

        .title {
          font-size: calc(1.3rem + 2vw);
          line-height: 1.25;
        }

        .cards h3 {
          font-size: 1.125rem;
        }

        .cards p {
          font-size: 18px;
        }
      }

      @media (min-width:376px) and (max-width: 530px) {
        .title {
          font-size: 22px;
          line-height: 1.25;
        }

        .tagline-feature {
          font-size: 20px;
        }

        .cards {
          padding: 10px;
          height: 32vh;
          max-width: 100%;
          aspect-ratio: 1;
          margin: auto;
        }

        .cards h3 {
          font-size: 18px;
        }

        .cards p {
          font-size: 18px;
        }
      }

      @media(min-width:531px) and (max-width:576px) {
        .cards {
          height: 40vh;
          max-width: 100%;
          aspect-ratio: 1;
          margin: auto;
          padding: 10px
        }

        .cards h3 {
          font-size: 18px;
        }

        .cards p {
          font-size: 18px;
        }
      }

      @media(min-width:578px) and (max-width:912px) {
        .cards h3 {
          font-size: calc(1rem + 0.8vw);
        }

        .title {
          font-size: 1.8rem;
        }

        .tagline-feature {
          font-size: 20px;
        }

        .cards p {
          font-size: 18px;
        }
      }

      /* Ensure 4 cards per row on larger screens */
      @media (min-width: 915px) and (max-width:1025px) {
        .col-lg-3 {
          flex: 0 0 25%;
          max-width: 23%;
          padding: 2px 1px;
        }

        .cards-1 {
          padding: 15px 10px;
        }

        .cards-2 {
          padding: 16px 10px;
        }

        .cards-3 {
          padding: 5px 10px;
        }

        .cards-4 {
          padding: 16px 10px;
        }

        .cards-5 {
          padding: 15px 10px;
        }

        .cards-6 {
          padding: 16px 10px;
        }

        .cards-7 {
          padding: 26px 10px;
        }

        .cards-8 {
          padding: 16px 10px;
        }
      }

      @media(min-width:1026px) and (max-width:1300px) {
        .col-lg-3 {
          flex: 0 0 25%;
          max-width: 23%;
          padding: 2px 1px;
        }

        .cards-1 {
          padding: 15px 10px;
        }

        .cards-2 {
          padding: 16px 10px;
        }

        .cards-3 {
          padding: 5px 10px;
        }

        .cards-4 {
          padding: 16px 10px;
        }

        .cards-5 {
          padding: 15px 10px;
        }

        .cards-6 {
          padding: 16px 10px;
        }

        .cards-7 {
          padding: 26px 10px;
        }

        .cards-8 {
          padding: 16px 10px;
        }
      }


      /*Work Section*/
      .work-container-tagline {
        margin-bottom: 2rem;
      }

      .work-section {
        width: 100%;
      }

      .des-section {
        display: flex;
        flex-direction: column;
        justify-content: flex-start;

      }

      .heading-work {
        font-size: 2.1rem;
        font-weight: 700;
      }

      .subtitle {
        font-size: 1.25rem;
        font-weight: 500;
      }

      .main-section {
        width: 100%;
      }

      .work-image {
        width: 100%;
        height: auto;
      }

      .work-container {
        gap: 1.5rem;
      }

      .number {
        position: relative;
        width: 4rem;
        height: 3rem;
        display: flex;
        justify-content: center;
        align-items: center;
      }

      .firstnum {
        display: flex;
        justify-content: center;
        align-items: center;
        width: 4rem;
        height: 3.5rem;
        border-radius: 20px;
        background-color: #8b3dff;
        color: white;
        font-size: 1.5rem;
      }

      .title-image-container {
        gap: 1rem;
      }

      .vertical-line {
        position: absolute;
        width: 1px;
        height: 6rem;
        background: #666666;
        left: 50%;
        top: 100%;
      }

      .vertical-line-2 {
        position: absolute;
        width: 1px;
        height: 6rem;
        background: #666666;
        left: 50%;
        top: 100%;
      }

      .numer3 {
        margin-top: 0px;
      }

      .description-title {
        font-weight: 600;
        font-size: 18px;
      }

      .description-content {
        font-size: 18px;
      }

      @media(max-width:350px) {
        .vertical-line {
          height: 10rem !important;
        }
      }

      /* Responsive adjustments */
      @media (max-width: 576px) {
        .heading-work {
          font-size: 22px;
          line-height: 1.25;
        }

        .subtitle {
          font-size: 18px;
        }

        .number {
          width: 2rem;
          height: 3rem;
        }

        .firstnum {
          width: 2rem;
          height: 2rem;
          font-size: 18px;
          padding: 1.5rem;
        }

        .description-title {
          font-size: 18px;
        }

        .decription-content {
          font-size: 18px;
        }

        .vertical-line {
          position: absolute;
          left: 50%;
          top: 100%;
          width: 1px;
          background: #666666;
          height: 8rem;
        }

        .vertical-line-2 {
          position: absolute;
          top: 100%;
          left: 50%;
          width: 1px;
          background: #666666;
          height: 7rem;
        }
      }

      @media(max-width:376px) {
        .work-image {
          border-radius: 15px;
        }

        .des-section {
          margin-top: 2rem;
        }

        .vertical-line {
          height: 8rem;
        }
      }

      @media(min-width:378px) and (max-width:576px) {
        .work-image {
          border-radius: 15px;
        }

        .des-section {
          margin-top: 2rem;
        }

        .vertical-line-2 {
          height: 8rem;
        }
      }

      @media (min-width:576px) and (max-width: 770px) {
        .one-text {
          font-size: 18px;
          text-align: justify;
        }

        .subtitle {
          font-size: 20px;
        }

        .second-text {
          text-align: justify;
          font-size: 18px;
        }

        .third-text {
          font-size: 18px;
        }

        .work-container {
          flex-direction: column;
          align-items: center;
          text-align: center;
          gap: 0.6rem;
        }

        .vertical-line-2 {
          position: absolute;
          top: 100%;
          left: 50%;
          width: 1px;
          background: #666666;
          height: 5rem;
        }

        .vertical-line {
          position: absolute;
          top: 100%;
          left: 50%;
          background: #666666;
          height: 7rem;
          width: 1px;
        }

        .work-image {
          width: 100%;
          border-radius: 15px;
          height: 30vh;
        }

        .des-section {
          margin-top: 2rem;
        }

        .work-body-section {
          justify-content: space-between;
        }

        .number {
          margin-bottom: 1rem;
        }

        .main-section {
          flex-direction: column;
        }
      }

      @media(min-width:780px) and (max-width:912px) {
        .work-image {
          border-radius: 15px;
          height: 30vh;
        }

        .des-section {
          margin-top: 2rem;
        }

        .vertical-line-2 {
          height: 7rem;
        }
      }

      @media(min-width:915px) and (max-width:1024px) {
        .row.align-items-center {
          display: flex;
          align-items: center;
        }

        .des-section {
          display: flex;
          flex-direction: column;
          padding-left: 5px !important;
          padding-right: 0px !important;
          padding-top: 1rem;
        }

        .work-section {
          width: 100%;
        }

        .work-container {
          align-items: flex-start !important;
        }

        .description-second {
          margin-bottom: 3.5rem !important;
        }

        .work-image {
          border-radius: 15px;
          height: 32vh;
          width: 100%;
        }

        .vertical-line-2 {
          position: absolute;
          top: 100%;
          left: 50%;
          width: 1px;
          background: #666666;
          height: 4rem;
        }

        .vertical-line {
          position: absolute;
          top: 100%;
          left: 50%;
          background: #666666;
          height: 7.5rem;
          width: 1px;
        }
      }

      @media (min-width: 1024px) and (min-height: 700px) and (max-height:1000px) {
        .row.align-items-center {
          display: flex;
          align-items: stretch;
          /* Ensuring rows are stretched to equal heights */
        }

        .heading-work {
          padding-right: 2rem;
        }

        .des-section {
          display: flex;
          flex-direction: column;
          padding-left: 5px;
          padding-right: 0px;
          padding-top: 2rem;
          height: 100%;
          /* Ensuring equal height */
        }

        .work-section {
          width: 66%;
          height: 100%;
          /* Ensuring equal height */
        }

        .work-container {
          display: flex;
          align-items: stretch;
          /* Ensuring equal height */
          justify-content: space-between;
        }

        .description-second {
          margin-bottom: 3rem;
        }

        .work-image {
          border-radius: 15px;
          height: 70vh;
          width: 100%;
        }

        .vertical-line-2 {
          position: absolute;
          top: 100%;
          left: 50%;
          width: 1px;
          background: #666666;
          height: 4rem;
        }

        .vertical-line {
          position: absolute;
          top: 100%;
          left: 50%;
          background: #666666;
          height: 6rem;
          width: 1px;
        }
      }

      @media (min-width: 1024px) and (min-height: 1100px) and (max-height:1400px) {
        .work-image {
          border-radius: 15px;
          height: 35vh;
          width: 100%;
        }

        .row.align-items-center {
          display: flex;
          align-items: stretch;
          /* Ensuring rows are stretched to equal heights */
        }

        .heading-work {
          padding-right: 2rem;
        }

        .des-section {
          display: flex;
          flex-direction: column;
          padding-left: 5px;
          padding-right: 0px;
          padding-top: 2rem;
          height: 100%;
          /* Ensuring equal height */
        }

        .work-section {
          width: 66%;
          height: 100%;
          /* Ensuring equal height */
        }

        .work-container {
          display: flex;
          align-items: stretch;
          /* Ensuring equal height */
          justify-content: space-between;
        }

        .description-second {
          margin-bottom: 3rem;
        }

        .vertical-line-2 {
          position: absolute;
          top: 100%;
          left: 50%;
          width: 1px;
          background: #666666;
          height: 4rem;
        }

        .vertical-line {
          position: absolute;
          top: 100%;
          left: 50%;
          background: #666666;
          height: 11rem;
          width: 1px;
        }
      }

      @media (min-width: 1024px) and (min-height: 300px) and (max-height:600px) {
        .row.align-items-center {
          display: flex;
          align-items: stretch;
          /* Ensuring rows are stretched to equal heights */
        }

        .heading-work {
          padding-right: 2rem;
        }

        .des-section {
          display: flex;
          flex-direction: column;
          padding-left: 5px;
          padding-right: 0px;
          padding-top: 2rem;
          height: 100%;
          /* Ensuring equal height */
        }

        .work-section {
          width: 66%;
          height: 100%;
          /* Ensuring equal height */
        }

        .work-container {
          display: flex;
          align-items: stretch;
          /* Ensuring equal height */
          justify-content: space-between;
        }

        .description-second {
          margin-bottom: 3rem;
        }

        .work-image {
          border-radius: 15px;
          height: 85vh;
          width: 100%;
        }

        .vertical-line-2 {
          position: absolute;
          top: 100%;
          left: 50%;
          width: 1px;
          background: #666666;
          height: 5rem;
        }

        .vertical-line {
          position: absolute;
          top: 100%;
          left: 50%;
          background: #666666;
          height: 11rem;
          width: 1px;
        }
      }

      @media (min-width: 1025px) and (max-width:1700px) {
        .row.align-items-center {
          display: flex;
        }

        .work-container-first {
          margin-bottom: 5rem !important;
        }

        .work-container-second {
          margin-bottom: 4rem !important;
        }

        .work-section {
          width: 65%;
          margin: auto;
        }

        .work-image {
          width: 100%;
          border-radius: 15px;
          height: 70vh;
        }

        .des-section {
          display: flex;
          flex-direction: column;
        }

        .vertical-line {
          position: absolute;
          left: 50%;
          top: 100%;
          width: 1px;
          background: #666666;
          height: 12rem;
        }

        .vertical-line-2 {
          position: absolute;
          top: 100%;
          left: 50%;
          width: 1px;
          background: #666666;
          height: 10rem;
        }
      }

      /*FAQ-section*/
      .faq-container {
        margin-bottom: 2rem;
      }

      .faq-heading {
        font-size: 2rem;
        font-weight: 700;
      }

      .faq-tagline {
        font-size: 1.25rem;
        font-weight: 500;
      }

      .first-answer,
      .second-answer,
      .third-answer,
      .fourth-answer,
      .fifth-answer {
        text-align: left;
        font-size: 18px;
      }

      .first-question,
      .second-question,
      .third-question,
      .fourth-question,
      .fifth-question {
        font-size: 20px;
      }

      @media(max-width:576px) {

        .first-question,
        .second-question,
        .third-question,
        .fourth-question,
        .fifth-question {
          font-size: 18px;
        }

        .faq-heading {
          font-size: 22px;
          line-height: 1.25;
        }

        .faq-tagline {
          font-size: 20px;
        }
      }

      /*Blog Section*/
      .text-blog {
        font-size: 18px
      }

      .headline-blog {
        font-size: 2rem;
        font-weight: 700;
      }

      .blog-cards {
        flex-wrap: nowrap;
        display: flex;
        justify-content: center;
      }

      .blog-tagline-section {
        font-size: 1.25rem;
        font-weight: 500;
      }

      @media(max-width:576px) {
        .headline-blog {
          font-size: 22px;
          line-height: 1.25;
        }

        .blog-tagline-section {
          font-size: 20px;
        }

        .blog-cards {
          flex-wrap: wrap;
        }
      }

      @media (min-width: 576px) and (max-width: 855px) {
        .blog-cards {
          display: flex;
          flex-wrap: wrap;
        }

        .blog-tagline-section {
          font-size: 1.25rem;
          font-weight: 500;
        }

        .blog-headline-section {
          padding-left: 3rem !important;
          padding-right: 3rem !important;
        }
      }

      @media(min-width:900px) and (max-width:1024px) {
        .head-section-blog {
          width: 100%;
          padding-left: 0px !important;
          padding-right: 0px !important;
        }

        .headline-blog {
          font-size: calc(1rem + 1.5vw);
          line-height: 1.25;
        }
      }

      @media(min-width:768px) {
        .blog-cards {
          display: flex;
          flex-wrap: wrap;
        }
      }

      @media(min-width:1200px) {
        .blog-cards {
          display: flex;
          justify-content: center;
          flex-wrap: nowrap;
          margin: auto;
        }
      }

      /*Testimonial Section*/
      /*CTA Section*/
      .valid-feedback {
        font-size: 18px;
      }

      .testimonial-headline {
        font-size: 2rem;
        font-weight: 700;
      }

      .testimonial-tagline {
        font-size: 1.25rem;
        font-weight: 500;
      }

      .valid-email {
        color: #fff;
        font-weight: bold;
      }

      #emailError {
        color: #fff !important;
      }

      .headline-cta {
        font-size: 2.5rem;
        font-weight: 700;
      }

      .tagline-cta {
        font-size: 1.25rem;
        font-weight: 500;
      }

      .cta-section {
        font-size: 18px;
      }

      .cta-text1 {
        color: white;
      }

      @media(max-width:576px) {
        .headline-cta {
          font-size: 22px;
          line-height: 1.25;
        }

        .tagline-cta {
          font-size: 18px;
          font-weight: 500;
        }
      }

      @media(min-width:576px) and (max-width:915px) {
        .headline-cta {
          font-size: calc(1.3rem + 2vw);
          line-height: 1.25;
        }
      }

      @media(max-width:576px) {
        .testimonial-headline {
          font-size: 22px;
          line-height: 1.25;
        }

        .testimonial-tagline {
          font-size: 20px;
        }

        .second-checkbox {
          margin-left: 14px;
        }

        .third-checkbox {
          margin-right: 8px;
        }
      }

      /*Footer Section*/
      .navbar-font-section {
        font-size: 18px;
      }

      .button-header-sections {
        gap: 1rem;
      }

      #ft-links {
        font-size: 18px !important;
      }

      .footer-one {
        gap: 0.2rem
      }

      .footer-section {
        padding-bottom: 0rem;
        padding-top: 4rem;
        padding-left: 3rem !important;
        padding-right: 3rem !important;
      }

      /*Blog Section*/
      .explore-section {
        display: flex;
        justify-content: center;
      }

      /*Pricing-Section*/
      .total {
        font-size: 18px;
      }

      .subtitle-label {
        font-size: 18px;
      }

      .text-label-input {
        font-size: 18px;
      }

      .radio-button-first {
        font-size: 18px;
      }

      .output-formats {
        font-size: 18px;
      }

      .pricing-section {
        width: 100%;
      }

      #calculatePriceBtn {
        font-size: 18px;
      }

      .price-text {
        text-align: center;
        font-size: 2rem;
        font-weight: 700;
      }

      .first-text {
        text-align: center;
        font-size: 1.25rem;
        font-weight: 500;
      }

      .pricing-calculate-section {
        display: flex;
        gap: 2rem;
        box-sizing: border-box;
        padding: 0 10px;
        position: relative;
        width: 100%;
        justify-content: center;
      }

      .inner-container {
        padding: 50px;
        border: 1px solid blueviolet;
        border-radius: 10px;
        background-color: #f9f9f9;
        width: 100%;
      }

      .first-title {
        margin-bottom: 20px;
        font-size: 1.5em;
        font-weight: bold;
      }

      .padding-checks {
        padding-left: 0rem !important;
        padding-right: 0rem !important;
      }

      .btn-calculate {
        margin-top: 10px;
        border-radius: 8px;
        padding: 8px;
        font-weight: 500;
        color: #fff;
        border-color: #8b3dff;
        background-color: #8b3dff;
        margin-left: 5rem;
        box-shadow: inset 0 3px 5px rgba(2, 6, 23, .125);
      }

      .field-container {
        margin-bottom: 15px;
      }

      .label-input {
        font-weight: 700;
        margin-bottom: 5px;
        position: relative;
        cursor: pointer;
      }

      .tooltip-wrapper {
        position: relative;
        display: inline-block;
      }

      .tooltip {
        visibility: hidden;
        width: 150px;
        background-color: #fff;
        color: #000000;
        text-align: center;
        border-radius: 6px;
        padding: 5px;
        position: absolute;
        z-index: 1;
        font-size: 16px;
        border: 1px solid #55555573;
        bottom: 125%;
        left: 50%;
        opacity: 0;
        transition: opacity 0.3s;
      }



      .tooltip::after {
        content: '';
        position: absolute;
        top: 100%;
        left: 50%;
        margin-left: -5px;
        border-width: 5px;
        border-style: solid;
        border-color: #333 transparent transparent transparent;
      }

      .info-icon {
        cursor: pointer;
      }

      .duration-input,
      .input-type-text,
      .input-type-select {
        padding: 10px;
        box-sizing: border-box;
        border: 1px solid #ccc;
        border-radius: 5px;
        width: 100%;
      }

      .price-content-body {
        margin-top: 25px;
      }

      .feature-section1 {
        display: flex;
        flex-direction: column;
        margin-top: 15px;
      }

      .feature {
        margin-left: 4px;
        margin-top: 15px;
        display: flex;
        align-items: center;
      }

      .feature-voice-section {
        margin-top: 15px;
      }

      .check-first {
        display: flex;
        flex-direction: row;
        margin-top: 10px;
        margin-left: 4px;
      }

      .check-second {
        margin-left: 5px;
      }

      .radio-button-first {
        margin-left: 4px;
        margin-top: 10px;
        display: flex;
        flex-direction: row;
      }

      .radio-button-second {
        margin-left: 15px;
      }

      .check-second input[type="checkbox"],
      .check1,
      .check2 {
        transform: scale(1.5);
        margin-right: 2px;
      }

      .check-first input[type="checkbox"] {
        transform: scale(1.5);
      }

      .vocal-label {
        margin-left: 2px;
      }

      .custom-voice-label {
        margin-left: 2px;
      }

      .radio-button-first input[type="radio"],
      .radio-button-second input[type="radio"] {
        transform: scale(1.5);
        margin-right: 2px;
      }

      .check-second input[type="checkbox"] {
        margin-right: 0px;
        transform: scale(1.5);
      }

      .radio-button-first {
        margin-left: 4px;
      }

      .check-second {
        margin-left: 15px;
      }

      .total-summary-section {
        border: 1px solid blueviolet;
        border-radius: 10px;
        background-color: #f9f9f9;
        width: 35%;
      }

      .price-total {
        margin-top: 5px;
        font-size: 18px;
      }

      .vocal-check {
        display: flex;
        justify-content: space-between;
        align-items: center;
      }

      .Music-check {
        margin-top: 8px;
        display: flex;
        justify-content: space-between;
        align-items: center;
      }

      .subtitle-check {
        margin-top: 8px;
        display: flex;
        justify-content: space-between;
        align-items: center;
      }

      .custom-voice-radio {
        margin-top: 8px;
        display: flex;
        justify-content: space-between;
        align-items: center;
      }

      .predefine-voice-radio {
        margin-top: 8px;
        display: flex;
        justify-content: space-between;
        align-items: center;
      }

      @media(max-width:476px) {
        .price-text {
          font-size: 22px;
          line-height: 1.25;
        }

        .first-text {
          font-size: 20px;
        }

        .check-second {
          margin-left: 15px;
        }

        label {
          font-size: 18px;
        }

        .check-first {
          margin-left: 10px;
        }

        .check-second input[type="checkbox"] {
          margin-right: 0px;
          transform: scale(1.5);
        }

        .radio-button-first {
          margin-left: 10px;
        }

        .inner-container {
          padding: 4px;
        }

        .pricing-calculate-section {
          padding: 0px 2px;
          display: flex;
          flex-direction: column;
        }

        .total-summary-section {
          width: 100%;
        }

        .label-input {
          font-weight: 500;
          margin-left: 5px;
        }

        .tooltip-wrapper input[type="checkbox"] {
          margin-left: 5px;
        }

        .summary-container {
          padding-top: 50px !important;
          border-radius: 20px !important;
          padding-left: 1rem !important;
          padding-right: 1rem !important;
        }

        .btn-calculate {
          display: flex;
          justify-content: center;
          margin: auto;
        }

        .voice-label {
          margin-left: 5px;
        }

      }

      @media(min-width:477px) and (max-width:700px) {
        .btn-calculate {
          display: flex;
          justify-content: center;
          margin: auto;
        }
      }

      @media (min-width: 480px) and (max-width:950px) {
        .pricing-calculate-section {
          flex-direction: column;
          justify-content: center;
        }

        .label-input {
          font-size: 18px;
        }

        .subtitle-label {
          font-size: 18px;
        }

        .text-label-input {
          font-size: 18px;
        }

        .output-formats {
          font-size: 18px;
        }

        .first-text {
          font-size: 20px;
        }

        .pricing-section {
          width: 100%;
        }

        .inner-container {
          width: 100%;
          padding: 30px;
        }

        .btn-calculate {
          display: flex;
          justify-content: center;
          margin: auto;
        }

        .summary-container {
          padding-top: 50px;
          padding-bottom: 8rem;
          padding-left: 50px;
          padding-right: 50px;
          border-radius: 20px;
        }

        .total-summary-section {
          width: 100%;
        }

        .check-second {
          margin-left: 15px;
        }

        .check-second input[type="checkbox"] {
          margin-right: 0px;
          transform: scale(1.5);
        }

        .check-first input[type="checkbox"] {
          margin-right: 2px;
        }

        .radio-button-first input[type="radio"] {
          margin-right: 5px;
        }

        .custom-voice-label {
          font-size: 18px;
        }

        .Predefined-voice-label {
          font-size: 18px;
        }

        .audio-opt {
          font-size: 18px;
        }

        .radio-button-second input[type="radio"] {
          margin-right: 2px;
        }
      }

      @media(min-width:1000px) and (max-width:1025px) and(min-height:1370px) {
        .total-summary-section {
          max-width: 35%;
        }

        .pricing-calculate-section {
          flex-direction: row;
          justify-content: center;
        }

        .summary-container {
          padding-top: 50px !important;
          padding-bottom: 8rem !important;
          padding-left: 5px !important;
          padding-right: 5px !important;
          border-radius: 20px !important;
        }

        .inner-container {
          padding: 50px;
          width: 100%;
        }
      }

      .summary-container {
        padding-top: 30px;
        padding-bottom: 6rem;
        padding-left: 25px;
        padding-right: 30px;
        border-radius: 20px;
      }

      .total-summary-section .inner-container {
        text-align: center;
      }

      @media(min-width:1025px) and (min-height:1370px) {
        .summary-container {
          padding-top: 50px;
          padding-bottom: 8rem;
          padding-left: 5px;
          padding-right: 5px;
          border-radius: 20px;
        }
      }



      .summary-heading {
        display: flex;
        justify-content: space-between;
        align-items: center;
      }

      .summary-title {
        font-size: 1.5rem;
        font-weight: bold;
      }

      .summary-content-container {
        display: flex;
        justify-content: space-between;
        margin-top: 20px;
        font-weight: 700;
        font-size: 18px;
      }

      .total-summary-content-container {
        display: flex;
        justify-content: space-between;
        margin-top: 50px;
        font-weight: 700;
        font-size: 18px;
      }

      .total-container {
        display: flex;
        justify-content: space-between;
        margin-top: 20px;
        font-weight: 700;
      }

      /* Hover effects for labels and icons */
      .tooltip-wrapper:hover .tooltip {
        visibility: visible;
        opacity: 1;
      }

      .horizontal-line {
        width: 100%;
        height: 1px;
        margin: 10px 0;
        background-color: black;
      }

      @media(min-width:1025px) and (max-width:1700px) {
        .price-text {
          padding-right: 3rem;
        }
      }

      /* testimonial section */
      .swiper-pagination-bullet {
        width: 20px;
        /* Increase bullet size */
        height: 20px;
        /* Increase bullet size */
        margin: 0 8px;
        /* Increase spacing between bullets */
      }

      .swiper-pagination-bullet-active {
        background-color: #007bff;
        /* Optional: Highlight active bullet */
      }

      .testnomial-font {
        font-weight: 600;
        color: #000000;
        font-size: 18px;
      }

      @media (pointer: coarse) {

        /* For touch devices */
        .swiper-pagination-bullet {
          width: 30px;
          /* Further increase size for touch devices */
          height: 30px;
        }
      }