/* 
Theme Name: Strandls
Theme URI: https://strandls.com/
Description: Make Genomic Sequencing Accessible to Everyone
Author: SDA Digital
Author URI: https://syeddanishali.com/
Template: hello-elementor
Version: 2.0.0
Text Domain: strandls
License: GNU General Public License v3 or later.
License URI: https://www.gnu.org/licenses/gpl-3.0.html
Tags: Genomics, DNA sequencing, Cancer, Oncology, Bioinformatics, Liquid biopsy, Precision medicine, Early detection, Healthcare
*/
@media (max-width: 1280px){
#strand_journey .swiper-slide-active .insidedesc
 {
    margin-top: 103px!important;
}
#strand_journey .swiper-slide-active .orange_line, #strand_journey .swiper-slide-active .red_line, #strand_journey .swiper-slide-active .green_line, #strand_journey .swiper-slide-active .blue_line  {height: 19.85vw!important;}
}
@media (max-width: 1366px) {
  #grad_left_line {width:10px!important;}
}
@media only screen and (max-width: 600px) {
    html, body {
  overflow-x: hidden!important;
}
    #sqf-flow .elementor-widget-image-box:not(:nth-child(6n))::before{display:none!important;}
    #grad_left_line {width:10px!important;}
    #cpr .card-body {
    padding: 0px;
}
    #sqf-flow .elementor-widget-image-box:not(:nth-child(6n))::after {display:none!important;}
    .klge_scroll {
        max-height: none;
        height: auto;
        position: relative;
    }
	.sequencing_services {
    transform: rotate(0deg)!important;
}
    #strand_journey .orange_line, #strand_journey .red_line, #strand_journey .green_line, #strand_journey .blue_line  {
height: 24vw!important; 
}
#strand_journey .swiper-slide-active .orange_line, #strand_journey .swiper-slide-active .red_line, #strand_journey .swiper-slide-active .green_line, #strand_journey .swiper-slide-active .blue_line  {
height: 59vw!important; 
}
    #strand_journey .swiper-slide-active .insidedesc {
    margin-top: 35px!important;
}
#strand_journey .swiper-slide-active .mrg_top_134 .insidedesc {
    margin-top: 66px!important;
}
    .elementor-10 .elementor-element.elementor-element-ba9670d::before{background-image:none;}
    .scroll {
    max-height: 450px;
    overflow-x: auto!important;
    overflow-y: auto!important;
  -webkit-overflow-scrolling: touch;
}
  #onc_inner_accord .card-wrapper {
    margin: 0px;
}
   .responsive-table {
  width: 100%;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}
.res-table table {
      font-size: 14px;
    }
.responsive-table table {
  width: 100%;
  border-collapse: collapse;
  min-width: 600px; /* Force horizontal scroll on small screens */
}

.responsive-table th,
.responsive-table td {
  border: 1px solid #ddd;
  text-align: left;
  padding: 8px;
}
  }
  
/* END media only screen and (max-width: 600px) */
@media (min-width: 1024px) {
  #header {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    width: 100%;
    z-index: 9999;
  }

  body {
    padding-top: 67px;
  }
}
.res-table {
    overflow-x: auto;
  }

  .res-table table {
    width: 100%;
    border-collapse: collapse;
    min-width: 600px;
  }

  .res-table th,
  .res-table td {
    border: 1px solid #fff;
    padding: 12px;
    text-align: left;
  }

  .res-table thead {
    background-color: #d8f0f8;
  }
  .res-table table thead:first-child tr:first-child th {
  border-block-start: none !important;
}

.orange_line,
.red_line,
.blue_line,
.green_line {
  width: 40px;
  height: 3px;
  margin-bottom: 8px;
}

.orange_line {
  background-color: #f58620;
}

.red_line {
  background-color: #ea1e33;
}

.blue_line {
  background-color: #00608a;
}

.green_line {
  background-color: #008d61;
}

