body {
    margin: 0;
    padding: 0;
    font-family: 'Lato', sans-serif;
    box-sizing: border-box;
}

.backgroundimg-text {
    text-align: center;
    background-color: #454C57;
    color: #ffffff;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 90%;
    min-height: 437px;
    padding: 20px;
    border-radius: 40px 0px;
    margin: auto;
    margin-top: 4% !important;
}

.containerjd h1 {
    font-size: 36px;
    font-weight: 800;
    margin-top: 0% !important;
    margin-bottom: 20px;
    line-height: 55px;
    text-align: center;
}

.containerjd p {
    font-size: 22px;
    line-height: 1.6;
    margin: 0 auto;
}

/* tab section design */

.page-container-j {
    display: flex;
    justify-content: center;
    align-items: center;
}

.tabs-container-jd {
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 20px 25px;
    background-color: #f2f2f2;
    border-radius: 20px;
    margin: auto;
    width: 90%;
    margin-top: 20px;
}

.tabsjd {
    display: flex;
    gap: 35px;
    flex-wrap: nowrap;
}

.tabsjd a {
    text-decoration: none;
    color: #333;
    font-size: 18px;
    font-weight: bold;
    white-space: nowrap;
}

.tabsjd span {
    color: #A3A3A3;
    font-size: 20px;
}

.tabsjd a:hover {
    color: #40C6D6;
    text-decoration: underline;
}

.mbtabs-dropdownjd {
    display: none;
}

/* service section 1 caption and icons design */

.servicecap-1 {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: flex-start;
    padding: 25px;
    margin-top: 20px;
    position: relative;
}

.line-with-circle {
    position: absolute;
    left: 4%;
    top: -2%;
    height: 124%;
    display: flex;
    flex-direction: column;
    align-items: center;
}

.line-with-circle::before {
    content: '';
    height: 6%;
    background-color: #333;
}

.line-with-circle .circle-image {
    width: 14px;
    height: 14px;
}

.line-with-circle::after {
    content: '';
    width: 1px;
    height: 78%;
    background-color: #333;
}

.servicecap-1 .left-contentjd {
    max-width: 50%;
    position: relative;
    padding-left: 50px;
    margin-left: 2%;
}

.servicecap-1 .right-contentjd {
    max-width: 50%;
    text-align: center;
    padding-right: 4%;
}

.servicecap-1 h1 {
    font-size: 36px;
    margin: 10px 0 !important;
}

.servicecap-1 p {
    font-size: 22px;
    margin: 32px 0;
    line-height: 1.4;
}

.servicecap-1 .connect-btn {
    position: relative;
    display: inline-block;
    background: #40C6D6;
    color: white;
    text-decoration: none;
    border: none;
    padding: 12px 28px;
    border-radius: 25px;
    font-size: 20px;
    cursor: pointer;
    margin-right: 15px;
    font-weight: 400;
    text-transform: capitalize;
    box-shadow: 0 0 5px #40C6D6;
    overflow: hidden;
    transition: background-color 0.5s ease-in-out, color 0.5s ease-in-out, box-shadow 0.5s ease-in-out;
}

/* Hover Effect */
.servicecap-1 .connect-btn:hover {
    background: #414a56;
    color: white;
    box-shadow: 0 0 15px #40C6D6;
}

/* Vertical Lines */
.servicecap-1 .connect-btn::before,
.servicecap-1 .connect-btn::after {
    content: "";
    position: absolute;
    width: 2px;
    height: 0;
    transition: height 0.5s ease-in-out;
}

.servicecap-1 .connect-btn::before {
    right: 0;
    top: 0;
}

.servicecap-1 .connect-btn::after {
    left: 0;
    bottom: 0;
}

.servicecap-1 .connect-btn:hover::before,
.servicecap-1 .connect-btn:hover::after {
    height: 100%;
}

/* Horizontal Lines */
.servicecap-1 .connect-btn span {
    position: relative;
    display: block;
    width: 100%;
    height: 100%;
}

.servicecap-1 .connect-btn span::before,
.servicecap-1 .connect-btn span::after {
    content: "";
    position: absolute;
    width: 0;
    height: 2px;
    background: #40C6D6;
    box-shadow: 0 0 5px #40C6D6;
    transition: width 0.5s ease-in-out;
}

.servicecap-1 .connect-btn span::before {
    left: 0;
    top: 0;
}

.servicecap-1 .connect-btn span::after {
    right: 0;
    bottom: 0;
}

.servicecap-1 .connect-btn:hover span::before,
.servicecap-1 .connect-btn:hover span::after {
    width: 100%;
}


.servicecap-1 .case-studies {
    text-decoration: none;
    color: #333;
    font-size: 20px;
    display: inline;
}

.servicecap-1 img {
    max-width: 573px;
    width: 100%;
    height: auto;
}

/* Button Container Section 1 */

.btn-container-jd {
    display: grid;
    gap: 34px;
    margin-top: 30px;
    margin-left: 7%;
    align-items: center;
}

.btn-itemjd {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 35px;
    width: 300px;
    height: 70px;
    border: 1px solid #40C6D6;
    border-radius: 4px;
    text-decoration: none;
    padding: 10px 20px;
    color: #333;
    font-size: 20px;
}

.btn-itemjd img {
    width: 36px;
    height: 36px;
}

.btn-itemjd p {
    margin: 0;
    font-size: 18px;
}

.btn-itemjd:hover {
    background-color: #454C57;
    color: #fff !important;
}

/* service section 2 caption and icons design */

.servicecap-2 {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: flex-start;
    background-color: #fff;
    padding: 25px 25px 30px 25px;
    margin-top: 20px;
    position: relative;
}

.line-with-circle2 {
    position: absolute;
    left: 4%;
    top: 0%;
    height: 120%;
    display: flex;
    flex-direction: column;
    align-items: center;
}

.line-with-circle2::before {
    content: '';
    height: 6%;
    background-color: #ffffff;
    width: 1px;
}

.line-with-circle2 .circle-image {
    width: 14px;
    height: 14px;
}

.line-with-circle2::after {
    content: '';
    width: 1px;
    height: 78%;
    background-color: #ffffff;
}

.servicecap-2 .left-contentjd2 {
    max-width: 50%;
    position: relative;
    padding-left: 50px;
    margin-left: 2%;
}

.servicecap-2 .left-contentjd2 p {
    color: #fff;
}

.servicecap-2 .right-contentjd2 {
    max-width: 50%;
    text-align: center;
    padding-right: 4%;
    margin-top: 1%;
}

.servicecap-2 h1 {
    font-size: 36px;
    margin: 18px 0 !important;
    color: #fff;
}