#strand-gradient-border:before{
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: linear-gradient(to right, #f58620, #ea1e33, #00608a, #008d61);
    z-index: -1;
    padding: 2px; /* Border thickness */
    border-radius: 5px;
    -webkit-mask: 
        linear-gradient(#fff 0 0) content-box, 
        linear-gradient(#fff 0 0);
    mask: 
        linear-gradient(#fff 0 0) content-box, 
        linear-gradient(#fff 0 0);
    -webkit-mask-composite: xor;
    mask-composite: exclude;
}
.strand-gradient-border{border-radius: 5px;}
.strand-gradient-border::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: -1;
    padding: 2px; /* Border thickness */
    border-radius: 5px;
    -webkit-mask: 
        linear-gradient(#fff 0 0) content-box, 
        linear-gradient(#fff 0 0);
    mask: 
        linear-gradient(#fff 0 0) content-box, 
        linear-gradient(#fff 0 0);
    -webkit-mask-composite: xor;
    mask-composite: exclude;
}

.strand-gradient-border:hover::before {
    background: linear-gradient(to right, #f58620, #ea1e33, #00608a, #008d61);
}


/* Tab: Evidence Gathering */
.tab-nav.active[data-tab="tab-0e8c73f"] {
  background-color: #feede1 !important;
}
.tab-nav.active[data-tab="tab-0e8c73f"] svg path {
  fill: #f58620 !important;
}
.tab-nav.active[data-tab="tab-0e8c73f"] .tab-title,
.tab-nav.active[data-tab="tab-0e8c73f"] .tab-description {
  color: #f58620 !important;
}

/* Tab: Variant Classification */
.tab-nav.active[data-tab="tab-ae35d20"] {
  background-color: #fcebef !important;
}
.tab-nav.active[data-tab="tab-ae35d20"] svg path {
  fill: #ea1e33 !important;
}
.tab-nav.active[data-tab="tab-ae35d20"] .tab-title,
.tab-nav.active[data-tab="tab-ae35d20"] .tab-description {
  color: #ea1e33 !important;
}

/* Tab: Clinical Interpretation */
.tab-nav.active[data-tab="tab-90c5d6d"] {
  background-color: #e1f2ea !important;
}
.tab-nav.active[data-tab="tab-90c5d6d"] svg path {
  fill: #008d61 !important;
}
.tab-nav.active[data-tab="tab-90c5d6d"] .tab-title,
.tab-nav.active[data-tab="tab-90c5d6d"] .tab-description {
  color: #008d61 !important;
}

/* Tab: Expert Review */
.tab-nav.active[data-tab="tab-12de489"] {
  background-color: #feede1 !important;
}
.tab-nav.active[data-tab="tab-12de489"] svg path {
  fill: #f58620 !important;
}
.tab-nav.active[data-tab="tab-12de489"] .tab-title,
.tab-nav.active[data-tab="tab-12de489"] .tab-description {
  color: #f58620 !important;
}


.border12{border-radius:12px!important;}
.pdl20 {
  padding-left: 20px !important;
}
#sqf-flow .elementor-widget-image-box:not(:nth-child(6n))::after {
  content: '';
  position: absolute;
  top: 50%;
  right: -20px; /* Adjust spacing between columns */
  width: 40px;   /* Line length */
  height: 1px;
  border-top: 2px dashed #a9a9a9; /* Dashed line */
  transform: translateY(-50%);
}

#sqf-flow .elementor-widget-image-box:not(:nth-child(6n))::before {
  content: '➔'; /* Arrow symbol */
  position: absolute;
  top: 50%;
  right: -28px;
  transform: translateY(-50%);
  font-size: 14px;
  color: #a9a9a9;
}


#flag-icons li:first-child::before {
  content: "";
  position: absolute;
  bottom: -4px; 
  left: 50%;
  transform: translateX(-50%);
  width: 15px; 
  height: 2px;
  background-color: rgb(47, 90, 143); 
  border-radius: 1px;
}

#insight_tab .e-n-tab-title[aria-selected="true"]:before{background:none;}

.ani_btn{
    text-underline-offset: 4px;
  text-decoration-thickness: 1.5px;
}
.strand_arrow_icon img {
  display: inline-block;
  transition: transform 0.3s ease;
  transform-origin: center center;
}

#NGSTargetedGrid .bl-content:hover .strand_arrow_icon img {
  transform: rotate(45deg) !important;
}

#NGSTargetedGrid .bl-content:hover h4 {
  color: #005f89 !important;
}

#NGSTargetedGrid .bl-content h4 {
  transition: color 0.3s ease;
}


.table-scroll {
  width: 100%;
  overflow-x: auto;
}

/* Ensure all borders are removed */
.4col-table,
.4col-table * {
  border: none !important;
  border-style: none !important;
  border-width: 0 !important;
  border-color: transparent !important;
  box-shadow: none !important;
}

.4col-table {
  width: 100%;
  border-collapse: collapse;
  min-width: 600px;
  margin-bottom: 20px;
  font-family: Arial, sans-serif;
  background: transparent;
}

.4col-table th,
.4col-table td {
  padding: 8px;
  text-align: left;
  background: transparent;
}

.4col-table th {
  background-color: #f2f2f2;
  font-weight: bold;
}

/* Mobile Responsive */
@media screen and (max-width: 768px) {
  .4col-table thead {
    display: none;
  }

  .4col-table,
  .4col-table tbody,
  .4col-table tr,
  .4col-table td {
    display: block;
    width: 100%;
  }

  .4col-table tr {
    margin-bottom: 15px;
    padding: 10px;
    background-color: #fff;
  }

  .4col-table td {
    text-align: right;
    padding-left: 50%;
    position: relative;
  }

  .4col-table td::before {
    content: attr(data-label);
    position: absolute;
    left: 10px;
    width: 45%;
    padding-right: 10px;
    font-weight: bold;
    text-align: left;
  }
}


#filter-tags .filter-tag {
  position: relative;
  padding: 10px 30px;
  border: 2px solid transparent;
  border-radius: 8px;
  background-clip: padding-box;
  background-color: #f9f7f7;
  color: #000;
  font-size: 20px;
  cursor: pointer;
  transition: all 0.3s ease;
}

/* Active/Hover state with gradient border */
#filter-tags .filter-tag.active,
#filter-tags .filter-tag:hover {
  color: #000!important;
  border: 2px solid transparent;
  background-image: linear-gradient(#fff, #fff),
                    linear-gradient(to right, #f58620, #ea1e33, #00608a, #008d61)!important;
  background-origin: border-box;
  background-clip: padding-box, border-box;
  border-color: transparent !important;
}

#filter-tags .filter-tag:focus {
  outline: none !important;
  box-shadow: none !important;
  background-color: #fff !important;
}


.cancer-type-filter,
#filter-all {
  position: relative;
  padding: 10px 20px;
  border: 2px solid transparent;
  border-radius: 8px;
  background-clip: padding-box;
  background-color: #f9f7f7!important;
  color: #000;
  font-size: 18px;
  cursor: pointer;
  transition: all 0.3s ease;
}