.servicecap-2 p {
    font-size: 22px;
    margin: 32px 0;
    line-height: 1.4;
}

.servicecap-2 .connect-btn2 {
    position: relative;
    display: inline-block;
    background: #40C6D6;
    color: white;
    text-decoration: none;
    border: none;
    padding: 12px 28px;
    border-radius: 25px;
    font-size: 20px;
    cursor: pointer;
    margin-right: 15px;
    font-weight: 400;
    text-transform: capitalize;
    box-shadow: 0 0 5px #40C6D6;
    overflow: hidden;
    transition: background-color 0.5s ease-in-out, color 0.5s ease-in-out, box-shadow 0.5s ease-in-out;
}

/* Hover Effect */
.servicecap-2 .connect-btn2:hover {
    background: #414a56;
    color: white;
    box-shadow: 0 0 15px #40C6D6;
}

/* Vertical Lines */
.servicecap-2 .connect-btn2::before,
.servicecap-2 .connect-btn2::after {
    content: "";
    position: absolute;
    width: 2px;
    height: 0;
    transition: height 0.5s ease-in-out;
}

.servicecap-2 .connect-btn2::before {
    right: 0;
    top: 0;
}

.servicecap-2 .connect-btn2::after {
    left: 0;
    bottom: 0;
}

.servicecap-2 .connect-btn2:hover::before,
.servicecap-2 .connect-btn2:hover::after {
    height: 100%;
}

/* Horizontal Lines */
.servicecap-2 .connect-btn2 span {
    position: relative;
    display: block;
    width: 100%;
    height: 100%;
}

.servicecap-2 .connect-btn2 span::before,
.servicecap-2 .connect-btn2 span::after {
    content: "";
    position: absolute;
    width: 0;
    height: 2px;
    background: #40C6D6;
    box-shadow: 0 0 5px #40C6D6;
    transition: width 0.5s ease-in-out;
}

.servicecap-2 .connect-btn2 span::before {
    left: 0;
    top: 0;
}

.servicecap-2 .connect-btn2 span::after {
    right: 0;
    bottom: 0;
}

.servicecap-2 .connect-btn2:hover span::before,
.servicecap-2 .connect-btn2:hover span::after {
    width: 100%;
}

.servicecap-2 .case-studies2 {
    text-decoration: none;
    color: #ffffff;
    font-size: 20px;
}

.servicecap-2 img {
    max-width: 573px;
    width: 100%;
    height: auto;
}

/* Button Container Section 2 */

.btn-container-jd2 {
    /* display: flex;
    flex-wrap: wrap; */
    display: grid;
    gap: 34px;
    margin-top: 30px;
    margin-left: 7%;
    align-items: center;
}

.btn-itemjd2 {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 35px;
    width: 300px;
    height: 70px;
    border: 1px solid #40C6D6;
    border-radius: 4px;
    text-decoration: none;
    padding: 10px 20px;
    color: #333;
    font-size: 20px;
    background-color: #ffffff;
}

.btn-itemjd2 img {
    width: 36px;
    height: 36px;
}

.btn-itemjd2 p {
    margin: 0;
    font-size: 18px;
}

.btn-itemjd2:hover {
    background-color: #454C57;
    color: #fff !important;
}

/* service section 3 caption and icons design */

.servicecap-3 {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: flex-start;
    padding: 25px 25px 30px 25px;
    position: relative;
}

.line-with-circle3 {
    position: absolute;
    left: 4%;
    top: -1%;
    height: 121%;
    display: flex;
    flex-direction: column;
    align-items: center;
}

.line-with-circle3::before {
    content: '';
    height: 6%;
    background-color: #333;
    width: 1%;
}

.line-with-circle3 .circle-image {
    width: 14px;
    height: 14px;
}

.line-with-circle3::after {
    content: '';
    width: 1px;
    height: 78%;
    background-color: #333;
}

.servicecap-3 .left-contentjd3 {
    max-width: 50%;
    position: relative;
    padding-left: 50px;
    margin-left: 2%;
}

.servicecap-3 .right-contentjd3 {
    max-width: 50%;
    text-align: center;
    padding-right: 4%;
    margin-top: 1%;
}

.servicecap-3 h1 {
    font-size: 36px;
    margin: 18px 0 !important;
}

.servicecap-3 p {
    font-size: 22px;
    margin: 32px 0;
    line-height: 1.4;
}

.servicecap-3 .connect-btn3 {
    position: relative;
    display: inline-block;
    background: #40C6D6;
    color: white;
    text-decoration: none;
    border: none;
    padding: 12px 28px;
    border-radius: 25px;
    font-size: 20px;
    cursor: pointer;
    margin-right: 15px;
    font-weight: 400;
    text-transform: capitalize;
    box-shadow: 0 0 5px #40C6D6;
    overflow: hidden;
    transition: background-color 0.5s ease-in-out, color 0.5s ease-in-out, box-shadow 0.5s ease-in-out;
}

/* Hover Effect */
.servicecap-3 .connect-btn3:hover {
    background: #414a56;
    color: white;
    box-shadow: 0 0 15px #40C6D6;
}

/* Vertical Lines */
.servicecap-3 .connect-btn3::before,
.servicecap-3 .connect-btn3::after {
    content: "";
    position: absolute;
    width: 2px;
    height: 0;
    transition: height 0.5s ease-in-out;
}

.servicecap-3 .connect-btn3::before {
    right: 0;
    top: 0;
}

.servicecap-3 .connect-btn3::after {
    left: 0;
    bottom: 0;
}

.servicecap-3 .connect-btn3:hover::before,
.servicecap-3 .connect-btn3:hover::after {
    height: 100%;
}

/* Horizontal Lines */
.servicecap-3 .connect-btn3 span {
    position: relative;
    display: block;
    width: 100%;
    height: 100%;
}

.servicecap-3 .connect-btn3 span::before,
.servicecap-3 .connect-btn3 span::after {
    content: "";
    position: absolute;
    width: 0;
    height: 2px;
    background: #40C6D6;
    box-shadow: 0 0 5px #40C6D6;
    transition: width 0.5s ease-in-out;
}

.servicecap-3 .connect-btn3 span::before {
    left: 0;
    top: 0;
}

.servicecap-3 .connect-btn3 span::after {
    right: 0;
    bottom: 0;
}

.servicecap-3 .connect-btn3:hover span::before,
.servicecap-3 .connect-btn3:hover span::after {
    width: 100%;
}

.servicecap-3 .case-studies3 {
    text-decoration: none;
    color: #333;
    font-size: 20px;
}

.servicecap-3 img {
    max-width: 573px;
    width: 100%;
    height: auto;
}

/* Button Container Section 3 */

.btn-container-jd3 {
    display: grid;
    gap: 34px;
    margin-top: 30px;
    margin-left: 7%;
    align-items: center;
}

.btn-itemjd3 {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 35px;
    width: 300px;
    height: 70px;
    border: 1px solid #40C6D6;
    border-radius: 4px;
    text-decoration: none;
    padding: 10px 20px;
    color: #333;
    font-size: 20px;
}

.btn-itemjd3 img {
    width: 36px;
    height: 36px;
}

.btn-itemjd3 p {
    margin: 0;
    font-size: 18px;
}

.btn-itemjd3:hover {
    background-color: #454C57;
    color: #fff !important;
}

/* service section 4 caption and icons design */

.servicecap-4 {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: flex-start;
    background-color: #fff;
    padding: 25px 25px 30px 25px;
    margin-top: 20px;
    position: relative;
}

.line-with-circle4 {
    position: absolute;
    left: 4%;
    top: 0%;
    height: 120%;
    display: flex;
    flex-direction: column;
    align-items: center;
}

.line-with-circle4::before {
    content: '';
    height: 8%;
    background-color: #ffffff;
    width: 1px;
}

.line-with-circle4 .circle-image {
    width: 14px;
    height: 14px;
}

.line-with-circle4::after {
    content: '';
    width: 1px;
    height: 78%;
    background-color: #ffffff;
}

.servicecap-4 .left-contentjd4 {
    max-width: 50%;
    position: relative;
    padding-left: 50px;
    margin-left: 2%;
}

.servicecap-4 .left-contentjd4 p {
    color: #fff;
}

.servicecap-4 .right-contentjd4 {
    max-width: 50%;
    text-align: center;
    padding-right: 2%;
    margin-top: 1%;
}

.servicecap-4 h1 {
    font-size: 36px;
    margin: 18px 0 !important;
    color: #fff;
}

.servicecap-4 p {
    font-size: 22px;
    margin: 32px 0;
    line-height: 1.4;
}

.servicecap-4 .connect-btn4 {
    position: relative;
    display: inline-block;
    background: #40C6D6;
    color: white;
    text-decoration: none;
    border: none;
    padding: 12px 28px;
    border-radius: 25px;
    font-size: 20px;
    cursor: pointer;
    margin-right: 15px;
    font-weight: 400;
    text-transform: capitalize;
    box-shadow: 0 0 5px #40C6D6;
    overflow: hidden;
    transition: background-color 0.5s ease-in-out, color 0.5s ease-in-out, box-shadow 0.5s ease-in-out;
}

/* Hover Effect */
.servicecap-4 .connect-btn4:hover {
    background: #414a56;
    color: white;
    box-shadow: 0 0 15px #40C6D6;
}

/* Vertical Lines */
.servicecap-4 .connect-btn4::before,
.servicecap-4 .connect-btn4::after {
    content: "";
    position: absolute;
    width: 2px;
    height: 0;
    transition: height 0.5s ease-in-out;
}

.servicecap-4 .connect-btn4::before {
    right: 0;
    top: 0;
}

.servicecap-4 .connect-btn4::after {
    left: 0;
    bottom: 0;
}

.servicecap-4 .connect-btn4:hover::before,
.servicecap-4 .connect-btn4:hover::after {
    height: 100%;
}

/* Horizontal Lines */
.servicecap-4 .connect-btn4 span {
    position: relative;
    display: block;
    width: 100%;
    height: 100%;
}

.servicecap-4 .connect-btn4 span::before,
.servicecap-4 .connect-btn4 span::after {
    content: "";
    position: absolute;
    width: 0;
    height: 2px;
    background: #40C6D6;
    box-shadow: 0 0 5px #40C6D6;
    transition: width 0.5s ease-in-out;
}

.servicecap-4 .connect-btn4 span::before {
    left: 0;
    top: 0;
}

.servicecap-4 .connect-btn4 span::after {
    right: 0;
    bottom: 0;
}

.servicecap-4 .connect-btn4:hover span::before,
.servicecap-4 .connect-btn4:hover span::after {
    width: 100%;
}

.servicecap-4 .case-studies4 {
    text-decoration: none;
    color: #ffffff;
    font-size: 20px;
}

.servicecap-4 img {
    max-width: 573px;
    width: 100%;
    height: auto;
}

/* Button Container Section 4 */

.btn-container-jd4 {
    display: grid;
    gap: 34px;
    margin-top: 30px;
    margin-left: 7%;
    align-items: center;
}

.btn-itemjd4 {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 35px;
    width: 300px;
    height: 70px;
    border: 1px solid #40C6D6;
    border-radius: 4px;
    text-decoration: none;
    padding: 10px 20px;
    color: #333;
    font-size: 20px;
    background-color: #ffffff;
}

.btn-itemjd4 img {
    width: 36px;
    height: 36px;
}

.btn-itemjd4 p {
    margin: 0;
    font-size: 18px;
}

.btn-itemjd4:hover {
    background-color: #454C57;
    color: #fff !important;
}

/* service section 5 caption and icons design */

.servicecap-5 {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: flex-start;
    padding: 25px 25px 30px 25px;
    position: relative;
}

.line-with-circle5 {
    position: absolute;
    left: 4%;
    top: 0%;
    height: 120%;
    display: flex;
    flex-direction: column;
    align-items: center;
}

.line-with-circle5::before {
    content: '';
    height: 6%;
    background-color: #333;
    width: 1%;
}

.line-with-circle5 .circle-image {
    width: 14px;
    height: 14px;
}

.line-with-circle5::after {
    content: '';
    width: 1px;
    height: 78%;
    background-color: #333;
}

.servicecap-5 .left-contentjd5 {
    max-width: 50%;
    position: relative;
    padding-left: 50px;
    margin-left: 2%;
}

.servicecap-5 .right-contentjd5 {
    max-width: 50%;
    text-align: center;
    padding-right: 2%;
    margin-top: 1%;
}

.servicecap-5 h1 {
    font-size: 36px;
    margin: 18px 0 !important;
}

.servicecap-5 p {
    font-size: 22px;
    margin: 32px 0;
    line-height: 1.4;
}

.servicecap-5 .case-studies5 {
    text-decoration: none;
    color: #333;
    font-size: 20px;
}

.servicecap-5 img {
    max-width: 573px;
    width: 100%;
    height: auto;
}

/* Button Container Section 5 */

.btn-container-jd5 {
    display: grid;
    gap: 34px;
    margin-top: 30px;
    margin-left: 7%;
    align-items: center;
}