/* Active/Hover state with gradient border */
.cancer-type-filter.active,
.cancer-type-filter:focus,
.cancer-type-filter:hover,
#filter-all.active,
#filter-all:hover {
  color: #000!important;
  border: 2px solid transparent!important;
  background-image: linear-gradient(#fff, #fff), 
                    linear-gradient(to right, #f58620, #ea1e33, #00608a, #008d61)!important;
  background-origin: border-box;
  background-clip: padding-box, border-box;
  border-color: transparent !important; /* Ensures no red flash */
}

.cancer-type-filter:focus,
#filter-all:focus {
  outline: none !important;
  box-shadow: none !important;
  background-color: #fff !important;
}


#tablepress-21 {
  table-layout: auto !important;
}

#tablepress-21 td:nth-child(6),
#tablepress-21 th:nth-child(6) {
  display: none !important;
}
#tablepress-21 colgroup col:nth-child(6) {
  display: none !important;
}

#tablepress-22 {
  table-layout: auto !important;
}

#tablepress-22 td:nth-child(6),
#tablepress-22 th:nth-child(6) {
  display: none !important;
}
#tablepress-22 colgroup col:nth-child(6) {
  display: none !important;
}

.bulletpoint {padding:0px!important;} 
.bulletpoint li {
    list-style: none; /* Remove default bullet */
    position: relative;
    padding-left: 60px; /* Space for the image */
    padding-bottom:40px;
}

.bulletpoint li::before {
    content: "";
    position: absolute;
    left: 0;
    top: 5px;
    width: 39px; /* Adjust width of image */
    height: 34px; /* Adjust height of image */
    background-image: url('/wp-content/uploads/2025/04/bullet-icon.png'); /* Replace with your image path */
    background-size: contain;
    background-repeat: no-repeat;
}

.sticky-sidebar {
    position: sticky;
    top: 120px; /* Adjust based on your header height */
    max-height: calc(100vh - 120px); /* Prevent overflow */
    overflow-y: auto; /* Allow scrolling inside sidebar */
}
#klge_loop_card .category-articles, .category-case-studies, .category-posters, .category-publications, .category-webinars, .category-white-papers{
border-radius: 5px;
}

#klge_loop_card .category-articles, #SearchResults .category-articles{
    border-left: 5px solid #E42634!important;
}
#klge_loop_card .category-case-studies, #SearchResults .category-case-studies{
    border-left: 5px solid #5B7184!important;
}
#klge_loop_card .category-posters, #SearchResults .category-posters{
    border-left: 5px solid #038A62!important;
}
#klge_loop_card .category-publications, #SearchResults .category-publications{
    border-left: 5px solid #005f89!important;
}
#klge_loop_card .category-webinars, #SearchResults .category-webinars{
    border-left: 5px solid #f68521!important;
}
#klge_loop_card .category-white-papers, #SearchResults .category-white-papers{
    border-left: 5px solid #005f89!important;
}
#SearchResults .oncology{
    border-left: 5px solid #E42634!important;
}
#SearchResults .rdrh{
    border-left: 5px solid #5B7184!important;
}
#SearchResults .research{
    border-left: 5px solid #038A62!important;
}
#SearchResults .page{
    border-left: 5px solid #005f89!important;
}
/* Even more specific selectors */
.category-webinars .elementor-post-info li:first-child span {
    color: #f68521 !important;
}

.category-articles .elementor-post-info li:first-child span {
    color: #E42634 !important;
}

.category-case-studies .elementor-post-info li:first-child span {
    color: #5B7184 !important;
}

.category-posters .elementor-post-info li:first-child span {
    color: #038A62 !important;
}

.category-publications .elementor-post-info li:first-child span {
    color: #005f89 !important;
}

.category-white-papers .elementor-post-info li:first-child span {
    color: #005f89 !important;
}

#articles_post_content{font-size: 20px; word-break: break-word!important;}
#articles_post_content ul.wp-block-list, #articles_post_content ol.wp-block-list {
  margin-bottom: 20px!important;
  word-break: break-word!important;
}
#articles_post_content li {
  margin-bottom: 20px;
  word-break: break-word!important;
}
#articles_post_content ol li::marker {
    font-size: inherit; /* Inherit the font size from the parent */
    font-weight: 700; /* Match heading weight */
    color: #000; /* Optional: Set to match heading color */
}

#publications_post_content ul.wp-block-list, #articles_post_content ol.wp-block-list {
  margin-bottom: 20px!important;
  word-break: break-word!important;
}
.elementor-widget-text-editor ul, .elementor-widget-text-editor ol{
    margin-bottom: 20px!important;
    padding: 20px!important;
}
.white_black, .white_black h2, .white_black h3, .white_black h4, .white_black h5, .white_black h6, .white_black p, .white_black a{color:#fff;}
.white_black a:hover{color:#000;}
.orange{color:#f68521;}
.blue{color:#005F89;}
#articles_post_content a, #publications_post_content a {
    color: #0d6efd;
    text-decoration: underline;
}
#upcoming_webnair ul, #upcoming_webnair ul li {
    list-style-type: none!important;
  margin: 0 0 10px 0!important;
  padding: 0!important;
}

        /* Sidebar */
        .klge_hub_sidebar {
            width: 100%;
            padding: 20px;
            background: #fff;
            border-radius: 8px;
            margin-right: 20px;
        }

        .klge_hub_search-bar input {
            width: 100%;
            padding: 10px;
            border: 1px solid #ddd;
            border-radius: 5px;
            margin-bottom: 20px;
        }

        .klge_hub_filter-section {
            margin-bottom: 20px;
        }

        .klge_hub_filter-section h4 {
            margin-bottom: 10px;
        }

        .klge_hub_filter-section label {
            display: block;
            flex-grow: 0;
  font-family: Barlow;
  font-size: 18px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: 22px;
  letter-spacing: normal;
  text-align: left;
  color: #000;
  margin-bottom: 20px;
        }
      .klge_hub_filter-section [type=checkbox]{
            width: 18px;
  height: 18px;
  flex-grow: 0;
  border-radius: 3px;
  border: solid 0.5px #b4b4b4;
  margin-right: 10px;
      }

        /* Main Content */
        .klge_hub_main-content {
            flex: 1;
            background: #fff;
            padding: 20px;
            border-radius: 8px;
        }
#klge_hub_search {
    width: 100%;
    padding: 10px 15px 10px 40px; /* Add left padding for icon */
    border: 1px solid #ccc;
    border-radius: 5px;
    background: url('/wp-content/uploads/2025/02/sea@3x.png') no-repeat left 10px center;
    background-size: 20px; /* Adjust size */
    outline: none;
}

    .klge_hub_sidebar h4{
            flex-grow: 0;
  margin: 0 293px 16px 0;
  font-family: Barlow;
  font-size: 18px;
  font-weight: 500;
  font-stretch: normal;
  font-style: normal;
  line-height: 2;
  letter-spacing: normal;
  text-align: left;
  color: #000;
        }
/* Container (similar to .klge_hub_tabs) */
#klge_hub_tabs .e-filter {
    display: flex;
    flex-wrap: wrap; /* Allows wrapping on smaller screens */
    gap: 10px;
    margin-bottom: 20px;
    overflow-x: auto; /* Enables horizontal scrolling if needed */
    white-space: nowrap;
    padding-bottom: 5px; /* Space for scroll indication */
}

/* Filter Buttons (similar to .klge_hub_tab) */
#klge_hub_tabs .e-filter-item {
    position: relative;
    margin: 0 8px 20px 0; /* Spacing between buttons */
    padding: 9.5px 21.7px 10.4px 22.5px; /* Button padding */
    border: none;
    background: #f9f7f7; /* Default background */
    border-radius: 5px;
    cursor: pointer;
    overflow: hidden;
    z-index: 0;
    transition: color 0.3s ease, background 0.3s ease;
    font-size: 16px;
    font-weight: 400;
    font-stretch: normal;
    font-style: normal;
    line-height: normal;
    letter-spacing: normal;
    text-align: center;
    color: #2a2a2a;
}

/* Hover & Active State */
#klge_hub_tabs .e-filter-item:hover,
#klge_hub_tabs .e-filter-item[aria-pressed="true"] {
    color: black;
    background: white;
}

/* Gradient Border on Hover & Active */
#klge_hub_tabs .e-filter-item:hover::before,
#klge_hub_tabs .e-filter-item[aria-pressed="true"]::before,
#klge_hub_tabs .e-filter-item[aria-pressed="true"]:focus::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: linear-gradient(to right, #f58620, #ea1e33, #00608a, #008d61);
    z-index: -1;
    padding: 2px; /* Border thickness */
    border-radius: 5px;
    -webkit-mask: 
        linear-gradient(#fff 0 0) content-box, 
        linear-gradient(#fff 0 0);
    mask: 
        linear-gradient(#fff 0 0) content-box, 
        linear-gradient(#fff 0 0);
    -webkit-mask-composite: xor;
    mask-composite: exclude;
}


#dna_accordion .jeg-elementor-kit.jkit-accordion .card-expand .card-body {
    padding: 0px 25px 0px 25px;
}
.responsive-horizontal-table {
    width: 100%;
    overflow-x: auto; /* Enables horizontal scrolling */
}

.responsive-horizontal-table table {
    width: 100%;
    min-width: 900px; /* Ensures table does not shrink too much */
    border-collapse: collapse;
    white-space: nowrap; /* Prevents text from wrapping */
}

.responsive-horizontal-table th,
.responsive-horizontal-table td {
    border: 1px solid #ddd;
    padding: 8px;
    text-align: left;
}

.responsive-horizontal-table th {
    background-color: #f4f4f4;
}
#test-services .elementor-button{padding:0px!important;}
#RO .elementor-flip-box__front .elementor-flip-box__layer__description {text-align:left;color:#5B7184;margin-left: 50px;}
#RO .strd_arrow-icon-lite {
    display: inline-block;
    width: 12px; /* Adjust icon width */
    height: 12px; /* Adjust icon height */
    background: url('/wp-content/uploads/2025/02/st-arrow-icon.png') no-repeat center center;
    background-size: contain; /* Ensures the SVG fits perfectly */
    margin-left: 8px; /* Adds spacing between the text and the icon */
}
#RO .elementor-flip-box__back .elementor-flip-box__button a{border-bottom: 2px solid #fff;}
#RO .elementor-flip-box__button:hover .strd_arrow-icon-lite{transform: rotate(45deg);}
#RO .elementor-flip-box__button:hover .strd_arrow-icon{transform: rotate(45deg);}
.sequencing_services {
    transform: rotate(-90deg);
}

.sequencing_services .elementor-heading-title {
   white-space: nowrap;
}
#onc_inner_accord .card-header-button{padding: 20px 15px!important;}
.testcode_hdg span{font-weight:500;}
.responsive-table td {
    border: 1px solid #ffffff!important;
}

#onc_inner_accord .jeg-elementor-kit.jkit-accordion .card-expand .card-body {
    padding: 10px 20px;
}
#onc_inner_accord table tbody>tr:nth-child(odd)>td,table tbody>tr:nth-child(odd)>th {
    background-color: #D8F0F8!important;
}
.klge_scroll {
    max-height: 550px;
    overflow-y: auto;
    overflow-x: hidden;
}
.keyword_scroll {
    max-height: 300px;
    overflow-y: auto;
    overflow-x: hidden;
}
.scroll {
    max-height: 450px;
    overflow-y: auto; 
    overflow-x: hidden; 
}