.btn-itemjd5 {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 35px;
    width: 300px;
    height: 70px;
    border: 1px solid #40C6D6;
    border-radius: 4px;
    text-decoration: none;
    padding: 10px 20px;
    color: #333;
    font-size: 20px;
}

.btn-itemjd5 img {
    width: 36px;
    height: 36px;
}

.btn-itemjd5 p {
    margin: 0;
    font-size: 18px;
}

.btn-itemjd5:hover {
    background-color: #454C57;
    color: #fff !important;
}

/* service section 6 caption and icons design */

.servicecap-6 {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: flex-start;
    background-color: #fff;
    padding: 25px 25px 30px 25px;
    margin-top: 20px;
    position: relative;
}

.line-with-circle6 {
    position: absolute;
    left: 4%;
    top: -1%;
    height: 120%;
    display: flex;
    flex-direction: column;
    align-items: center;
}

.line-with-circle6::before {
    content: '';
    height: 8%;
    background-color: #ffffff;
    width: 1px;
}

.line-with-circle6 .circle-image {
    width: 14px;
    height: 14px;
}

.line-with-circle6::after {
    content: '';
    width: 1px;
    height: 78%;
    background-color: #ffffff;
}

.servicecap-6 .left-contentjd6 {
    max-width: 50%;
    position: relative;
    padding-left: 50px;
    margin-left: 2%;
}

.servicecap-6 .left-contentjd6 p {
    color: #fff;
}

.servicecap-6 .right-contentjd6 {
    max-width: 50%;
    text-align: center;
    padding-right: 4%;
    margin-top: 1%;
}

.servicecap-6 h1 {
    font-size: 36px;
    margin: 24px 0 !important;
    color: #fff;
}

.servicecap-6 p {
    font-size: 22px;
    margin: 32px 0;
    line-height: 1.4;
}

.servicecap-6 .case-studies6 {
    text-decoration: none;
    color: #ffffff;
    font-size: 20px;
}

.servicecap-6 img {
    max-width: 573px;
    width: 100%;
    height: auto;
}

/* Button Container Section 6 */

.btn-container-jd6 {
    display: grid;
    gap: 34px;
    margin-top: 30px;
    margin-left: 7%;
    align-items: center;
}

.btn-itemjd6 {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 35px;
    width: 300px;
    height: 70px;
    border: 1px solid #40C6D6;
    border-radius: 4px;
    text-decoration: none;
    padding: 10px 20px;
    color: #333;
    font-size: 20px;
    background-color: #ffffff;
}

.btn-itemjd6 img {
    width: 36px;
    height: 36px;
}

.btn-itemjd6 p {
    margin: 0;
    font-size: 18px;
}

.btn-itemjd6:hover {
    background-color: #454C57;
    color: #fff !important;
}

/* service section 7 caption and icons design */

.servicecap-7 {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: flex-start;
    padding: 25px 25px 30px 25px;
    position: relative;
}

.line-with-circle7 {
    position: absolute;
    left: 4%;
    top: -1%;
    height: 120%;
    display: flex;
    flex-direction: column;
    align-items: center;
}

.line-with-circle7::before {
    content: '';
    height: 6%;
    background-color: #333;
    width: 1%;
}

.line-with-circle7 .circle-image {
    width: 14px;
    height: 14px;
}

.line-with-circle7::after {
    content: '';
    width: 1px;
    height: 78%;
    background-color: #333;
}

.servicecap-7 .left-contentjd7 {
    max-width: 50%;
    position: relative;
    padding-left: 50px;
    margin-left: 2%;
}

.servicecap-7 .right-contentjd7 {
    max-width: 50%;
    text-align: center;
    padding-right: 4%;
    margin-top: 1%;
}

.servicecap-7 h1 {
    font-size: 36px;
    margin: 10px 0 !important;
}

.servicecap-7 p {
    font-size: 22px;
    margin: 32px 0;
    line-height: 1.4;
}

.servicecap-7 .case-studies7 {
    text-decoration: none;
    color: #333;
    font-size: 20px;
}

.servicecap-7 img {
    max-width: 573px;
    width: 100%;
    height: auto;
}

/* Button Container Section 7 */

.btn-container-jd7 {
    display: grid;
    gap: 34px;
    margin-top: 30px;
    margin-left: 7%;
    align-items: center;
}

.btn-itemjd7 {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 35px;
    width: 300px;
    height: 70px;
    border: 1px solid #40C6D6;
    border-radius: 4px;
    text-decoration: none;
    padding: 10px 20px;
    color: #333;
    font-size: 20px;
}

.btn-itemjd7 img {
    width: 36px;
    height: 36px;
}

.btn-itemjd7 p {
    margin: 0;
    font-size: 18px;
}

.btn-itemjd7:hover {
    background-color: #454C57;
    color: #fff !important;
}

/* service section 8 caption and icons design */

.servicecap-8 {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: flex-start;
    background-color: #fff;
    padding: 25px 25px 30px 25px;
    margin-top: 20px;
    position: relative;
}

.line-with-circle8 {
    position: absolute;
    left: 4%;
    top: 0%;
    height: 120%;
    display: flex;
    flex-direction: column;
    align-items: center;
}

.line-with-circle8::before {
    content: '';
    height: 8%;
    background-color: #ffffff;
    width: 1px;
}

.line-with-circle8 .circle-image {
    width: 14px;
    height: 14px;
}

.line-with-circle8::after {
    content: '';
    width: 1px;
    height: 78%;
    background-color: #ffffff;
}

.servicecap-8 .left-contentjd8 {
    max-width: 50%;
    position: relative;
    padding-left: 50px;
    margin-left: 2%;
}

.servicecap-8 .left-contentjd8 p {
    color: #fff;
}

.servicecap-8 .right-contentjd8 {
    max-width: 50%;
    text-align: center;
    padding-right: 2%;
    margin-top: 1%;
}

.servicecap-8 h1 {
    font-size: 36px;
    margin: 35px 0 !important;
    color: #fff;
}

.servicecap-8 p {
    font-size: 22px;
    margin: 32px 0;
    line-height: 1.4;
}

.servicecap-8 .case-studies8 {
    text-decoration: none;
    color: #ffffff;
    font-size: 20px;
}

.servicecap-8 img {
    max-width: 573px;
    width: 100%;
    height: auto;
}

/* Button Container Section 8 */

.btn-container-jd8 {
    display: grid;
    gap: 34px;
    margin-top: 30px;
    margin-left: 7%;
    align-items: center;
}

.btn-itemjd8 {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 35px;
    width: 300px;
    height: 70px;
    border: 1px solid #40C6D6;
    border-radius: 4px;
    text-decoration: none;
    padding: 10px 20px;
    color: #333;
    font-size: 20px;
    background-color: #ffffff;
}