.flipbox_fade .elementor-flip-box__layer {
  transition: all 0s ease-in-out;
}
.search-bar {
  display: flex;
  align-items: center;
  border: 1px solid #dcdcdc;
  border-radius: 4px;
  padding: 5px 10px;
  width: 100%;
  background-color: #fff;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1);
}

.search-icon {
  margin-right: 8px;
  display: flex;
  align-items: center;
}

.search-bar input {
  flex: 1;
  border: none;
  outline: none;
  font-size: 14px;
  color: #555;
}

.search-bar input::placeholder {
  color: #8a8a8a;
}

.clear-icon {
  margin-left: 8px;
  display: flex;
  align-items: center;
  cursor: pointer;
}

.clear-icon svg:hover {
  fill: #005e87;
}
p{word-break: break-word;
}
.tablepress tr:first-child th {border-block-start:none!important;}
.tablepress .column-1, .tablepress .column-2, .tablepress .column-3, .tablepress .column-4, .tablepress .column-5, .tablepress .column-6{
    background-color: #ffffff;
}
.tablepress tbody td {
    margin: 19.5px 79px 17.5px 143px;
  font-family: Barlow;
  font-size: 18px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: normal;
  text-align: left;
  color: #2a2a2a;
}
.tablepress>.row-hover>tr:hover>*{
  background-color: #fff !important;
}
.dt-column-title{
    font-family: Barlow;
  font-size: 22px;
  font-weight: 500;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: normal;
  text-align: left;
  color: #2a2a2a;
}
.tablepress .row-hover img {
  transform: rotate(0deg);
  transition: transform 0.3s ease;
}

.tablepress .row-hover img:hover {
  transform: rotate(45deg);
}
.tablepress .column-1{width:10%;}
.tablepress .column-2{width:20%;}
.tablepress .column-5{width:2%;}
.white a{color:#ffffff;}
.tablepress .column-1 a:hover, .tablepress .column-2 a:hover{
      font-family: Barlow;
  font-size: 18px;
  font-weight: 500;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: normal;
  text-align: left;
  color: #00608a;
  border-bottom:1px #00608a solid;
}
.dt-search, .dt-info{display:none!important;}
#strand_onc_tab .card-body {
    padding: 0px 30px;
}
.ro_box{
  border-radius: 5px;
  border-style: solid;
  border-width: 2px;
  border-image-source: linear-gradient(to right, #f58620, #ea1e33 33%, #00608a 67%, #008d61);
  border-image-slice: 1;
  background-image: linear-gradient(to bottom, #fff, #fff), linear-gradient(to right, #f58620, #ea1e33 33%, #00608a 67%, #008d61);
  background-origin: border-box;
  background-clip: content-box, border-box;
}
.hd_dmenu_link li a:hover{
    background-color: #ffffff;
    border:none;
}
.hd_dmenu_link .elementor-icon-list-text{margin-left:10px;}
#strand_journey .date_content{
  flex-grow: 0;
  margin: 0 0 2px;
  font-family: Barlow;
  font-size: 18px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.22;
  letter-spacing: 0.2px;
  text-align: center;
  color: #5b7184;
    background-color:#fafafa;
    z-index:1;
}
#strand_journey .date_content span {
  flex-grow: 0;
  margin: 2px 24px 0 23px;
  font-family: Barlow;
  font-size: 32px;
  font-weight: 600;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.44;
  letter-spacing: 0.2px;
  text-align: center;
  color: #5b7184;
}
#strand_journey .swiper-slide-active .date_content{
  font-family: Barlow;
  font-size: 18px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.22;
  letter-spacing: 0.2px;
  text-align: center;
  color: #000;
}
#strand_journey .insidedesc {
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    height: 100%;
    text-align: center;
    align-items: center; 
    z-index:9;
}
.page-id-920 .swiper{padding-bottom: 80px!important;}
#strand_journey .orange_line {
    height: 6.5vw;
    transition: height 0.4s linear, background 0.4s linear;
    width: 2px;
    font-size: 0;
    background: #8a8a8a;
    display: inline-block;
    position: relative;
}

#strand_journey .orange_line:after {
    content: '';
    width: 12px;
    height: 12px;
    border-radius: 20px;
    background: #8a8a8a;
    position: absolute;
    left: -6px;
    bottom: -6px;
    transition: background 0.4s linear;
}

#strand_journey .red_line {
    height: 6.5vw;
    transition: height 0.4s linear, background 0.4s linear;
    width: 2px;
    font-size: 0;
    background: #8a8a8a;
    display: inline-block;
    position: relative;
}

#strand_journey .red_line:after {
    content: '';
    width: 12px;
    height: 12px;
    border-radius: 20px;
    background: #8a8a8a;
    position: absolute;
    left: -6px;
    bottom: -6px;
    transition: background 0.4s linear;
}

#strand_journey .green_line {
    height: 6.5vw;
    transition: height 0.4s linear, background 0.4s linear;
    width: 2px;
    font-size: 0;
    background: #8a8a8a;
    display: inline-block;
    position: relative;
}

#strand_journey .green_line:after {
    content: '';
    width: 12px;
    height: 12px;
    border-radius: 20px;
    background: #8a8a8a;
    position: absolute;
    left: -6px;
    bottom: -6px;
    transition: background 0.4s linear;
}

#strand_journey .blue_line {
    height: 6.5vw;
    transition: height 0.4s linear, background 0.4s linear;
    width: 2px;
    font-size: 0;
    background: #8a8a8a;
    display: inline-block;
    position: relative;
}

#strand_journey .blue_line:after {
    content: '';
    width: 12px;
    height: 12px;
    border-radius: 20px;
    background: #8a8a8a;
    position: absolute;
    left: -6px;
    bottom: -6px;
    transition: background 0.4s linear;
}
#strand_journey .swiper-slide-active .orange_line, #strand_journey .swiper-slide-active .red_line, #strand_journey .swiper-slide-active .green_line, #strand_journey .swiper-slide-active .blue_line  {
height: 13.85vw; 
}
#strand_journey .swiper-slide-active .orange_line {
    
    background: #f58620;
    transform: translateY(-3vw);
    transition: height 0.4s linear, transform 0.4s linear;
}

#strand_journey .swiper-slide-active .orange_line:after {
    background: #f58620;
}

#strand_journey .swiper-slide-active .red_line {
    background: #ea1e33;
    transform: translateY(-3vw);
    transition: height 0.4s linear, transform 0.4s linear;
}

#strand_journey .swiper-slide-active .red_line:after {
    background: #ea1e33;
}

#strand_journey .swiper-slide-active .green_line {
    background: #008d61;
    transform: translateY(-3vw);
    transition: height 0.4s linear, transform 0.4s linear;
}

#strand_journey .swiper-slide-active .green_line:after {
    background: #008d61;
}

#strand_journey .swiper-slide-active .blue_line {
    background: #00608a;
    transform: translateY(-3vw);
    transition: height 0.4s linear, transform 0.4s linear;
}

#strand_journey .swiper-slide-active .blue_line:after {
    background: #00608a;
}