.btn-itemjd8 img {
    width: 36px;
    height: 36px;
}

.btn-itemjd8 p {
    margin: 0;
    font-size: 18px;
}

.btn-itemjd8:hover {
    background-color: #454C57;
    color: #fff !important;
}

/* Responsive Design */

@media only screen and (max-width: 640px) {

    .tabs-container-jd {
        display: none;
    }

    .mbtabs-dropdownjd {
        position: relative;
        display: inline-block;
        width: 90%;
        margin: auto;
        padding-top: 20px;
    }

    .jdtabs-toggle-btn {
        display: flex !important;
        align-items: center;
        justify-content: space-between;
        width: 100%;
        padding: 10px;
        font-size: 16px;
        background-color: #333;
        color: white;
        border: none;
        border-radius: 4px;
        cursor: pointer;
        position: relative;
        margin: auto !important;
    }

    .jdtabs-toggle-btn::after {
        content: "▼";
        font-size: 12px;
        transition: transform 0.3s ease;
        position: absolute;
        right: 15px;
    }

    #dropdown-toggle {
        display: none;
    }

    .mbtabs-dropdownjd ul {
        position: absolute;
        top: 100%;
        left: 0;
        width: 100%;
        margin: 0;
        padding: 0;
        list-style: none;
        background-color: #333;
        border-radius: 4px;
        max-height: 0;
        overflow: hidden;
        transition: max-height 0.3s ease-in-out;
    }

    #dropdown-toggle:checked~ul {
        max-height: 50vh;
        z-index: 1;
    }

    #dropdown-toggle:checked+label::after {
        transform: rotate(180deg);
    }

    .mbtabs-dropdownjd ul li {
        border-bottom: 1px solid #444;
    }

    .mbtabs-dropdownjd ul li:last-child {
        border-bottom: none;
    }

    .mbtabs-dropdownjd ul li a {
        display: block;
        padding: 10px;
        color: white;
        text-decoration: none;
    }

    .mbtabs-dropdownjd ul li a:hover {
        background-color: #555;
    }
}