#strand_journey .swiper-slide-active .insidedesc {
    transform: translateY(-5vw);
    transition: transform 0.4s linear;
    margin-top: 155px;
}
#strand_journey .swiper-slide-active .mrg_top_134 .insidedesc {
    margin-top: 134px;
}
#strand_journey  .swiper-slide-active .insidedesc .date_content span {
    color: #2a2a2a;
}
#strand_journey .e-con{
    height: 250px;
}
.e-n-tab-title[aria-selected="true"]{
    position: relative;
    color: white;
    background: #fff; /* Button background color */
    overflow: hidden;
    z-index: 0;
}
.e-n-tab-title[aria-selected="true"]:before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: linear-gradient(to right, #f58620, #ea1e33, #00608a, #008d61);
    z-index: -1;
    padding: 2px; /* Border thickness */
    border-radius: 5px;
    -webkit-mask: 
        linear-gradient(#fff 0 0) content-box, 
        linear-gradient(#fff 0 0);
    mask: 
        linear-gradient(#fff 0 0) content-box, 
        linear-gradient(#fff 0 0);
    -webkit-mask-composite: xor; /* For Webkit browsers */
    mask-composite: exclude;    /* For other browsers */
}
.strd_arrow-icon {
    display: inline-block;
    width: 12px; /* Adjust icon width */
    height: 12px; /* Adjust icon height */
    background: url('/wp-content/uploads/2025/01/st-arrow-icon.svg') no-repeat center center;
    background-size: contain; /* Ensures the SVG fits perfectly */
    margin-left: 8px; /* Adds spacing between the text and the icon */
}
.strd_arrow-icon:hover{transform: rotate(45deg);}
.elementor-cta__button:hover .strd_arrow-icon{transform: rotate(45deg);}
#grad-box .elementor-cta {
  border-radius: 12px; 
}
#grad-box .gradient-border-box {
  box-sizing: border-box;
  position: relative;
  display: inline-block;
  border-radius: 12px;
  padding: 20px; /* control border thickness */
  background: white; /* inner box color */
  z-index: 1;
  overflow: hidden;
}

/* Pseudo-element creates the border */
#grad-box .gradient-border-box::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  border-radius: 12px;
  padding: 2px; /* border thickness */
  background: #e0e4e8; /* solid gray border by default */
  -webkit-mask:
    linear-gradient(#fff 0 0) content-box,
    linear-gradient(#fff 0 0);
  -webkit-mask-composite: xor;
  mask-composite: exclude;
  pointer-events: none;
  transition: background 0.4s ease; /* smooth transition on hover */
}

/* Gradient on hover */
#grad-box .gradient-border-box:hover::before {
  background: linear-gradient(to right, #f58620, #ea1e33, #00608a, #008d61);
}

.hover-gradient-border {
  box-sizing: border-box;
  position: relative;
  border-radius: 12px; /* optional: adjust radius to your design */
  z-index: 1;
  overflow: hidden;
}

/* Solid gray border by default */
.hover-gradient-border::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  border-radius: 12px;
  padding: 2px; /* border thickness */
  background: #e0e4e8; /* subtle gray border */
  -webkit-mask:
    linear-gradient(#fff 0 0) content-box,
    linear-gradient(#fff 0 0);
  -webkit-mask-composite: xor;
  mask-composite: exclude;
  pointer-events: none;
  transition: background 0.4s ease; /* smooth transition on hover */
}

/* Gradient border on hover */
.hover-gradient-border:hover::before {
  background: linear-gradient(to right, #f58620, #ea1e33, #00608a, #008d61);
}


.gradient-border-box {
  position: relative;
  display: inline-block; 
  border-radius: 12px; 
  padding: 2px; 
  background: #E0E4E8;
}
.gradient-border-box:hover {
  position: relative;
  display: inline-block;
  border-radius: 12px; 
  padding: 2px; 
  background: linear-gradient(to right, #f58620, #ea1e33, #00608a, #008d61);
}
.gradient-border-box-btn {
  position: relative;
  display: inline-block; 
  border-radius: 5px; 
  padding: 2px; 
  background: #f9f7f7;
}
.gradient-border-box-btn:hover {
  background: linear-gradient(to right, #f58620, #ea1e33, #00608a, #008d61);
}
.rd-gradient-border-box {
  position: relative;
  display: inline-block; 
  padding: 2px; 
  background: linear-gradient(to right, #f58620, #ea1e33, #00608a, #008d61);
}
.rd-gradient-border-box .elementor-icon-wrapper {display:none;}
.ani_btn svg{transform: rotate(0deg);}
.ani_btn:hover svg{transform: rotate(45deg);}
.elementor-button-icon svg {
    height: auto;
    width: 100%!important;
}
.str_btn .jkit-button-wrapper i {
	transform: rotate(-45deg);
	}
.str_btn:hover .jkit-button-wrapper i{transform: rotate(0deg);}
.str_btn svg {
	transform: rotate(0deg);
	border-radius:0!important;
	}
.str_btn:hover svg {transform: rotate(45deg);}
.grad_btn  svg {
	transform: rotate(-45deg);
	}
.grad_btn :hover svg{transform: rotate(0deg);}
.grad_btn {
    position: relative;
    display: inline-block;
    padding: 0 10px;
    font-size: 16px;
    color: white;
    background: #fff; /* Button background color */
    border-radius: 24px;
    overflow: hidden;
    z-index: 0;
}

.grad_btn:before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: linear-gradient(to right, #f58620, #ea1e33, #00608a, #008d61);
    z-index: -1;
    border-radius: 30px; /* Match button border-radius */
    padding: 2px; /* Border thickness */
    -webkit-mask: 
        linear-gradient(#fff 0 0) content-box, 
        linear-gradient(#fff 0 0);
    mask: 
        linear-gradient(#fff 0 0) content-box, 
        linear-gradient(#fff 0 0);
    -webkit-mask-composite: xor; /* For Webkit browsers */
    mask-composite: exclude;    /* For other browsers */
}
/* Global Left Gradient Line */
#grad_left_line {
    position: fixed;
    top: 0;
    left: 0;
    width: 15px; 
    height: 100%;
    z-index: 9999;

    background: linear-gradient(
        to bottom,
        #f58620,
        #ea1e33,
        #00608a,
        #008d61
    );
    background-size: 100% 300%; /* 3x height to allow scrolling effect */
    animation: animated-gradient 6s ease-in-out infinite;
    animation: animated-gradient 6s ease-in-out infinite alternate;

}
/* Animate background position to simulate moving gradient */
@keyframes animated-gradient {
    0% {
        background-position: top;
    }
    100% {
        background-position: bottom;
    }
}
/* Add this to the popup section or inner container */
#left-gradient-line {
    position: absolute;
    top: 0;
    left: 0;
    width: 15px; 
    height: 100%;
    z-index: 9999;

    background: linear-gradient(
        to bottom,
        #f58620,
        #ea1e33,
        #00608a,
        #008d61
    );
}

body { position: relative; }
#grad_left_line_1:before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    width: 10px; /* Left border width */
    background: linear-gradient(to bottom, #f58620, #ea1e33, #00608a, #008d61); 
    z-index:2;
}
#grad_left_line_2:before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    width: 10px; /* Left border width */
    background: linear-gradient(to top, #f58620, #ea1e33, #00608a, #008d61);
    z-index:2;
}
#grad_left_line_3:before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    width: 10px; /* Left border width */
    background: linear-gradient(to bottom, #f58620, #ea1e33, #00608a, #008d61);
    z-index:2;
}
#grad_left_line_4:before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    width: 10px; /* Left border width */
    background: linear-gradient(to top, #f58620, #ea1e33, #00608a, #008d61);
    z-index:2;
}
#grad_left_line_5:before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    width: 10px; /* Left border width */
    background: linear-gradient(to bottom, #f58620, #ea1e33, #00608a, #008d61);
    z-index:2;
}
#grad_left_line_6:before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    width: 10px; /* Left border width */
    background: linear-gradient(to top, #f58620, #ea1e33, #00608a, #008d61);
    z-index:2;
}
#grad_left_line_7:before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    width: 10px; /* Left border width */
    background: linear-gradient(to bottom, #f58620, #ea1e33, #00608a, #008d61);
    z-index:2;
}
#grad_left_line_8:before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    width: 10px; /* Left border width */
    background: linear-gradient(to top, #f58620, #ea1e33, #00608a, #008d61);
    z-index:2;
}
#grad_left_line_9:before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    width: 10px; /* Left border width */
    background: #f58620;
    z-index:2;
}
/* Apply grayscale filter to the image */
#grayscale_image img {
filter: grayscale(100%);
transition: filter 0.3s ease; /* optional: add a smooth transition */
}
/* Remove the filter on hover */
#grayscale_image img:hover {
filter: grayscale(0%);
}

/*placeholder spacing */
#cta_contact_form_ft input {
  padding-left: 50px !important;
}

/*Icon box settings*/
.contact_form  form.elementor-form .elementor-field-group-email::after, .elementor-field-group-name::after, .elementor-field-group-phone::after, .elementor-field-group-message::after {
    position: absolute;
    left: 5px;
    top: 28px;
    bottom: 0px;
    width: 40px;
    height: 40px;
    content: "";
    z-index: 99;
}

/*Icon size & position settings*/
.contact_form  form.elementor-form .elementor-field-group-email::before, .elementor-field-group-name::before, .elementor-field-group-phone::before, .elementor-field-group-message::before  {
    position: absolute;
    left: 30px;
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    content: "";
    color: #5B7184;
    z-index: 1;
    font-size: 17px;
}

/*Name field*/
.contact_form  .elementor-field-group-name::before{
    content: "\f007";
}

/*Email field*/
.contact_form form.elementor-form .elementor-field-group-email::before{
   content: "\f0e0";
}
/* Phone field */
.contact_form form.elementor-form .elementor-field-group-phone::before{
  content: "\f095";
  transform: scaleX(-1);
}

.contact_form .elementor-button[type="submit"] {
    position: relative;
    display: inline-block;
    padding: 10px;
    font-size: 16px;
    color: white;
    background: #fff; /* Button background color */
    border-radius: 30px;
    overflow: hidden;
    z-index: 0;
}

.contact_form .elementor-button[type="submit"]:before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: linear-gradient(to right, #f58620, #ea1e33, #00608a, #008d61);
    z-index: -1;
    border-radius: 30px; /* Match button border-radius */
    padding: 2px; /* Border thickness */
    -webkit-mask: 
        linear-gradient(#fff 0 0) content-box, 
        linear-gradient(#fff 0 0);
    mask: 
        linear-gradient(#fff 0 0) content-box, 
        linear-gradient(#fff 0 0);
    -webkit-mask-composite: xor; /* For Webkit browsers */
    mask-composite: exclude;    /* For other browsers */
}
#strand_timeline .xpro-horizontal-timeline-content{display:none;}
#strand_heading .separator-wrapper.style-solid{
    border-radius: 2px;
}
#enquire_form .e-n-tab-title{background-color:#f9f7f7;}

/* Main box */
.hover-reveal-box {
  position: relative;
  overflow: hidden;
  height: 100%;
  display: flex;
  flex-direction: column;
}

/* Heading block (separator + heading title) */
.hover-reveal-box .jkit-heading {
  position: absolute;
  bottom: 20px;
  left: 10px;
  right: 10px;
  transition: transform 0.4s ease;
  z-index: 2;
}

/* Description */
.hover-reveal-box .elementor-widget-text-editor {
  position: absolute;
  bottom: 20px;
  left: 20px;
  right: 20px;
  opacity: 0;
  visibility: hidden;
  transform: translateY(10px);
  transition: all 0.4s ease;
  z-index: 1;
}

/* On hover: move heading up and show description */
.hover-reveal-box:hover .jkit-heading {
  transform: translateY(-120px);
}

.hover-reveal-box:hover .elementor-widget-text-editor {
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
}
.e-n-menu-item .active-top-parent {
  border-style: solid;
  border-width: 0 0 3px 0;
  border-color: #056289;
}
.flip-grow .elementor-flip-box__back {
  transition: transform 0.4s ease-in-out;
  z-index: 9999;
}

.flip-grow:hover .elementor-flip-box__back {
  transform: scale(1.1);
  position: relative;
}
.card-body{font-size:18px!important;}
#dna_accordion .title, #onc_inner_accord .title {font-size:26px!important;}
#cpr ul{margin-bottom: 0.9rem;}
.gradient-text {
  background: linear-gradient(to right, #f58620, #ea1e33, #00608a, #008d61);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  color: transparent;
}