@media (max-width: 767px) {

    button.connect-btn,
    button.connect-btn2,
    button.connect-btn3,
    button.connect-btn4,
    button.connect-btn5,
    button.connect-btn6,
    button.connect-btn7,
    button.connect-btn8 {
        padding: 9px !important;
        font-size: 16px !important;
    }

    body {
        font-size: 14px;
    }

    .line-with-circle,
    .line-with-circle2,
    .line-with-circle3,
    .line-with-circle4,
    .line-with-circle5,
    .line-with-circle6,
    .line-with-circle7,
    .line-with-circle8 {
        display: none;
    }

    .mbtabs-dropdownjd {
        display: block;
        width: 90%;
        margin: auto;
        padding-top: 20px;
    }

    .backgroundimg-text {
        flex-direction: column;
        text-align: left;
        padding: 20px;
        min-height: 325px;
    }

    .containerjd h1 {
        font-size: 24px;
        line-height: 1.3 !important;
    }

    .containerjd p {
        font-size: 14px;
        line-height: 1.5 !important;
        text-align: center;
    }

    .servicecap-1 .case-studies,
    .servicecap-2 .case-studies2,
    .servicecap-3 .case-studies3,
    .servicecap-4 .case-studies4,
    .servicecap-5 .case-studies5,
    .servicecap-6 .case-studies6,
    .servicecap-7 .case-studies7,
    .servicecap-8 .case-studies8 {
        font-size: 17px;
    }

    /* Service Section 1 */
    .servicecap-1 {
        flex-direction: column;
        padding: 10px 20px 20px 20px;
        align-items: center;
    }

    .servicecap-1 .left-contentjd {
        max-width: 100%;
        padding-left: 0;
        margin-left: 0;
        text-align: center;
        margin-bottom: 7%;
    }

    .servicecap-1 .right-contentjd {
        max-width: 100% !important;
        text-align: center;
        padding-right: 0% !important;
    }

    .servicecap-1 h1 {
        font-size: 24px;
        margin: 10px 0;
    }

    .servicecap-1 p {
        font-size: 14px;
        margin: 20px 0;
        text-align: center;
    }

    .btn-container-jd {
        margin-left: 0%;
        width: 100% !important;
    }

    .btn-itemjd {
        width: 100% !important;
        height: 60px;
        padding: 10px 20px;
    }

    .btn-itemjd img {
        width: 30px;
        height: 30px;
    }

    /* Service Section 2 */
    .servicecap-2 {
        flex-direction: column;
        padding: 20px 20px 28px 20px;
        background-color: #454C57;
        margin-top: 20px;
        align-items: center;
        display: block;
    }

    .servicecap-2 .left-contentjd2 {
        max-width: 100%;
        padding-left: 0;
        margin-left: 0;
        text-align: center;
        margin-bottom: 7%;
    }

    .servicecap-2 .right-contentjd2 {
        max-width: 100% !important;
        text-align: center;
        padding-right: 0% !important;
    }

    .servicecap-2 h1 {
        font-size: 24px;
        color: white;
    }

    .servicecap-2 p {
        font-size: 14px;
        margin: 20px 0;
        text-align: center;
    }

    .btn-container-jd2 {
        margin-left: 0%;
    }

    .btn-itemjd2 {
        width: 100% !important;
        height: 60px;
        padding: 10px 20px;
    }

    .btn-itemjd2 img {
        width: 30px;
        height: 30px;
    }

    .servicecap-1 .connect-btn .servicecap-2 .case-studies2 .servicecap-3 .case-studies3 .servicecap-3 .case-studies3 .servicecap-4 .case-studies4 .servicecap-5 .case-studies5 .servicecap-6 .case-studies6 .servicecap-7 .case-studies7 .servicecap-8 .case-studies8 {
        font-size: 18px !important;
    }

    .servicecap-1 .connect-btn .servicecap-2 .connect-btn2 .servicecap-3 .connect-btn3 .servicecap-4 .connect-btn4 .servicecap-5 .connect-btn5 .servicecap-6 .connect-btn6 .servicecap-7 .connect-btn7 .servicecap-8 .connect-btn8 {
        font-size: 16px !important;
    }

    /* Service Section 3 */
    .servicecap-3 {
        flex-direction: column;
        padding: 20px 20px 28px 20px;
        background-color: #ffffff;
        align-items: center;
        display: block;
    }

    .servicecap-3 .left-contentjd3 {
        max-width: 100%;
        padding-left: 0;
        margin-left: 0;
        text-align: center;
        margin-bottom: 7%;
    }

    .servicecap-3 .right-contentjd3 {
        max-width: 100% !important;
        text-align: center;
        padding-right: 0% !important;
    }

    .servicecap-3 h1 {
        font-size: 24px;
    }

    .servicecap-3 p {
        font-size: 14px;
        margin: 20px 0;
    }

    .btn-container-jd3 {
        margin-left: 0%;
    }

    .btn-itemjd3 {
        width: 100% !important;
        height: 60px;
        padding: 10px 20px;
    }

    .btn-itemjd3 img {
        width: 30px;
        height: 30px;
    }

    /* Service Section 4 */
    .servicecap-4 {
        flex-direction: column;
        padding: 20px 20px 28px 20px;
        background-color: #454C57;
        margin-top: 20px;
        align-items: center;
        display: block;
    }

    .servicecap-4 .left-contentjd4 {
        max-width: 100%;
        padding-left: 0;
        margin-left: 0;
        text-align: center;
        margin-bottom: 7%;
    }

    .servicecap-4 .right-contentjd4 {
        max-width: 100% !important;
        text-align: center;
        padding-right: 0% !important;
    }

    .servicecap-4 h1 {
        font-size: 24px;
        color: white;
    }

    .servicecap-4 p {
        font-size: 14px;
        margin: 20px 0;
        text-align: center;
    }

    .btn-container-jd4 {
        margin-left: 0%;
    }

    .btn-itemjd4 {
        width: 100% !important;
        height: 60px;
        padding: 10px 20px;
    }

    .btn-itemjd4 img {
        width: 30px;
        height: 30px;
    }

    /* Service Section 5 */
    .servicecap-5 {
        flex-direction: column;
        padding: 20px 20px 28px 20px;
        background-color: #ffffff;
        align-items: center;
        display: block;
    }

    .servicecap-5 .left-contentjd5 {
        max-width: 100%;
        padding-left: 0;
        margin-left: 0;
        text-align: center;
        margin-bottom: 7%;
    }

    .servicecap-5 .right-contentjd5 {
        max-width: 100% !important;
        text-align: center;
        padding-right: 0% !important;
    }

    .servicecap-5 h1 {
        font-size: 24px;
    }

    .servicecap-5 p {
        font-size: 14px;
        margin: 20px 0;
        text-align: center;
    }

    .btn-container-jd5 {
        margin-left: 0%;
    }

    .btn-itemjd5 {
        width: 100% !important;
        height: 60px;
        padding: 10px 20px;
    }

    .btn-itemjd5 img {
        width: 30px;
        height: 30px;
    }

    /* Service Section 6 */
    .servicecap-6 {
        flex-direction: column;
        padding: 20px 20px 28px 20px;
        background-color: #454C57;
        margin-top: 20px;
        align-items: center;
        display: block;
    }

    .servicecap-6 .left-contentjd6 {
        max-width: 100%;
        padding-left: 0;
        margin-left: 0;
        text-align: center;
        margin-bottom: 7%;
    }

    .servicecap-6 .right-contentjd6 {
        max-width: 100% !important;
        text-align: center;
        padding-right: 0% !important;
    }

    .servicecap-6 h1 {
        font-size: 24px;
        color: white;
    }

    .servicecap-6 p {
        font-size: 14px;
        margin: 20px 0;
        text-align: center;
    }

    .btn-container-jd6 {
        margin-left: 0%;
    }

    .btn-itemjd6 {
        width: 100% !important;
        height: 60px;
        padding: 10px 20px;
    }

    .btn-itemjd6 img {
        width: 30px;
        height: 30px;
    }

    /* Service Section 7 */
    .servicecap-7 {
        flex-direction: column;
        padding: 20px 20px 28px 20px;
        background-color: #ffffff;
        align-items: center;
        display: block;
    }

    .servicecap-7 .left-contentjd7 {
        max-width: 100%;
        padding-left: 0;
        margin-left: 0;
        text-align: center;
        margin-bottom: 7%;
    }

    .servicecap-7 .right-contentjd7 {
        max-width: 100% !important;
        text-align: center;
        padding-right: 0% !important;
    }

    .servicecap-7 h1 {
        font-size: 24px;
    }

    .servicecap-7 p {
        font-size: 14px;
        margin: 20px 0;
        text-align: center;
    }

    .btn-container-jd7 {
        margin-left: 0%;
    }

    .btn-itemjd7 {
        width: 100% !important;
        height: 60px;
        padding: 10px 20px;
    }

    .btn-itemjd7 img {
        width: 30px;
        height: 30px;
    }

    /* Service Section 8 */
    .servicecap-8 {
        flex-direction: column;
        padding: 20px 20px 28px 20px;
        background-color: #454C57;
        margin-top: 20px;
        align-items: center;
        display: block;
    }

    .servicecap-8 .left-contentjd8 {
        max-width: 100%;
        padding-left: 0;
        margin-left: 0;
        text-align: center;
        margin-bottom: 7%;
    }

    .servicecap-8 .right-contentjd8 {
        max-width: 100% !important;
        text-align: center;
        padding-right: 0% !important;
    }

    .servicecap-8 h1 {
        font-size: 24px;
        color: white;
    }

    .servicecap-8 p {
        font-size: 14px;
        margin: 20px 0;
        text-align: center;
    }

    .btn-container-jd8 {
        margin-left: 0%;
    }

    .btn-itemjd8 {
        width: 100% !important;
        height: 60px;
        padding: 10px 20px;
    }

    .btn-itemjd8 img {
        width: 30px;
        height: 30px;
    }
}

@media only screen and (min-width: 769px) {
    .mbtabs-dropdownjd {
        display: none;
    }
}

@media only screen and (min-width: 768px) {

    .servicecap-1 .connect-btn,
    .servicecap-2 .connect-btn2,
    .servicecap-3 .connect-btn3,
    .servicecap-4 .connect-btn4,
    .servicecap-5 .connect-btn5,
    .servicecap-6 .connect-btn6,
    .servicecap-7 .connect-btn7,
    .servicecap-8 .connect-btn8 {
        font-size: 18px !important;
    }

    .servicecap-1 .case-studies,
    .servicecap-2 .case-studies2,
    .servicecap-3 .case-studies3,
    .servicecap-4 .case-studies4,
    .servicecap-5 .case-studies5,
    .servicecap-6 .case-studies6,
    .servicecap-7 .case-studies7,
    .servicecap-8 .case-studies8 {
        font-size: 18px !important;
    }
}

@media screen and (min-width: 821px) and (max-width: 1024px) {
    .backgroundimg-text {
        flex-direction: row;
        padding: 20px;
        min-height: 400px;
    }

    .tabs-container-jd {
        padding: 15px;
        gap: 0px;
    }

    .servicecap-1,
    .servicecap-2,
    .servicecap-3,
    .servicecap-4 .servicecap-5,
    .servicecap-6,
    .servicecap-7,
    .servicecap-8 {
        padding: 20px 20px 28px 20px;
    }

    .btn-container-jd,
    .btn-container-jd2,
    .btn-container-jd3,
    .btn-container-jd4,
    .btn-container-jd5,
    .btn-container-jd6,
    .btn-container-jd7,
    .btn-container-jd8 {
        gap: 20px !important;
        margin-left: 7% !important;
        grid-template-columns: repeat(3, 1fr) !important;
    }

    .btn-itemjd,
    .btn-itemjd2,
    .btn-itemjd3,
    .btn-itemjd4,
    .btn-itemjd5,
    .btn-itemjd6,
    .btn-itemjd7,
    .btn-itemjd8 {
        width: 290px !important;
    }

    .tabsjd a {
        font-size: 14px !important;
    }

    .tabsjd span {
        font-size: 18px !important;
    }

    .tabsjd {
        display: flex;
        gap: 12px !important;
        flex-wrap: nowrap;
    }

    .line-with-circle {
        top: -3% !important;
        height: 124% !important;
    }

    .containerjd h1 {
        line-height: 45px;
        text-align: center;
    }

    .containerjd p {
        font-size: 20px;
    }

}

@media screen and (min-width: 1281px) and (max-width: 1366px) {

    .btn-itemjd,
    .btn-itemjd2,
    .btn-itemjd3,
    .btn-itemjd4,
    .btn-itemjd5,
    .btn-itemjd6,
    .btn-itemjd7,
    .btn-itemjd8 {
        width: 260px !important;
    }
}

@media screen and (min-width: 1025px) and (max-width: 1280px) {
    .backgroundimg-text {
        padding: 25px;
        min-height: 450px;
    }

    .btn-container-jd,
    .btn-container-jd2,
    .btn-container-jd3,
    .btn-container-jd4,
    .btn-container-jd5,
    .btn-container-jd6,
    .btn-container-jd7,
    .btn-container-jd8 {
        gap: 34px 20px;
        grid-template-columns: repeat(4, 1fr);
    }

    .btn-itemjd,
    .btn-itemjd2,
    .btn-itemjd3,
    .btn-itemjd4,
    .btn-itemjd5,
    .btn-itemjd6,
    .btn-itemjd7,
    .btn-itemjd8 {
        width: 260px !important;
    }

    .tabs-container-jd {
        padding: 10px 15px;
    }

    .tabsjd {
        gap: 22px !important;
        flex-wrap: wrap;
    }

    .tabsjd a {
        font-size: 16px;
    }

    .tabsjd span {
        font-size: 20px;
    }

    .line-with-circle4::before {
        height: 6% !important;
    }

    .line-with-circle5::before {
        height: 8% !important;
    }

}

@media screen and (min-width: 1281px) and (max-width: 1366px) {

    .btn-container-jd,
    .btn-container-jd2,
    .btn-container-jd3,
    .btn-container-jd4,
    .btn-container-jd5,
    .btn-container-jd6,
    .btn-container-jd7,
    .btn-container-jd8 {
        gap: 34px 50px;
    }
}

@media screen and (min-width: 1367px) and (max-width: 1440px) {

    .btn-container-jd,
    .btn-container-jd2,
    .btn-container-jd3,
    .btn-container-jd4,
    .btn-container-jd5,
    .btn-container-jd6,
    .btn-container-jd7,
    .btn-container-jd8 {
        gap: 34px 22px;
    }
    .line-with-circle6::before {
        height: 7% !important;
    }
    .line-with-circle3::before {
        height: 4% !important;
     }
}

@media screen and (min-width: 1281px) and (max-width: 1536px) {
    .backgroundimg-text {
        padding: 30px;
        min-height: 500px;
    }

    .btn-container-jd,
    .btn-container-jd2,
    .btn-container-jd3,
    .btn-container-jd4,
    .btn-container-jd5,
    .btn-container-jd6,
    .btn-container-jd7,
    .btn-container-jd8 {
        grid-template-columns: repeat(4, 1fr);
        margin-left: 5%;
    }

    .tabs-container-jd {
        padding: 10px 15px;
    }

    .tabsjd {
        gap: 28px !important;
        flex-wrap: wrap;
    }

    .tabsjd a {
        font-size: 16px;
    }

    .tabsjd span {
        font-size: 20px;
    }
}

@media screen and (min-width: 1537px) and (max-width: 1920px) {
    .backgroundimg-text {
        padding: 40px;
        /* min-height: 550px; */
    }

    .btn-container-jd,
    .btn-container-jd2,
    .btn-container-jd3,
    .btn-container-jd4,
    .btn-container-jd5,
    .btn-container-jd6,
    .btn-container-jd7,
    .btn-container-jd8 {
        gap: 34px 49px;
        margin-left: 5%;
        grid-template-columns: repeat(5, 1fr);
    }

    .tabs-container-jd {
        padding: 15px 20px;
    }

    .tabsjd {
        gap: 45px;
    }

    .tabsjd a {
        font-size: 20px;
    }

    .tabsjd span {
        font-size: 25px;
    }

}

.servicecap-5 .connect-btn5,
.servicecap-6 .connect-btn6,
.servicecap-7 .connect-btn7,
.servicecap-8 .connect-btn8 {
    position: relative;
    display: inline-block;
    background: #40C6D6;
    color: white;
    text-decoration: none;
    border: none;
    padding: 12px 28px;
    border-radius: 25px;
    font-size: 20px;
    cursor: pointer;
    margin-right: 15px;
    font-weight: 400;
    text-transform: capitalize;
    box-shadow: 0 0 5px #40C6D6;
    overflow: hidden;
    transition: background-color 0.5s ease-in-out, color 0.5s ease-in-out, box-shadow 0.5s ease-in-out;
}

.servicecap-5 .connect-btn5:hover,
.servicecap-6 .connect-btn6:hover,
.servicecap-7 .connect-btn7:hover,
.servicecap-8 .connect-btn8:hover {
    background: #414a56;
    color: white;
    box-shadow: 0 0 15px #40C6D6;
}

.servicecap-5 .connect-btn5::before,
.servicecap-5 .connect-btn5::after,
.servicecap-6 .connect-btn6::before,
.servicecap-6 .connect-btn6::after,
.servicecap-7 .connect-btn7::before,
.servicecap-7 .connect-btn7::after,
.servicecap-8 .connect-btn8::before,
.servicecap-8 .connect-btn8::after {
    content: "";
    position: absolute;
    width: 2px;
    height: 0;
    transition: height 0.5s ease-in-out;
}

.servicecap-5 .connect-btn5::before,
.servicecap-6 .connect-btn6::before,
.servicecap-7 .connect-btn7::before,
.servicecap-8 .connect-btn8::before {
    right: 0;
    top: 0;
}

.servicecap-5 .connect-btn5::after,
.servicecap-6 .connect-btn6::after,
.servicecap-7 .connect-btn7::after,
.servicecap-8 .connect-btn8::after {
    left: 0;
    bottom: 0;
}

.servicecap-5 .connect-btn5:hover::before,
.servicecap-5 .connect-btn5:hover::after,
.servicecap-6 .connect-btn6:hover::before,
.servicecap-6 .connect-btn6:hover::after,
.servicecap-7 .connect-btn7:hover::before,
.servicecap-7 .connect-btn7:hover::after,
.servicecap-8 .connect-btn8:hover::before,
.servicecap-8 .connect-btn8:hover::after {
    height: 100%;
}

.servicecap-5 .connect-btn5 span,
.servicecap-6 .connect-btn6 span,
.servicecap-7 .connect-btn7 span,
.servicecap-8 .connect-btn8 span {
    position: relative;
    display: block;
    width: 100%;
    height: 100%;
}

.servicecap-5 .connect-btn5 span::before,
.servicecap-5 .connect-btn5 span::after,
.servicecap-6 .connect-btn6 span::before,
.servicecap-6 .connect-btn6 span::after,
.servicecap-7 .connect-btn7 span::before,
.servicecap-7 .connect-btn7 span::after,
.servicecap-8 .connect-btn8 span::before,
.servicecap-8 .connect-btn8 span::after {
    content: "";
    position: absolute;
    width: 0;
    height: 2px;
    background: #40C6D6;
    box-shadow: 0 0 5px #40C6D6;
    transition: width 0.5s ease-in-out;
}

.servicecap-5 .connect-btn5 span::before,
.servicecap-6 .connect-btn6 span::before,
.servicecap-7 .connect-btn7 span::before,
.servicecap-8 .connect-btn8 span::before {
    left: 0;
    top: 0;
}

.servicecap-5 .connect-btn5 span::after,
.servicecap-6 .connect-btn6 span::after,
.servicecap-7 .connect-btn7 span::after,
.servicecap-8 .connect-btn8 span::after {
    right: 0;
    bottom: 0;
}

.servicecap-5 .connect-btn5:hover span::before,
.servicecap-5 .connect-btn5:hover span::after,
.servicecap-6 .connect-btn6:hover span::before,
.servicecap-6 .connect-btn6:hover span::after,
.servicecap-7 .connect-btn7:hover span::before,
.servicecap-7 .connect-btn7:hover span::after,
.servicecap-8 .connect-btn8:hover span::before,
.servicecap-8 .connect-btn8:hover span::after {
    width: 100%;
}

.servicecap-1 .connect-btn a,
.servicecap-2 .connect-btn2 a,
.servicecap-3 .connect-btn3 a,
.servicecap-4 .connect-btn4 a,
.servicecap-5 .connect-btn5 a,
.servicecap-6 .connect-btn6 a,
.servicecap-7 .connect-btn7 a,
.servicecap-8 .connect-btn8 a {
    color: white !important;
}

.servicecap-1 .right-contentjd,
.servicecap-2 .right-contentjd2,
.servicecap-3 .right-contentjd3,
.servicecap-4 .right-contentjd4,
.servicecap-5 .right-contentjd5,
.servicecap-6 .right-contentjd6,
.servicecap-7 .right-contentjd7,
.servicecap-8 .right-contentjd8 {
    max-width: 45%;
}

@media screen and (min-width: 768px) and (max-width: 820px) {
    .containerjd h1 {
        font-size: 26px !important;
        letter-spacing: normal;
    }

    .containerjd p {
        font-size: 18px !important;
    }

    .tabs-container-jd {
        padding: 10px 25px !important;
    }

    .tabsjd {
        gap: 10px !important;
    }

    .tabsjd a {
        font-size: 13px !important;
    }

    .tabsjd span {
        font-size: 18px !important;
    }

    .servicecap-1 h1,
    .servicecap-2 h1,
    .servicecap-3 h1,
    .servicecap-4 h1,
    .servicecap-5 h1,
    .servicecap-6 h1,
    .servicecap-7 h1,
    .servicecap-8 h1 {
        font-size: 24px !important;
    }

    .servicecap-1 p,
    .servicecap-2 p,
    .servicecap-3 p,
    .servicecap-4 p,
    .servicecap-5 p,
    .servicecap-6 p,
    .servicecap-7 p,
    .servicecap-8 p {
        font-size: 16px !important;
        margin: 20px 0 !important;
    }

    .servicecap-1 .connect-btn,
    .servicecap-2 .connect-btn2,
    .servicecap-3 .connect-btn3,
    .servicecap-4 .connect-btn4,
    .servicecap-5 .connect-btn5,
    .servicecap-6 .connect-btn6,
    .servicecap-7 .connect-btn7,
    .servicecap-8 .connect-btn8 {
        font-size: 14px !important;
        padding: 8px 25px !important;
    }

    .servicecap-1 .case-studies,
    .servicecap-2 .case-studies2,
    .servicecap-3 .case-studies3,
    .servicecap-4 .case-studies4,
    .servicecap-5 .case-studies5,
    .servicecap-6 .case-studies6,
    .servicecap-7 .case-studies7,
    .servicecap-8 .case-studies8 {
        font-size: 14px !important;
    }

    .line-with-circle {
        top: -3% !important;
        height: 124% !important;
    }

    .btn-container-jd,
    .btn-container-jd2,
    .btn-container-jd3,
    .btn-container-jd4,
    .btn-container-jd5,
    .btn-container-jd6,
    .btn-container-jd7,
    .btn-container-jd8 {
        display: grid;
        grid-template-columns: auto auto !important;
    }

    .line-with-circle2::before {
        content: '';
        height: 5% !important;
    }

    .line-with-circle3 {
        top: 0% !important;
    }

    .line-with-circle3::before {
        content: '';
        height: 2% !important;
    }

    .line-with-circle3::after {
        height: 81% !important;
    }

    .line-with-circle4::before {
        content: '';
        height: 6% !important;
    }

    .line-with-circle4 {
        height: 125% !important;
    }

    .line-with-circle6 {
        top: 0% !important;
    }

    .line-with-circle7 {
        top: 0% !important;
        height: 118% !important;
    }

    .line-with-circle7::before {
        content: '';
        height: 5% !important;
    }
   
        
}