.hide-technical-insights
.kh_hero_hyperlink[data-section="kh_technical-insights_grid-section"],
.hide-research-development
.kh_hero_hyperlink[data-section="kh_research-development_grid-section"],
.hide-sabreshorts
.kh_hero_hyperlink[data-section="kh_sabreshorts_grid-section"],
.hide-understanding-adhesives-sealants
.kh_hero_hyperlink[data-section="kh_understanding_grid-section"],
.hide-product-features
.kh_hero_hyperlink[data-section="kh_features_grid-section"],
.hide-customer-stories
.kh_hero_hyperlink[data-section="kh_stories_grid-section"],
.hide-brochures
.kh_hero_hyperlink[data-section="kh_brochures_grid-section"],
.hide-downloads
.kh_hero_hyperlink[data-section="kh_downloads"]
{
display: none !important;
}
.hide-technical-insights section.kh_technical-insights,
.hide-research-development section.kh_research-development,
.hide-sabreshorts section.kh_sabreshorts,
.hide-understanding-adhesives-sealants section.kh_understanding,
.hide-product-features section.kh_features,
.hide-customer-stories section.kh_stories,
.hide-brochures section.kh_brochures,
.hide-downloads section.kh_downloads
{
display: none !important;
}
/* .page-template-page-knowledge-hub div#page-content {
margin-top: 63px !important;
} */
.page-template-template-knowledge-hub #page-content {
overflow: hidden;
}
/* Hero */
.kh_hero {
max-width: calc(1240px + 200px);
margin: 0 auto;
display: flex;
flex-direction: column;
width: 100%;
padding: 0px 100px;
padding-top: 63px;
margin-bottom: 49px;
}
.kh_hero_inner {
display: grid;
grid-template-columns: repeat(12, 1fr);
gap: 12px 20px;
}
.kh_hero_heading {
grid-column: span 12;
color: var(--Sabre-Purple, #4B08A1);
font-family: Poppins;
font-size: 48px;
font-style: normal;
font-weight: 700;
line-height: 150%; /* 72px */
letter-spacing: -0.528px;
margin-bottom: 0px;
}
.kh_hero_hyperlinks {
grid-column: span 12;
display: flex;
padding: 10px 0px;
align-items: center;
align-content: center;
gap: 10px;
flex-wrap: wrap;
}
.kh_hero_hyperlink {
display: flex;
padding: 6px 14px;
justify-content: center;
align-items: center;
gap: 10px;
border-radius: 50px;
border: 1px solid var(--Sabre-Purple, #4B08A1);
color: var(--Sabre-Purple, #4B08A1);
text-align: center;
font-family: Poppins;
font-size: 14px;
font-style: normal;
font-weight: 500;
line-height: 150%; /* 21px */
letter-spacing: -0.154px;
text-decoration: none;
transition: background 0.3s ease, color 0.3s ease;
}
.kh_hero_hyperlink:hover {
background: var(--Sabre-Purple, #4B08A1);
color: #fff;
}
.kh_hero_hyperlink.active {
background: var(--Sabre-Purple, #4B08A1);
color: #fff;
}
.kh_hero_hyperlink_close {
display: none;
opacity: 0;
transition: opacity .45s ease;
}
.kh_hero_hyperlink.active .kh_hero_hyperlink_close {
display: block;
opacity: 1;
}
@media (max-width: 767px) {
.kh_hero {
padding: 0px 25px;
padding-top: 40px;
margin-bottom: 29px;
}
.kh_hero_hyperlinks {
display: none;
}
}
/* Techincal Insights */
.kh_technical-insights {
display: flex;
flex-direction: column;
width: 100%;
padding: 0px;
/* margin-top: 49px; */
/* overflow: hidden; */
}
.kh_technical-insights_top {
display: flex;
flex-direction: row;
justify-content: space-between;
align-items: flex-end;
max-width: calc(1240px + 200px);
margin: 0 auto;
width: 100%;
padding: 0px 100px;
position: relative;
margin-bottom: 20px;
}
.kh_technical-insights_top_inner {
display: flex;
flex-direction: row;
justify-content: space-between;
align-items: flex-end;
width: 100%;
border-top: 1px solid var(--Sabre-Blue, #00AFFE);
padding-top: 13px;
}
.kh_technical-insights_heading_wrapper {
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
gap: 6px;
}
.kh_technical-insights_heading_line {
width: 4px;
height: 20px;
background: var(--Sabre-Blue, #00AFFE);
}
.kh_technical-insights_heading_heading-count {
display: flex;
flex-direction: row;
align-items: baseline;
justify-content: flex-start;
gap: 0.5ch;
}
.kh_technical-insights_heading {
color: var(--Sabre-Purple, #4B08A1);
font-family: Poppins;
font-size: 24px;
font-style: normal;
font-weight: 700;
line-height: 150%; /* 36px */
letter-spacing: -0.264px;
margin-bottom: 0;
}
.total-count {
color: var(--Sabre-Purple, #4B08A1);
font-family: Poppins;
font-size: 16px;
font-style: normal;
font-weight: 400;
line-height: 150%; /* 20.8px */
letter-spacing: -0.176px;
}
.kh_technical-insights_link_wrapper-mobile {
display: none;
}
.kh_technical-insights_link {
color: var(--Sabre-Blue, #00AFFE);
text-align: right;
font-family: Poppins;
font-size: 14px;
font-style: normal;
font-weight: 500;
line-height: 150%; /* 21px */
letter-spacing: -0.154px;
text-underline-offset: 5px;
text-decoration-thickness: 2px;
margin-bottom: 5px;
display: block;
}
.kh_technical-insights .swiper {
max-width: calc(1240px + 200px);
width: 100%;
padding: 0 100px;
position: relative;
margin: 0 auto;
}
/* at 1400px and higher we hide */
@media (min-width: 1400px) {
.kh_technical-insights .swiper {
max-width: 1240px;
overflow: hidden;
padding: 0;
}
}
.kh_technical-insights_slide_tag {
pointer-events: none;
color: inherit;
text-decoration: none;
cursor: default;
}
.kh_technical-insights .swiper-wrapper {
display: flex;
}
.kh_technical-insights .swiper-slide {
display: flex;
width: 295px;
/* max-width: 295px; */
/* height: 166.259px; */
justify-content: flex-start;
align-items: flex-start;
flex-shrink: 0;
aspect-ratio: 295.00/166.26;
flex-direction: column;
height: fit-content;
text-decoration: none;
opacity: 1;
transition: opacity 0.3s ease;
}
.kh_technical-insights_slide {
text-decoration: none;
}
/* .kh_technical-insights .swiper-slide-prev,
.kh_technical-insights .swiper-slide-next {
opacity: 0.3;
} */
/* .kh_technical-insights .swiper-slide.faded {
opacity: 0.3;
}
.kh_technical-insights .swiper-slide.hidden {
opacity: 0;
} */
.kh_technical-insights_slide:hover .kh_technical-insights_slide_img {
transform: scale(1.05);
}
.kh_technical-insights_slide:hover .kh_technical-insights_slide_title {
color: var(--Sabre-Blue, #00AFFE);
}
.kh_technical-insights_slide_img-wrapper {
overflow: hidden;
}
.kh_technical-insights_slide_img {
display: flex;
width: 100%;
/* height: 166.259px; */
height: auto;
aspect-ratio: 295.00/166.26;
background: var(--Sabre-Blue-2, #EAF9FF);
object-fit: cover;
transition: .45s;
cursor: pointer;
}
.kh_technical-insights_slide_content {
padding-right: 20px;
}
.kh_technical-insights_slide_date {
color: var(--Sabre-Purple, #4B08A1);
font-family: Poppins;
font-size: 12px;
font-style: normal;
font-weight: 500;
line-height: 160%; /* 19.2px */
margin-top: 14px;
}
.kh_technical-insights_slide_title {
color: var(--Sabre-Purple, #4B08A1);
font-family: Poppins;
font-size: 16px;
font-style: normal;
font-weight: 600;
line-height: 130%; /* 20.8px */
letter-spacing: -0.176px;
margin-top: 3px;
transition: color 0.45s ease;
margin-bottom: 0;
}
.kh_technical-insights_slide_tag {
display: inline-flex;
height: 21px;
padding: 3px 10px;
justify-content: center;
align-items: center;
gap: 5px;
flex-shrink: 0;
border-radius: 4px;
border: 1px solid var(--Sabre-Purple-2, #F0FAFF);
background: var(--Sabre-Purple-2, #F0FAFF);
color: var(--Sabre-Purple, #4B08A1);
text-align: center;
font-family: Poppins;
font-size: 10px;
font-style: normal;
font-weight: 500;
line-height: 150%; /* 15px */
letter-spacing: -0.11px;
text-decoration: none;
margin-top: 19px;
}
.kh_technical-insights_swiper-button {
display: flex;
width: 60px;
height: 60px;
padding: 18px 17px;
align-items: center;
gap: 10px;
flex-shrink: 0;
border-radius: 30px;
border: 1px solid var(--Sabre-Blue, #00AFFE);
background: var(--Sabre-White, #FFF);
cursor: pointer;
transition: background 0.3s ease;
transform: translateZ(0); /* triggers GPU rendering */
will-change: transform;
}
.kh_technical-insights_swiper-button:hover {
background: var(--Sabre-Blue, #00AFFE);
}
.kh_technical-insights_swiper-button:hover svg path {
fill: #ffffff;
}
.kh_technical-insights_swiper-button-prev {
position: absolute;
left: 70px;
top: 126px;
z-index: 2;
}
.kh_technical-insights_swiper-button-next {
position: absolute;
right: 70px;
top: 126px;
z-index: 2;
}
@media (max-width: 767px) {
.kh_hero_heading {
font-size: 28px;
}
.kh_technical-insights {
/* margin-top: 38px; */
}
.kh_technical-insights_top {
padding: 0 25px 0 0;
margin-left: 25px;
border-top: 1px solid var(--Sabre-Blue, #00AFFE);
}
.kh_technical-insights_top_inner {
border-top: none;
padding-top: 9px;
}
.kh_technical-insights_heading {
font-size: 18px;
}
.kh_technical-insights_link_wrapper-desktop {
display: none;
}
.kh_technical-insights_link_wrapper-mobile {
display: flex;
flex-direction: row;
padding: 0 25px;
margin-top: 30px;
}
.kh_technical-insights .swiper {
padding-left: 25px;
padding-right: 0px;
}
.kh_technical-insights_swiper-button {
display: none;
}
.kh_technical-insights_slide_date {
font-size: 10px;
}
.kh_technical-insights_slide_title {
font-size: 16px;
}
.kh_technical-insights_slide_tag {
margin-top: 12px;
}
.kh_technical-insights_slide:hover .kh_technical-insights_slide_img {
transform: unset;
}
.kh_technical-insights_slide:hover .kh_technical-insights_slide_title {
color: var(--Sabre-Purple, #4B08A1);
}
.kh_technical-insights_heading_line {
width: 4px;
height: 13px;
}
}
.kh_technical-insights_swiper-button-prev.swiper-button-disabled,
.kh_technical-insights_swiper-button-next.swiper-button-disabled {
display: none;
}
.kh_technical-insights_grid {
display: grid;
grid-template-columns: repeat(12, 1fr);
gap: 40px 20px;
max-width: calc(1240px + 200px);
margin: 0 auto;
width: 100%;
padding: 0px 100px;
}
.kh_technical-insights_grid_item_link {
text-decoration: none;
}
.kh_technical-insights_grid_item {
grid-column: span 4;
text-decoration: none;
display: flex;
flex-direction: column;
justify-content: flex-start;
align-items: flex-start;
height: fit-content;
text-decoration: none;
}
.kh_technical-insights_grid_item_link {
text-decoration: none;
}
.kh_technical-insights_grid_item:hover .kh_technical-insights_slide_img {
transform: scale(1.05);
}
.kh_technical-insights_grid_item:hover .kh_technical-insights_slide_title {
color: var(--Sabre-Blue, #00AFFE);
margin-bottom: 0;
}
.kh_content-section {
opacity: 1;
visibility: visible;
transition: opacity 0.45s ease, visibility 0.45s ease;
margin-bottom: 49px;
}
.kh_content-section.hidden {
opacity: 0;
visibility: hidden;
pointer-events: none;
height: 0;
overflow: hidden;
margin-bottom: 0px;
}
.kh_content-section_grid-section {
opacity: 1;
visibility: visible;
transition: opacity 0.45s ease, visibility 0.45s ease;
margin-bottom: 49px;
}
.kh_content-section_grid-section.hidden {
opacity: 0;
visibility: hidden;
pointer-events: none;
height: 0;
overflow: hidden;
margin-bottom: 0px;
}
.kh_research-development {
display: flex;
flex-direction: column;
width: 100%;
padding: 0px;
/* margin-top: 49px; */
/* overflow: hidden; */
}
.kh_research-development_top {
display: flex;
flex-direction: row;
justify-content: space-between;
align-items: flex-end;
max-width: calc(1240px + 200px);
margin: 0 auto;
width: 100%;
padding: 0px 100px;
position: relative;
margin-bottom: 20px;
}
.kh_research-development_top_inner {
display: flex;
flex-direction: row;
justify-content: space-between;
align-items: flex-end;
width: 100%;
border-top: 1px solid var(--Sabre-Blue, #00AFFE);
padding-top: 13px;
}
.kh_research-development_heading_wrapper {
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
gap: 6px;
}
.kh_research-development_heading_line {
width: 4px;
height: 20px;
background: var(--Sabre-Blue, #00AFFE);
}
.kh_research-development_heading_heading-count {
display: flex;
flex-direction: row;
align-items: baseline;
justify-content: flex-start;
gap: 0.5ch;
}
.kh_research-development_heading {
color: var(--Sabre-Purple, #4B08A1);
font-family: Poppins;
font-size: 24px;
font-style: normal;
font-weight: 700;
line-height: 150%; /* 36px */
letter-spacing: -0.264px;
margin-bottom: 0;
}
.total-count {
color: var(--Sabre-Purple, #4B08A1);
font-family: Poppins;
font-size: 16px;
font-style: normal;
font-weight: 400;
line-height: 150%; /* 20.8px */
letter-spacing: -0.176px;
}
.kh_research-development_link {
color: var(--Sabre-Blue, #00AFFE);
text-align: right;
font-family: Poppins;
font-size: 14px;
font-style: normal;
font-weight: 500;
line-height: 150%; /* 21px */
letter-spacing: -0.154px;
text-underline-offset: 5px;
text-decoration-thickness: 2px;
margin-bottom: 5px;
display: block;
}
.kh_research-development_link_wrapper-mobile {
display: none;
}
.kh_research-development .swiper {
max-width: calc(1240px + 200px);
width: 100%;
padding: 0 100px;
position: relative;
margin: 0 auto;
}
/* at 1400px and higher we hide */
@media (min-width: 1400px) {
.kh_research-development .swiper {
max-width: 1240px;
overflow: hidden;
padding: 0;
}
}
@media (max-width: 767px) {
.kh_research-development .swiper {
padding-left: 25px;
padding-right: 0px;
}
.kh_research-development_heading_line {
width: 4px;
height: 13px;
}
}
.kh_research-development .swiper-wrapper {
display: flex;
}
.kh_research-development .swiper-slide {
display: flex;
width: 400px;
/* height: 225.436px; */
justify-content: flex-start;
align-items: flex-start;
flex-shrink: 0;
aspect-ratio: 400.00/225.44;
flex-direction: column;
height: fit-content;
text-decoration: none;
}
.kh_research-development_slide {
text-decoration: none;
}
.kh_research-development_slide:hover .kh_research-development_slide_img {
transform: scale(1.05);
}
.kh_research-development_slide:hover .kh_research-development_slide_title {
color: var(--Sabre-Blue, #00AFFE);
margin-bottom: 0;
}
.kh_research-development_slide_img-wrapper {
overflow: hidden;
position: relative;
}
.kh_research-development_slide_img {
display: flex;
width: 100%;
/* height: 166.259px; */
aspect-ratio: 400.00/225.44;
background: var(--Sabre-Blue-2, #EAF9FF);
object-fit: cover;
transition: .45s;
cursor: pointer;
}
.kh_research-development_duration {
display: inline-flex;
height: 21px;
padding: 3px 10px;
justify-content: center;
align-items: center;
gap: 5px;
flex-shrink: 0;
border-radius: 50px;
background: var(--Sabre-White, #FFF);
color: var(--Sabre-Purple, #4B08A1);
text-align: center;
font-family: Poppins;
font-size: 12px;
font-style: normal;
font-weight: 500;
line-height: 150%;
letter-spacing: -0.132px;
position: absolute;
right: 14px;
bottom: 10px;
}
.kh_research-development_slide_content {
padding-right: 20px;
}
.kh_research-development_slide_title {
color: var(--Sabre-Purple, #4B08A1);
font-family: Poppins;
font-size: 16px;
font-style: normal;
font-weight: 600;
line-height: 130%; /* 20.8px */
letter-spacing: -0.176px;
margin-top: 13px;
transition: color 0.45s ease;
margin-bottom: 0;
}
.kh_research-development_slide_tags {
display: flex;
gap: 5px;
flex-wrap: wrap;
margin-top: 19px;
}
.kh_research-development_slide_tag {
display: inline-flex;
height: 21px;
padding: 3px 10px;
justify-content: center;
align-items: center;
gap: 5px;
flex-shrink: 0;
border-radius: 4px;
border: 1px solid var(--Sabre-Purple-2, #F0FAFF);
background: var(--Sabre-Purple-2, #F0FAFF);
color: var(--Sabre-Purple, #4B08A1);
text-align: center;
font-family: Poppins;
font-size: 10px;
font-style: normal;
font-weight: 500;
line-height: 150%; /* 15px */
letter-spacing: -0.11px;
text-decoration: none;
}
.kh_research-development_swiper-button {
display: flex;
width: 60px;
height: 60px;
padding: 18px 17px;
align-items: center;
gap: 10px;
flex-shrink: 0;
border-radius: 30px;
border: 1px solid var(--Sabre-Blue, #00AFFE);
background: var(--Sabre-White, #FFF);
cursor: pointer;
transition: background 0.3s ease;
transform: translateZ(0); /* triggers GPU rendering */
will-change: transform;
}
.kh_research-development_swiper-button:hover {
background: var(--Sabre-Blue, #00AFFE);
}
.kh_research-development_swiper-button:hover svg path {
fill: #ffffff;
}
.kh_research-development_swiper-button-prev {
position: absolute;
left: 70px;
top: 162.5px;
z-index: 2;
}
.kh_research-development_swiper-button-next {
position: absolute;
right: 70px;
top: 162.5px;
z-index: 2;
}
@media (max-width: 767px) {
.kh_hero_heading {
font-size: 28px;
}
.kh_research-development {
/* margin-top: 38px; */
}
.kh_research-development_top {
padding: 0 25px 0 0;
margin-left: 25px;
border-top: 1px solid var(--Sabre-Blue, #00AFFE);
}
.kh_research-development_top_inner {
border-top: none;
padding-top: 9px;
}
.kh_research-development_heading {
font-size: 18px;
}
.kh_research-development_link_wrapper-desktop {
display: none;
}
.kh_research-development_link_wrapper-mobile {
display: flex;
flex-direction: row;
padding: 0 25px;
margin-top: 30px;
}
.kh_research-development_swiper-button {
display: none;
}
.kh_research-development .swiper-slide {
width: 295px;
aspect-ratio: 295.00/166.26;
}
.kh_research-development_duration {
right: 10px;
bottom: 10px;
}
.kh_research-development_slide_title {
font-size: 16px;
}
.kh_research-development_slide_tags {
margin-top: 12px;
}
.kh_research-development_slide:hover .kh_technical-insights_slide_img {
transform: unset;
}
.kh_research-development_slide:hover .kh_research-development_slide_title {
color: var(--Sabre-Purple, #4B08A1);
}
}
.kh_research-development_swiper-button-prev.swiper-button-disabled,
.kh_research-development_swiper-button-next.swiper-button-disabled {
display: none;
}
.kh_research-development_slide_img-wrapper {
position: relative;
aspect-ratio: 16 / 9;
overflow: hidden;
}
/* Poster visible by default */
.kh_research-development_poster {
position: absolute;
inset: 0;
width: 100%;
height: 100%;
object-fit: cover;
transition: opacity 0.3s ease;
z-index: 2;
}
/* YouTube iframe hidden until hover */
.kh_research-development_iframe {
position: absolute;
inset: 0;
width: 100%;
height: 100%;
border: 0;
opacity: 0;
transition: opacity 0.3s ease;
z-index: 1;
pointer-events: none; /* ensures clicks go to the */
}
/* On hover: fade iframe in, poster out */
.kh_research-development_slide_img-wrapper:hover .kh_research-development_iframe {
opacity: 1;
z-index: 3;
}
.kh_research-development_slide_img-wrapper:hover .kh_research-development_poster {
opacity: 0;
}
.play-btn {
width: 60px;
height: 60px;
background-color: #00AFFE;
border: none;
border-radius: 99999px;
display: flex;
align-items: center;
justify-content: center;
cursor: pointer;
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
z-index: 2;
}
.play-btn:hover {
background-color: #00AFFE !important;
}
.play-btn svg {
margin-left: 4px;
}
.kh_research-development_grid {
display: grid;
grid-template-columns: repeat(12, 1fr);
gap: 40px 20px;
max-width: calc(1240px + 200px);
margin: 0 auto;
width: 100%;
padding: 0px 100px;
}
.kh_research-development_grid_item_link {
text-decoration: none;
}
.kh_research-development_grid_item {
grid-column: span 4;
text-decoration: none;
display: flex;
flex-direction: column;
justify-content: flex-start;
align-items: flex-start;
height: fit-content;
}
.kh_research-development_grid_item:hover .kh_research-development_slide_img {
transform: scale(1.05);
}
.kh_research-development_grid_item:hover .kh_research-development_slide_title {
color: var(--Sabre-Blue, #00AFFE);
margin-bottom: 0;
}
.kh_sabreshorts {
display: flex;
flex-direction: column;
width: 100%;
padding: 0px;
/* overflow: hidden; */
/* display: none; */
}
.kh_sabreshorts_top {
display: flex;
flex-direction: row;
justify-content: space-between;
align-items: flex-end;
max-width: calc(1240px + 200px);
margin: 0 auto;
width: 100%;
padding: 0px 100px;
position: relative;
margin-bottom: 20px;
}
.kh_sabreshorts_top_inner {
display: flex;
flex-direction: row;
justify-content: space-between;
align-items: flex-end;
width: 100%;
border-top: 1px solid var(--Sabre-Blue, #00AFFE);
padding-top: 13px;
}
.kh_sabreshorts_heading_wrapper {
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
gap: 6px;
}
.kh_sabreshorts_heading_line {
width: 4px;
height: 20px;
background: var(--Sabre-Blue, #00AFFE);
}
.kh_sabreshorts_heading_heading-count {
display: flex;
flex-direction: row;
align-items: baseline;
justify-content: flex-start;
gap: 0.5ch;
}
.kh_sabreshorts_heading {
color: var(--Sabre-Purple, #4B08A1);
font-family: Poppins;
font-size: 24px;
font-style: normal;
font-weight: 700;
line-height: 150%;
letter-spacing: -0.264px;
margin-bottom: 0;
}
.total-count {
color: var(--Sabre-Purple, #4B08A1);
font-family: Poppins;
font-size: 16px;
font-style: normal;
font-weight: 400;
line-height: 150%; /* 20.8px */
letter-spacing: -0.176px;
}
.kh_sabreshorts_link {
color: var(--Sabre-Blue, #00AFFE);
text-align: right;
font-family: Poppins;
font-size: 14px;
font-style: normal;
font-weight: 500;
line-height: 150%;
letter-spacing: -0.154px;
text-underline-offset: 5px;
text-decoration-thickness: 2px;
margin-bottom: 5px;
display: block;
}
.kh_sabreshorts_link_wrapper-mobile {
display: none;
}
.kh_sabreshorts .swiper {
/* width: 100%;
position: relative; */
max-width: calc(1240px + 200px);
width: 100%;
padding: 0 100px;
position: relative;
margin: 0 auto;
}
@media (min-width: 1400px) {
.kh_sabreshorts .swiper {
max-width: 1240px;
overflow: hidden;
padding: 0;
}
}
@media (max-width: 767px) {
.kh_sabreshorts .swiper {
padding-left: 25px;
padding-right: 0px;
}
.kh_sabreshorts_heading_line {
width: 4px;
height: 13px;
}
}
.kh_sabreshorts .swiper-wrapper {
display: flex;
}
.kh_sabreshorts .swiper-slide {
position: relative;
aspect-ratio: 9 / 16;
height: auto;
display: flex;
width: 232px;
justify-content: flex-start;
align-items: flex-start;
flex-shrink: 0;
aspect-ratio: 232.00/412.44;
flex-direction: column;
height: fit-content;
text-decoration: none;
display: flex;
flex-direction: column;
width: 232px; /* your desktop width */
aspect-ratio: auto; /* let content define height */
text-decoration: none;
flex-shrink: 0;
}
.kh_sabreshorts_slide {
/* text-decoration: none;
height: auto;
aspect-ratio: 9 / 16; */
position: absolute; /* NEW */
inset: 0; /* NEW */
width: 100%; /* NEW */
height: 100%; /* NEW */
display: block; /* NEW */
border: 0; /* NEW */
}
.kh_sabreshorts .kh_card-media {
position: relative;
width: 100%;
aspect-ratio: 9 / 16;
overflow: hidden;
}
.kh_sabreshorts_slide:hover .kh_sabreshorts_slide_img {
transform: scale(1.05);
}
.kh_sabreshorts_slide:hover .kh_sabreshorts_slide_title {
color: var(--Sabre-Blue, #00AFFE);
}
.kh_sabreshorts_slide_img-wrapper {
overflow: hidden;
position: relative;
}
.kh_sabreshorts_slide_img {
display: flex;
width: 100%;
aspect-ratio: 232.00/412.44;
background: var(--Sabre-Blue-2, #EAF9FF);
object-fit: cover;
transition: 0.45s;
cursor: pointer;
}
.kh_sabreshorts_duration {
display: inline-flex;
height: 21px;
padding: 3px 10px;
justify-content: center;
align-items: center;
gap: 5px;
flex-shrink: 0;
border-radius: 50px;
background: var(--Sabre-White, #FFF);
color: var(--Sabre-Purple, #4B08A1);
text-align: center;
font-family: Poppins;
font-size: 12px;
font-style: normal;
font-weight: 500;
line-height: 150%;
letter-spacing: -0.132px;
position: absolute;
right: 14px;
bottom: 10px;
}
.kh_sabreshorts_slide_content {
padding-right: 20px;
text-decoration: none;
}
.kh_sabreshorts_slide_title {
color: var(--Sabre-Purple, #4B08A1);
font-family: Poppins;
font-size: 16px;
font-style: normal;
font-weight: 600;
line-height: 130%;
letter-spacing: -0.176px;
margin-top: 13px;
transition: color 0.45s ease;
margin-bottom: 0;
}
.kh_sabreshorts_slide_content:hover .kh_sabreshorts_slide_title {
color: var(--Sabre-Blue, #00AFFE);
}
.kh_sabreshorts_slide_tags {
display: flex;
gap: 5px;
flex-wrap: wrap;
margin-top: 19px;
}
.kh_sabreshorts_slide_tag {
display: inline-flex;
height: 21px;
padding: 3px 10px;
justify-content: center;
align-items: center;
gap: 5px;
flex-shrink: 0;
border-radius: 4px;
border: 1px solid var(--Sabre-Purple-2, #F0FAFF);
background: var(--Sabre-Purple-2, #F0FAFF);
color: var(--Sabre-Purple, #4B08A1);
text-align: center;
font-family: Poppins;
font-size: 10px;
font-style: normal;
font-weight: 500;
line-height: 150%;
letter-spacing: -0.11px;
text-decoration: none;
}
.kh_sabreshorts_swiper-button {
display: flex;
width: 60px;
height: 60px;
padding: 18px 17px;
align-items: center;
gap: 10px;
flex-shrink: 0;
border-radius: 30px;
border: 1px solid var(--Sabre-Blue, #00AFFE);
background: var(--Sabre-White, #FFF);
cursor: pointer;
transition: background 0.3s ease;
transform: translateZ(0); /* triggers GPU rendering */
will-change: transform;
}
.kh_sabreshorts_swiper-button:hover {
background: var(--Sabre-Blue, #00AFFE);
}
.kh_sabreshorts_swiper-button:hover svg path {
fill: #ffffff;
}
.kh_sabreshorts_swiper-button-prev {
position: absolute;
left: 70px;
top: 256px;
z-index: 2;
}
.kh_sabreshorts_swiper-button-next {
position: absolute;
right: 70px;
top: 256px;
z-index: 2;
}
@media (max-width: 767px) {
.kh_sabreshorts {
/* margin-top: 38px; */
}
.kh_sabreshorts_top {
padding: 0 25px 0 0;
margin-left: 25px;
border-top: 1px solid var(--Sabre-Blue, #00AFFE);
}
.kh_sabreshorts_top_inner {
border-top: none;
padding-top: 9px;
}
.kh_sabreshorts_heading {
font-size: 18px;
}
.kh_sabreshorts_link_wrapper-desktop {
display: none;
}
.kh_sabreshorts_link_wrapper-mobile {
display: flex;
flex-direction: row;
padding: 0 25px;
margin-top: 30px;
}
.kh_sabreshorts_swiper-button {
display: none;
}
.kh_sabreshorts .swiper-slide {
width: 295px;
aspect-ratio: 294.75/524.00;
}
.kh_sabreshorts_duration {
right: 10px;
bottom: 10px;
}
.kh_sabreshorts_slide_title {
font-size: 16px;
}
.kh_sabreshorts_slide_tags {
margin-top: 12px;
}
.kh_sabreshorts_slide:hover .kh_sabreshorts_slide_img {
transform: unset;
}
.kh_sabreshorts_slide_content:hover .kh_sabreshorts_slide_title {
color: var(--Sabre-Purple, #4B08A1);
}
}
.kh_sabreshorts_swiper-button-prev.swiper-button-disabled,
.kh_sabreshorts_swiper-button-next.swiper-button-disabled {
display: none;
}
/* Swiper should handle horizontal drags; allow vertical page scroll */
.kh_sabreshorts .swiper,
.kh_sabreshorts .swiper-wrapper { touch-action: pan-y; }
/* Smoother transforms & less text selection while dragging */
.kh_sabreshorts .swiper-wrapper { will-change: transform; }
.kh_sabreshorts .swiper-slide {
-webkit-user-drag: none;
user-select: none;
cursor: grab;
}
/* The video iframe must not eat gestures on ANY device */
.kh_sabreshorts .kh_sabreshorts_slide { pointer-events: none; }
.kh_sabreshorts_grid {
display: grid;
grid-template-columns: repeat(12, 1fr);
gap: 49px 20px;
max-width: calc(1240px + 200px);
margin: 0 auto;
width: 100%;
padding: 0px 100px;
grid-template-columns: repeat(auto-fit, minmax(232px, 1fr));
/* display: flex;
flex-direction: row;
flex-wrap: wrap;
gap: 49px 20px; */
}
.kh_sabreshorts_grid_item_link {
text-decoration: none;
}
.kh_sabreshorts_grid_item {
/* grid-column: span 4; */
text-decoration: none;
display: flex;
flex-direction: column;
justify-content: flex-start;
align-items: flex-start;
height: fit-content;
}
.kh_sabreshorts_grid_item:hover .kh_sabreshorts_slide_img {
transform: scale(1.05);
}
.kh_sabreshorts_grid_item:hover .kh_sabreshorts_slide_title {
color: var(--Sabre-Blue, #00AFFE);
}
.kh_understanding {
display: flex;
flex-direction: column;
width: 100%;
padding: 0px;
/* overflow: hidden; */
}
.kh_understanding_top {
display: flex;
flex-direction: row;
justify-content: space-between;
align-items: flex-end;
max-width: calc(1240px + 200px);
margin: 0 auto;
width: 100%;
padding: 0px 100px;
position: relative;
margin-bottom: 20px;
}
.kh_understanding_top_inner {
display: flex;
flex-direction: row;
justify-content: space-between;
align-items: flex-end;
width: 100%;
border-top: 1px solid var(--Sabre-Blue, #00AFFE);
padding-top: 13px;
}
.kh_understanding_heading_wrapper {
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
gap: 6px;
}
.kh_understanding_heading_line {
width: 4px;
height: 20px;
background: var(--Sabre-Blue, #00AFFE);
}
.kh_understanding_heading_heading-count {
display: flex;
flex-direction: row;
align-items: baseline;
justify-content: flex-start;
gap: 0.5ch;
}
.kh_understanding_heading {
color: var(--Sabre-Purple, #4B08A1);
font-family: Poppins;
font-size: 24px;
font-style: normal;
font-weight: 700;
line-height: 150%;
letter-spacing: -0.264px;
margin-bottom: 0;
}
.total-count {
color: var(--Sabre-Purple, #4B08A1);
font-family: Poppins;
font-size: 16px;
font-style: normal;
font-weight: 400;
line-height: 150%; /* 20.8px */
letter-spacing: -0.176px;
}
.kh_understanding_link {
color: var(--Sabre-Blue, #00AFFE);
text-align: right;
font-family: Poppins;
font-size: 14px;
font-style: normal;
font-weight: 500;
line-height: 150%;
letter-spacing: -0.154px;
text-underline-offset: 5px;
text-decoration-thickness: 2px;
margin-bottom: 5px;
display: block;
}
.kh_understanding_link_wrapper-mobile {
display: none;
}
.kh_understanding .swiper {
width: 100%;
position: relative;
}
.kh_understanding .swiper {
max-width: calc(1240px + 200px);
width: 100%;
padding: 0 100px;
position: relative;
margin: 0 auto;
}
@media (min-width: 1400px) {
.kh_understanding .swiper {
max-width: 1240px;
overflow: hidden;
padding: 0;
}
}
@media (max-width: 767px) {
.kh_understanding .swiper {
padding-left: 25px;
padding-right: 0px;
}
.kh_understanding_heading_line {
width: 4px;
height: 13px;
}
}
.kh_understanding .swiper-wrapper {
display: flex;
}
.kh_understanding .swiper-slide {
display: flex;
width: 400px;
justify-content: flex-start;
align-items: flex-start;
flex-shrink: 0;
aspect-ratio: 400/225.44;
flex-direction: column;
height: fit-content;
text-decoration: none;
}
.kh_understanding_slide {
text-decoration: none;
width: 100%;
}
.kh_understanding_slide:hover .kh_understanding_slide_img {
transform: scale(1.05);
}
.kh_understanding_slide:hover .kh_understanding_slide_title {
color: var(--Sabre-Blue, #00AFFE);
}
.kh_understanding_slide_img-wrapper {
overflow: hidden;
position: relative;
aspect-ratio: 16 / 9;
overflow: hidden;
}
.kh_understanding_slide_img {
display: flex;
width: 100%;
aspect-ratio: 400/225.44;
background: var(--Sabre-Blue-2, #EAF9FF);
object-fit: cover;
transition: 0.45s;
cursor: pointer;
}
.kh_understanding_duration {
display: inline-flex;
height: 21px;
padding: 3px 10px;
justify-content: center;
align-items: center;
gap: 5px;
flex-shrink: 0;
border-radius: 50px;
background: var(--Sabre-White, #FFF);
color: var(--Sabre-Purple, #4B08A1);
text-align: center;
font-family: Poppins;
font-size: 12px;
font-style: normal;
font-weight: 500;
line-height: 150%;
letter-spacing: -0.132px;
position: absolute;
right: 14px;
bottom: 10px;
}
.kh_understanding_slide_content {
padding-right: 20px;
}
.kh_understanding_slide_title {
color: var(--Sabre-Purple, #4B08A1);
font-family: Poppins;
font-size: 16px;
font-style: normal;
font-weight: 600;
line-height: 130%;
letter-spacing: -0.176px;
margin-top: 13px;
transition: color 0.45s ease;
margin-bottom: 0;
}
.kh_understanding_slide_tags {
display: flex;
gap: 5px;
flex-wrap: wrap;
margin-top: 19px;
}
.kh_understanding_slide_tag {
display: inline-flex;
height: 21px;
padding: 3px 10px;
justify-content: center;
align-items: center;
gap: 5px;
flex-shrink: 0;
border-radius: 4px;
border: 1px solid var(--Sabre-Purple-2, #F0FAFF);
background: var(--Sabre-Purple-2, #F0FAFF);
color: var(--Sabre-Purple, #4B08A1);
text-align: center;
font-family: Poppins;
font-size: 10px;
font-style: normal;
font-weight: 500;
line-height: 150%;
letter-spacing: -0.11px;
text-decoration: none;
}
.kh_understanding_swiper-button {
display: flex;
width: 60px;
height: 60px;
padding: 18px 17px;
align-items: center;
gap: 10px;
flex-shrink: 0;
border-radius: 30px;
border: 1px solid var(--Sabre-Blue, #00AFFE);
background: var(--Sabre-White, #FFF);
cursor: pointer;
transition: background 0.3s ease;
transform: translateZ(0); /* triggers GPU rendering */
will-change: transform;
}
.kh_understanding_swiper-button:hover {
background: var(--Sabre-Blue, #00AFFE);
}
.kh_understanding_swiper-button:hover svg path {
fill: #ffffff;
}
.kh_understanding_swiper-button-prev {
position: absolute;
left: 70px;
top: 162.5px;
z-index: 2;
}
.kh_understanding_swiper-button-next {
position: absolute;
right: 70px;
top: 162.5px;
z-index: 2;
}
@media (max-width: 767px) {
.kh_understanding {
/* margin-top: 38px; */
}
.kh_understanding_top {
padding: 0 25px 0 0;
margin-left: 25px;
border-top: 1px solid var(--Sabre-Blue, #00AFFE);
}
.kh_understanding_top_inner {
border-top: none;
padding-top: 9px;
}
.kh_understanding_heading {
font-size: 18px;
/* text-wrap-mode: nowrap; */
}
.kh_understanding_link_wrapper-desktop {
display: none;
}
.kh_understanding_link_wrapper-mobile {
display: flex;
flex-direction: row;
padding: 0 25px;
margin-top: 30px;
}
.kh_understanding_swiper-button {
display: none;
}
.kh_understanding .swiper-slide {
width: 295px;
aspect-ratio: 295/166.26;
}
.kh_understanding_duration {
right: 10px;
bottom: 10px;
}
.kh_understanding_slide_title {
font-size: 16px;
}
.kh_understanding_slide_tags {
margin-top: 12px;
}
.kh_understanding_slide:hover .kh_understanding_slide_img {
transform: unset;
}
.kh_understanding_slide:hover .kh_understanding_slide_title {
color: var(--Sabre-Purple, #4B08A1);
}
}
.kh_understanding_swiper-button-prev.swiper-button-disabled,
.kh_understanding_swiper-button-next.swiper-button-disabled {
display: none;
}
.kh_understanding_heading_heading-count {
align-items: center;
}
.kh_understanding_heading {
display: inline-flex;
align-items: stretch;
line-height: 100%;
}
.kh_understanding_heading::before {
content: "";
display: block;
width: 4px;
/* height: 20px; */
background: var(--Sabre-Blue, #00AFFE);
margin-right: 9px;
/* margin-top: 4px; */
}
.kh_understanding_grid-section .kh_understanding_heading::before {
content: none;
}
.total-count {
margin-bottom: -0.4em;
}
@media (max-width: 767px) {
.kh_understanding_heading::before {
margin-right: 6px;
}
.total-count {
margin-bottom: 0em;
}
}
@media (max-width: 420px) {
.kh_understanding_heading {
max-width: 261px;
}
.kh_understanding_heading_heading-count {
align-items: flex-start;
}
.kh_understanding_heading_heading-count .total-count {
margin-top: -2px;
}
}
/* Poster visible by default */
.kh_understanding_poster {
position: absolute;
inset: 0;
width: 100%;
height: 100%;
object-fit: cover;
transition: opacity 0.3s ease;
z-index: 2;
}
/* YouTube iframe hidden until hover */
.kh_understanding_iframe {
position: absolute;
inset: 0;
width: 100%;
height: 100%;
border: 0;
opacity: 0;
transition: opacity 0.3s ease;
z-index: 1;
pointer-events: none; /* ensures clicks go to the */
}
/* On hover: fade iframe in, poster out */
.kh_understanding_slide_img-wrapper:hover .kh_understanding_iframe {
opacity: 1;
z-index: 3;
}
.kh_understanding_slide_img-wrapper:hover .kh_understanding_poster {
opacity: 0;
}
.kh_understanding_grid {
display: grid;
grid-template-columns: repeat(12, 1fr);
gap: 40px 20px;
max-width: calc(1240px + 200px);
margin: 0 auto;
width: 100%;
padding: 0px 100px;
}
.kh_understanding_grid_item_link {
text-decoration: none;
}
.kh_understanding_grid_item {
grid-column: span 4;
text-decoration: none;
display: flex;
flex-direction: column;
justify-content: flex-start;
align-items: flex-start;
height: fit-content;
}
.kh_understanding_grid_item:hover .kh_understanding_slide_img {
transform: scale(1.05);
}
.kh_understanding_grid_item:hover .kh_understanding_slide_title {
color: var(--Sabre-Blue, #00AFFE);
}
.kh_features {
display: flex;
flex-direction: column;
width: 100%;
padding: 0px;
}
.kh_features_top {
display: flex;
flex-direction: row;
justify-content: space-between;
align-items: flex-end;
max-width: calc(1240px + 200px);
margin: 0 auto;
width: 100%;
padding: 0px 100px;
position: relative;
margin-bottom: 20px;
}
.kh_features_top_inner {
display: flex;
flex-direction: row;
justify-content: space-between;
align-items: flex-end;
width: 100%;
border-top: 1px solid var(--Sabre-Blue, #00AFFE);
padding-top: 13px;
}
.kh_features_heading_wrapper {
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
gap: 6px;
}
.kh_features_heading_line {
width: 4px;
height: 20px;
background: var(--Sabre-Blue, #00AFFE);
}
.kh_features_heading_heading-count {
display: flex;
flex-direction: row;
align-items: baseline;
justify-content: flex-start;
gap: 0.5ch;
}
.kh_features_heading {
color: var(--Sabre-Purple, #4B08A1);
font-family: Poppins;
font-size: 24px;
font-style: normal;
font-weight: 700;
line-height: 150%;
letter-spacing: -0.264px;
margin-bottom: 0;
}
.total-count {
color: var(--Sabre-Purple, #4B08A1);
font-family: Poppins;
font-size: 16px;
font-style: normal;
font-weight: 400;
line-height: 150%; /* 20.8px */
letter-spacing: -0.176px;
}
.kh_features_link {
color: var(--Sabre-Blue, #00AFFE);
text-align: right;
font-family: Poppins;
font-size: 14px;
font-style: normal;
font-weight: 500;
line-height: 150%;
letter-spacing: -0.154px;
text-underline-offset: 5px;
text-decoration-thickness: 2px;
margin-bottom: 5px;
display: block;
}
.kh_features_link_wrapper-mobile {
display: none;
}
.kh_features .swiper {
width: 100%;
position: relative;
}
.kh_features .swiper {
max-width: calc(1240px + 200px);
width: 100%;
padding: 0 100px;
position: relative;
margin: 0 auto;
}
@media (min-width: 1400px) {
.kh_features .swiper {
max-width: 1240px;
overflow: hidden;
padding: 0;
}
}
@media (max-width: 767px) {
.kh_features .swiper {
padding-left: 25px;
padding-right: 0px;
}
.kh_features_heading_line {
width: 4px;
height: 13px;
}
}
.kh_features .swiper-wrapper {
display: flex;
}
.kh_features .swiper-slide {
display: flex;
width: 295px;
justify-content: flex-start;
align-items: flex-start;
flex-shrink: 0;
aspect-ratio: 295.00/166.26;
flex-direction: column;
height: fit-content;
text-decoration: none;
}
.kh_features_slide {
text-decoration: none;
}
.kh_features_slide:hover .kh_features_slide_img {
transform: scale(1.05);
}
.kh_features_slide:hover .kh_features_slide_title {
color: var(--Sabre-Blue, #00AFFE);
}
.kh_features_slide_img-wrapper {
overflow: hidden;
position: relative;
}
.kh_features_slide_img {
display: flex;
width: 100%;
aspect-ratio: 295.00/166.26;
height: auto;
background: var(--Sabre-Blue-2, #EAF9FF);
object-fit: cover;
transition: 0.45s;
cursor: pointer;
}
.kh_features_duration {
display: inline-flex;
height: 21px;
padding: 3px 10px;
justify-content: center;
align-items: center;
gap: 5px;
flex-shrink: 0;
border-radius: 50px;
background: var(--Sabre-White, #FFF);
color: var(--Sabre-Purple, #4B08A1);
text-align: center;
font-family: Poppins;
font-size: 12px;
font-style: normal;
font-weight: 500;
line-height: 150%;
letter-spacing: -0.132px;
position: absolute;
right: 14px;
bottom: 10px;
}
.kh_features_slide_content {
padding-right: 20px;
}
.kh_features_slide_title {
color: var(--Sabre-Purple, #4B08A1);
font-family: Poppins;
font-size: 16px;
font-style: normal;
font-weight: 600;
line-height: 130%;
letter-spacing: -0.176px;
margin-top: 13px;
transition: color 0.45s ease;
margin-bottom: 0;
}
.kh_features_slide_tags {
display: flex;
gap: 5px;
flex-wrap: wrap;
margin-top: 19px;
}
.kh_features_slide_tag {
display: inline-flex;
height: 21px;
padding: 3px 10px;
justify-content: center;
align-items: center;
gap: 5px;
flex-shrink: 0;
border-radius: 4px;
border: 1px solid var(--Sabre-Purple-2, #F0FAFF);
background: var(--Sabre-Purple-2, #F0FAFF);
color: var(--Sabre-Purple, #4B08A1);
text-align: center;
font-family: Poppins;
font-size: 10px;
font-style: normal;
font-weight: 500;
line-height: 150%;
letter-spacing: -0.11px;
text-decoration: none;
}
.kh_features_swiper-button {
display: flex;
width: 60px;
height: 60px;
padding: 18px 17px;
align-items: center;
gap: 10px;
flex-shrink: 0;
border-radius: 30px;
border: 1px solid var(--Sabre-Blue, #00AFFE);
background: var(--Sabre-White, #FFF);
cursor: pointer;
transition: background 0.3s ease;
transform: translateZ(0);
will-change: transform;
}
.kh_features_swiper-button:hover {
background: var(--Sabre-Blue, #00AFFE);
}
.kh_features_swiper-button:hover svg path {
fill: #ffffff;
}
.kh_features_swiper-button-prev {
position: absolute;
left: 70px;
top: 126px;
z-index: 2;
}
.kh_features_swiper-button-next {
position: absolute;
right: 70px;
top: 126px;
z-index: 2;
}
@media (max-width: 767px) {
.kh_features {
/* margin-top: 38px; */
}
.kh_features_top {
padding: 0 25px 0 0;
margin-left: 25px;
border-top: 1px solid var(--Sabre-Blue, #00AFFE);
}
.kh_features_top_inner {
border-top: none;
padding-top: 9px;
}
.kh_features_heading {
font-size: 18px;
}
.kh_features_link_wrapper-desktop {
display: none;
}
.kh_features_link_wrapper-mobile {
display: flex;
flex-direction: row;
padding: 0 25px;
margin-top: 30px;
}
.kh_features_swiper-button {
display: none;
}
.kh_features .swiper-slide {
width: 295px;
aspect-ratio: 295/166.26;
}
.kh_features_duration {
right: 10px;
bottom: 10px;
}
.kh_features_slide_title {
font-size: 16px;
}
.kh_features_slide_tags {
margin-top: 12px;
}
.kh_features_slide:hover .kh_features_slide_img {
transform: unset;
}
.kh_features_slide:hover .kh_features_slide_title {
color: var(--Sabre-Purple, #4B08A1);
}
}
.kh_features_swiper-button-prev.swiper-button-disabled,
.kh_features_swiper-button-next.swiper-button-disabled {
display: none;
}
.kh_features_grid {
display: grid;
grid-template-columns: repeat(12, 1fr);
gap: 40px 20px;
max-width: calc(1240px + 200px);
margin: 0 auto;
width: 100%;
padding: 0px 100px;
}
.kh_features_grid_item_link {
text-decoration: none;
}
.kh_features_grid_item {
grid-column: span 4;
text-decoration: none;
display: flex;
flex-direction: column;
justify-content: flex-start;
align-items: flex-start;
height: fit-content;
}
.kh_features_grid_item:hover .kh_features_slide_img {
transform: scale(1.05);
}
.kh_features_grid_item:hover .kh_features_slide_title {
color: var(--Sabre-Blue, #00AFFE);
}
.kh_stories {
display: flex;
flex-direction: column;
width: 100%;
padding: 0px;
}
.kh_stories_top {
display: flex;
flex-direction: row;
justify-content: space-between;
align-items: flex-end;
max-width: calc(1240px + 200px);
margin: 0 auto;
width: 100%;
padding: 0px 100px;
position: relative;
margin-bottom: 20px;
}
.kh_stories_top_inner {
display: flex;
flex-direction: row;
justify-content: space-between;
align-items: flex-end;
width: 100%;
border-top: 1px solid var(--Sabre-Blue, #00AFFE);
padding-top: 13px;
}
.kh_stories_heading_wrapper {
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
gap: 6px;
}
.kh_stories_heading_line {
width: 4px;
height: 20px;
background: var(--Sabre-Blue, #00AFFE);
}
.kh_stories_heading_heading-count {
display: flex;
flex-direction: row;
align-items: baseline;
justify-content: flex-start;
gap: 0.5ch;
}
.kh_stories_heading {
color: var(--Sabre-Purple, #4B08A1);
font-family: Poppins;
font-size: 24px;
font-style: normal;
font-weight: 700;
line-height: 150%;
letter-spacing: -0.264px;
margin-bottom: 0;
}
.total-count {
color: var(--Sabre-Purple, #4B08A1);
font-family: Poppins;
font-size: 16px;
font-style: normal;
font-weight: 400;
line-height: 150%; /* 20.8px */
letter-spacing: -0.176px;
}
.kh_stories_link_wrapper-mobile {
display: none;
}
.kh_stories_link {
color: var(--Sabre-Blue, #00AFFE);
text-align: right;
font-family: Poppins;
font-size: 14px;
font-style: normal;
font-weight: 500;
line-height: 150%;
letter-spacing: -0.154px;
text-underline-offset: 5px;
text-decoration-thickness: 2px;
margin-bottom: 5px;
display: block;
}
.kh_stories .swiper {
width: 100%;
position: relative;
}
.kh_stories .swiper {
max-width: calc(1240px + 200px);
width: 100%;
padding: 0 100px;
position: relative;
margin: 0 auto;
}
@media (min-width: 1400px) {
.kh_stories .swiper {
max-width: 1240px;
overflow: hidden;
padding: 0;
}
}
@media (max-width: 767px) {
.kh_stories .swiper {
padding-left: 25px;
padding-right: 0px;
}
.kh_stories_heading_line {
width: 4px;
height: 13px;
}
}
.kh_stories .swiper-wrapper {
display: flex;
}
.kh_stories .swiper-slide {
display: flex;
width: 295px;
justify-content: flex-start;
align-items: flex-start;
flex-shrink: 0;
aspect-ratio: 295/166.26;
flex-direction: column;
height: fit-content;
text-decoration: none;
}
.kh_stories_slide {
text-decoration: none;
}
.kh_stories_slide:hover .kh_stories_slide_img {
transform: scale(1.05);
}
.kh_stories_slide:hover .kh_stories_slide_title {
color: var(--Sabre-Blue, #00AFFE);
}
.kh_stories_slide_img-wrapper {
overflow: hidden;
}
.kh_stories_slide_img {
display: flex;
width: 100%;
aspect-ratio: 295/166.26;
background: var(--Sabre-Blue-2, #EAF9FF);
object-fit: cover;
transition: .45s;
cursor: pointer;
}
.kh_stories_slide_content {
padding-right: 20px;
}
.kh_stories_slide_date {
color: var(--Sabre-Purple, #4B08A1);
font-family: Poppins;
font-size: 12px;
font-style: normal;
font-weight: 500;
line-height: 160%;
margin-top: 14px;
}
.kh_stories_slide_title {
color: var(--Sabre-Purple, #4B08A1);
font-family: Poppins;
font-size: 16px;
font-style: normal;
font-weight: 600;
line-height: 130%;
letter-spacing: -0.176px;
margin-top: 3px;
transition: color 0.45s ease;
margin-bottom: 0;
}
.kh_stories_slide_tag {
display: inline-flex;
height: 21px;
padding: 3px 10px;
justify-content: center;
align-items: center;
gap: 5px;
flex-shrink: 0;
border-radius: 4px;
border: 1px solid var(--Sabre-Purple-2, #F0FAFF);
background: var(--Sabre-Purple-2, #F0FAFF);
color: var(--Sabre-Purple, #4B08A1);
text-align: center;
font-family: Poppins;
font-size: 10px;
font-style: normal;
font-weight: 500;
line-height: 150%;
letter-spacing: -0.11px;
text-decoration: none;
margin-top: 19px;
}
.kh_stories_swiper-button {
display: flex;
width: 60px;
height: 60px;
padding: 18px 17px;
align-items: center;
gap: 10px;
flex-shrink: 0;
border-radius: 30px;
border: 1px solid var(--Sabre-Blue, #00AFFE);
background: var(--Sabre-White, #FFF);
cursor: pointer;
transition: background 0.3s ease;
transform: translateZ(0);
will-change: transform;
}
.kh_stories_swiper-button:hover {
background: var(--Sabre-Blue, #00AFFE);
}
.kh_stories_swiper-button:hover svg path {
fill: #ffffff;
}
.kh_stories_swiper-button-prev {
position: absolute;
left: 70px;
top: 126px;
z-index: 2;
}
.kh_stories_swiper-button-next {
position: absolute;
right: 70px;
top: 126px;
z-index: 2;
}
@media (max-width: 767px) {
.kh_hero_heading {
font-size: 28px;
}
.kh_stories {
/* margin-top: 38px; */
}
.kh_stories_top {
padding: 0 25px 0 0;
margin-left: 25px;
border-top: 1px solid var(--Sabre-Blue, #00AFFE);
}
.kh_stories_top_inner {
border-top: none;
padding-top: 9px;
}
.kh_stories_heading {
font-size: 18px;
}
.kh_stories_link_wrapper-desktop {
display: none;
}
.kh_stories_link_wrapper-mobile {
display: flex;
flex-direction: row;
padding: 0 25px;
margin-top: 30px;
}
.kh_stories_swiper-button {
display: none;
}
.kh_stories_slide_date {
font-size: 10px;
}
.kh_stories_slide_title {
font-size: 16px;
}
.kh_stories_slide_tag {
margin-top: 12px;
}
.kh_stories_slide:hover .kh_stories_slide_img {
transform: unset;
}
.kh_stories_slide:hover .kh_stories_slide_title {
color: var(--Sabre-Purple, #4B08A1);
}
}
.kh_stories_swiper-button-prev.swiper-button-disabled,
.kh_stories_swiper-button-next.swiper-button-disabled {
display: none;
}
.kh_stories_grid {
display: grid;
grid-template-columns: repeat(12, 1fr);
gap: 40px 20px;
max-width: calc(1240px + 200px);
margin: 0 auto;
width: 100%;
padding: 0px 100px;
}
.kh_stories_grid_item_link {
text-decoration: none;
}
.kh_stories_grid_item {
grid-column: span 4;
text-decoration: none;
display: flex;
flex-direction: column;
justify-content: flex-start;
align-items: flex-start;
height: fit-content;
}
.kh_stories_grid_item:hover .kh_stories_slide_img {
transform: scale(1.05);
}
.kh_stories_grid_item:hover .kh_stories_slide_title {
color: var(--Sabre-Blue, #00AFFE);
}
.kh_brochures {
display: flex;
flex-direction: column;
width: 100%;
padding: 0px;
}
.kh_brochures_top {
display: flex;
flex-direction: row;
justify-content: space-between;
align-items: flex-end;
max-width: calc(1240px + 200px);
margin: 0 auto;
width: 100%;
padding: 0px 100px;
position: relative;
margin-bottom: 20px;
}
.kh_brochures_top_inner {
display: flex;
flex-direction: row;
justify-content: space-between;
align-items: flex-end;
width: 100%;
border-top: 1px solid var(--Sabre-Blue, #00AFFE);
padding-top: 13px;
}
.kh_brochures_heading_wrapper {
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
gap: 6px;
}
.kh_brochures_heading_heading-count {
display: flex;
flex-direction: row;
align-items: baseline;
justify-content: flex-start;
gap: 0.5ch;
}
.kh_brochures_heading_line {
width: 4px;
height: 20px;
background: var(--Sabre-Blue, #00AFFE);
}
.kh_brochures_heading {
color: var(--Sabre-Purple, #4B08A1);
font-family: Poppins;
font-size: 24px;
font-style: normal;
font-weight: 700;
line-height: 150%;
letter-spacing: -0.264px;
margin-bottom: 0;
}
.total-count {
color: var(--Sabre-Purple, #4B08A1);
font-family: Poppins;
font-size: 16px;
font-style: normal;
font-weight: 400;
line-height: 150%; /* 20.8px */
letter-spacing: -0.176px;
}
.kh_brochures_link {
color: var(--Sabre-Blue, #00AFFE);
text-align: right;
font-family: Poppins;
font-size: 14px;
font-style: normal;
font-weight: 500;
line-height: 150%;
letter-spacing: -0.154px;
text-underline-offset: 5px;
text-decoration-thickness: 2px;
margin-bottom: 5px;
display: block;
}
.kh_brochures_link_wrapper-mobile {
display: none;
}
.kh_brochures .swiper {
width: 100%;
position: relative;
}
.kh_brochures .swiper {
max-width: calc(1240px + 200px);
width: 100%;
padding: 0 100px;
position: relative;
margin: 0 auto;
}
@media (min-width: 1400px) {
.kh_brochures .swiper {
max-width: 1240px;
overflow: hidden;
padding: 0;
}
}
@media (max-width: 767px) {
.kh_brochures .swiper {
padding-left: 25px;
padding-right: 0px;
}
.kh_brochures_heading_line {
width: 4px;
height: 13px;
}
}
.kh_brochures .swiper-wrapper {
display: flex;
}
.kh_brochures .swiper-slide {
display: flex;
width: 295px;
justify-content: flex-start;
align-items: flex-start;
flex-shrink: 0;
aspect-ratio: 295/166.26;
flex-direction: column;
height: fit-content;
text-decoration: none;
}
.kh_brochures_slide {
text-decoration: none;
}
.kh_brochures_slide:hover .kh_brochures_slide_img {
transform: scale(1.05);
}
.kh_brochures_slide:hover .kh_brochures_slide_title {
color: var(--Sabre-Blue, #00AFFE);
}
.kh_brochures_slide_img-wrapper {
overflow: hidden;
position: relative;
}
.kh_brochures_slide_img {
display: flex;
width: 100%;
height: auto;
aspect-ratio: 295/166.26;
aspect-ratio: 210 / 297;
background: var(--Sabre-Blue-2, #EAF9FF);
object-fit: cover;
transition: 0.45s;
cursor: pointer;
}
.kh_brochures_slide_content {
padding-right: 20px;
}
.kh_brochures_slide_title {
color: var(--Sabre-Purple, #4B08A1);
font-family: Poppins;
font-size: 16px;
font-style: normal;
font-weight: 600;
line-height: 130%;
letter-spacing: -0.176px;
margin-top: 13px;
transition: color 0.45s ease;
margin-bottom: 0;
}
.kh_brochures_slide_tags {
display: flex;
gap: 5px;
flex-wrap: wrap;
margin-top: 19px;
}
.kh_brochures_slide_tag {
display: inline-flex;
height: 21px;
padding: 3px 10px;
justify-content: center;
align-items: center;
gap: 5px;
flex-shrink: 0;
border-radius: 4px;
border: 1px solid var(--Sabre-Purple-2, #F0FAFF);
background: var(--Sabre-Purple-2, #F0FAFF);
color: var(--Sabre-Purple, #4B08A1);
text-align: center;
font-family: Poppins;
font-size: 10px;
font-style: normal;
font-weight: 500;
line-height: 150%;
letter-spacing: -0.11px;
text-decoration: none;
}
.kh_brochures_swiper-button {
display: flex;
width: 60px;
height: 60px;
padding: 18px 17px;
align-items: center;
gap: 10px;
flex-shrink: 0;
border-radius: 30px;
border: 1px solid var(--Sabre-Blue, #00AFFE);
background: var(--Sabre-White, #FFF);
cursor: pointer;
transition: background 0.3s ease;
transform: translateZ(0);
will-change: transform;
}
.kh_brochures_swiper-button:hover {
background: var(--Sabre-Blue, #00AFFE);
}
.kh_brochures_swiper-button:hover svg path {
fill: #ffffff;
}
.kh_brochures_swiper-button-prev {
position: absolute;
left: 70px;
top: 250px;
z-index: 2;
}
.kh_brochures_swiper-button-next {
position: absolute;
right: 70px;
top: 250px;
z-index: 2;
}
@media (max-width: 767px) {
.kh_brochures {
/* margin-top: 38px; */
}
.kh_brochures_top {
padding: 0 25px 0 0;
margin-left: 25px;
border-top: 1px solid var(--Sabre-Blue, #00AFFE);
}
.kh_brochures_top_inner {
border-top: none;
padding-top: 9px;
}
.kh_brochures_heading {
font-size: 18px;
}
.kh_brochures_link_wrapper-desktop {
display: none;
}
.kh_brochures_link_wrapper-mobile {
display: flex;
flex-direction: row;
padding: 0 25px;
margin-top: 30px;
}
.kh_brochures_swiper-button {
display: none;
}
.kh_brochures .swiper-slide {
width: 295px;
aspect-ratio: 295/166.26;
}
.kh_brochures_slide_title {
font-size: 16px;
}
.kh_brochures_slide_tags {
margin-top: 12px;
}
.kh_brochures_slide:hover .kh_brochures_slide_img {
transform: unset;
}
.kh_brochures_slide:hover .kh_brochures_slide_title {
color: var(--Sabre-Purple, #4B08A1);
}
}
.kh_brochures_swiper-button-prev.swiper-button-disabled,
.kh_brochures_swiper-button-next.swiper-button-disabled {
display: none;
}
.kh_brochures_grid {
display: grid;
grid-template-columns: repeat(12, 1fr);
gap: 40px 20px;
max-width: calc(1240px + 200px);
margin: 0 auto;
width: 100%;
padding: 0px 100px;
}
.kh_brochures_grid_item_link {
text-decoration: none;
}
.kh_brochures_grid_item {
grid-column: span 3;
text-decoration: none;
display: flex;
flex-direction: column;
justify-content: flex-start;
align-items: flex-start;
height: fit-content;
}
.kh_brochures_grid_item:hover .kh_brochures_slide_img {
transform: scale(1.05);
}
.kh_brochures_grid_item:hover .kh_brochures_slide_title {
color: var(--Sabre-Blue, #00AFFE);
}
.kh_downloads {
display: flex;
flex-direction: column;
width: 100%;
padding: 0px 100px;
max-width: calc(1240px + 200px);
margin: 0 auto;
height: auto;
}
.kh_downloads_inner {
display: flex;
flex-direction: column;
width: 100%;
align-items: flex-start;
justify-content: flex-start;
padding: 40px;
height: 100%;
background: url('https://sabreadhesives.wphostsites.nz/wp-content/uploads/2025/06/sabre-brochure-mockup-scaled.jpg');
background-size: cover;
background-position: top;
background-repeat: no-repeat;
background-position: top right;
background-size: contain;
background-color: #eaf9ff;
}
.kh_downloads_heading-wrapper {
display: flex;
flex-direction: row;
align-items: center;
justify-content: center;
gap: 6px;
}
.kh_downloads_heading_line {
width: 4px;
height: 20px;
background: var(--Sabre-Blue, #00AFFE);
}
.kh_downloads_heading {
color: var(--Sabre-Purple, #4B08A1);
font-family: Poppins;
font-size: 24px;
font-style: normal;
font-weight: 700;
line-height: 150%; /* 36px */
letter-spacing: -0.264px;
min-width: fit-content;
margin-bottom: 0;
}
.kh_downloads_search {
display: flex;
flex-direction: column;
gap: 12px;
margin-top: 47px;
}
.kh_downloads_search_heading {
color: var(--Sabre-Purple, #4B08A1);
font-family: Poppins;
font-size: 16px;
font-style: normal;
font-weight: 700;
line-height: 150%; /* 24px */
letter-spacing: -0.176px;
margin-bottom: 0;
}
@media (max-width: 767px) {
.kh_downloads {
padding: 0px;
}
.kh_downloads_inner {
padding: 30px 25px 26px 25px;
background: #eaf9ff;
}
.kh_downloads_heading {
font-size: 18px;
letter-spacing: -0.198px;
}
.kh_downloads_search_heading {
font-size: 14px;
letter-spacing: -0.154px;
}
.kh_downloads_search {
margin-top: 30px;
gap: 15px;
}
.kh_downloads_heading_line {
width: 4px;
height: 13px;
}
}
.kh_downloads .asp_select2 {
width: 500px !important;
background: white !important;
border: 1px solid var(--Sabre-Purple, #4B08A1) !important;
}
.kh_downloads .asp_select2-dropdown {
border: 1px solid var(--Sabre-Purple, #4B08A1) !important;
}
.kh_downloads .asp_main_container {
border-radius: 9999999px !important;
}
.kh_downloads_search-results {
display: block;
width: 100%;
/* margin-top: 100px; */
}
.kh_downloads_search-results .asp_item_overlay {
display: none !important;
}
.kh_downloads_search-results .asp_content {
background-color: #ffffff !important;
box-shadow: none !important;
}
.kh_downloads_search-results .resdrg {
/* display: flex; */
/* grid-template-columns: 1fr 1fr 1fr; */
/* gap: 20px; */
display: flex !important;
gap: 20px !important;
align-items: stretch;
flex-wrap: wrap;
align-content: space-between;
height: auto !important;
justify-content: space-between;
}
.kh_downloads_search-results .ajaxsearchpro {
border: none !important;
border-radius: 10px !important;
background: transparent !important;
box-shadow: none !important;
}
.kh_downloads_search-results .results .item {
border-radius: 10px !important;
border: none !important;
border-radius: 10px;
width: 48% !important;
position: relative !important;
top: unset !important;
left: unset !important;
margin: 0 !important;
height: fit-content !important;
}
.kh_downloads_search-results .results .item .asp_content {
padding: 20px !important;
height: 100% !important;
padding: 4px;
background: rgb(255, 255, 255);
border-radius: 3px;
border: none;
border-radius: 3px 3px 3px 3px;
box-shadow: 0 4px 28px -13px rgb(0, 0, 0);
}
.kh_downloads_search-results .results .item .asp_content .asp_res_url {
color: var(--Sabre-Purple, #4B08A1) !important;
font-family: Poppins !important;
font-size: 14px !important;
font-style: normal !important;
font-weight: 500 !important;
line-height: 150% !important; /* 21px */
letter-spacing: -0.154px !important;
}
.kh_downloads_search-results .results .item .asp_content h4 {
color: var(--Sabre-Purple, #4B08A1);
text-align: center;
font-family: Poppins;
font-size: 10px !important;
font-style: normal;
font-weight: 500;
line-height: 150%; /* 15px */
letter-spacing: -0.11px;
display: flex;
height: 21px;
padding: 3px 10px;
align-items: center;
gap: 5px;
border-radius: 4px;
border: 1px solid var(--Sabre-Purple-2, #F0FAFF);
background: var(--Sabre-Purple-2, #F0FAFF);
width: fit-content;
}
.kh_downloads_search-results .results .item .asp_content p {
color: var(--Sabre-Purple, #4B08A1);
font-family: Poppins;
font-size: 18px;
font-style: normal;
font-weight: 600;
line-height: 150%; /* 27px */
letter-spacing: -0.198px;
margin-top: 7px;
}
.kh_downloads_search-results .results .item .asp_content a.view,
.kh_downloads_search-results .results .item .asp_content p.view
{
display: flex !important;
gap: 5px;
align-items: center;
color: var(--Sabre-Purple, #4B08A1) !important;
font-family: Poppins !important;
font-size: 14px !important;
font-style: normal !important;
font-weight: 500 !important;
line-height: 150% !important; /* 21px */
letter-spacing: -0.154px !important;
margin-top: 13px !important;
}
.kh_downloads_search-results .results .item .asp_content a.view img {
width: 24px;
height: 24px;
}
.kh_downloads_search-results .results .item .asp_content .asp_res_text {
display: none;
}
.kh_downloads .asp_select2-container--flat .asp_select2-selection--single .asp_select2-selection__rendered {
background: #ffffff;
color: var(--Sabre-Purple, #4B08A1) !important;
font-family: Poppins !important;
}
.page-template-template-knowledge-hub .asp_select2-container .asp_select2-results__options {
background: #ffffff;
color: var(--Sabre-Purple, #4B08A1) !important;
font-family: Poppins !important;
}
.page-template-template-knowledge-hub .asp_select2-container span {
background: #ffffff;
color: var(--Sabre-Purple, #4B08A1) !important;
font-family: Poppins !important;
}
.page-template-template-knowledge-hub .asp_select2-container span.asp_select2-dropdown {
border: 1px solid var(--Sabre-Purple, #4B08A1) !important;
border-radius: 0;
}
.page-template-template-knowledge-hub .asp_select2-container--flat span.asp_select2-search input {
background: #ffffff;
color: var(--Sabre-Purple, #4B08A1) !important;
font-family: Poppins !important;
font-weight: 500;
font-size: 16px;
}
.page-template-template-knowledge-hub .asp_select2-container--flat .asp_select2-results__option--highlighted[aria-selected] {
background: var(--Sabre-Purple, #4B08A1) !important;
color: #ffffff !important;
font-family: Poppins !important;
}
.page-template-template-knowledge-hub span.asp_nores_header {
background: #ffffff;
color: var(--Sabre-Purple, #4B08A1) !important;
font-family: Poppins !important;
}
.page-template-template-knowledge-hub .asp_select2-container--flat .asp_select2-results__option[aria-selected=true] {
background: unset;
color: unset;
font-family: unset;
opacity: 1;
}
@media (max-width: 767px) {
.kh_downloads_search-results .results .item {
width: 100% !important;
}
.kh_downloads .asp_select2 {
width: 300px !important;
}
}
.kh_ask-an-expert {
display: flex;
flex-direction: column;
width: 100%;
padding: 0px 100px;
max-width: calc(1240px + 200px);
margin: 0 auto;
margin-top: 49px;
}
.kh_ask-an-expert_inner {
display: flex;
gap: 25px;
width: 100%;
justify-content: space-between;
align-items: center;
border-top: 1px solid var(--Sabre-Purple, #4B08A1);
padding-top: 30px;
padding-bottom: 42px;
flex-wrap: wrap;
}
.kh_ask-an-expert_heading {
color: var(--Sabre-Purple, #4B08A1);
font-family: Poppins;
font-size: 42px;
font-style: normal;
font-weight: 700;
line-height: 150%; /* 63px */
letter-spacing: -0.462px;
min-width: fit-content;
margin-bottom: 0;
}
.kh_ask-an-expert_links {
display: flex;
flex-direction: row;
align-items: center;
gap: 78px;
justify-content: flex-end;
}
.kh_ask-an-expert_link {
color: var(--Sabre-Purple, #4B08A1);
font-family: Poppins;
font-size: 20px;
font-style: normal;
font-weight: 500;
line-height: 150%;
letter-spacing: -0.22px;
text-decoration: none;
min-width: fit-content;
transition: .2s ease;
}
.kh_ask-an-expert_link:hover {
color: var(--Sabre-Blue, #00AFFE);
}
.kh_ask-an-expert_link span {
color: var(--Sabre-Blue, #00AFFE);
font-family: Poppins;
font-size: 20px;
font-style: normal;
font-weight: 600;
line-height: 150%; /* 30px */
letter-spacing: -0.22px;
}
.kh_ask-an-expert_btn {
display: inline-flex;
padding: 12px 20px;
justify-content: center;
align-items: center;
gap: 10px;
background: var(--Sabre-Blue, #00AFFE);
color: var(--Sabre-White, #FFF);
font-family: Poppins;
font-size: 16px;
font-style: normal;
font-weight: 600;
line-height: 150%; /* 24px */
letter-spacing: -0.176px;
text-decoration: none;
transition: .5s ease;
min-width: fit-content;
}
.kh_ask-an-expert_btn:hover {
opacity: .5;
}
@media (max-width: 767px) {
.kh_ask-an-expert {
padding: 0px 25px;
/* margin-top: 39px; */
}
.kh_ask-an-expert_inner {
padding-top: 17px;
padding-bottom: 30px;
flex-direction: column;
justify-content: flex-start;
align-items: flex-start;
gap: 1px;
}
.kh_ask-an-expert_heading {
font-size: 24px;
letter-spacing: -0.264px;
}
.kh_ask-an-expert_links {
gap: 15px;
justify-content: space-between;
width: 100%;
}
.kh_ask-an-expert_link {
font-size: 16px;
}
}
.kh_newsletter {
background: var(--Sabre-Purple-2, #F0FAFF);
display: flex;
flex-direction: column;
width: 100%;
padding: 0px;
padding-top: 46px;
padding-bottom: 50px;
}
.kh_newsletter_inner {
display: flex;
gap: 46px;
margin: 0 auto;
width: 100%;
padding: 0px 100px;
max-width: calc(1240px + 200px);
}
.kh_newsletter_heading-wrapper {
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
gap: 6px;
}
.kh_newsletter_heading_line {
width: 4px;
height: 20px;
background: var(--Sabre-Blue, #00AFFE);
}
.kh_newsletter_heading {
color: var(--Sabre-Purple, #4B08A1);
font-family: Poppins;
font-size: 24px;
font-style: normal;
font-weight: 700;
line-height: 150%; /* 36px */
letter-spacing: -0.264px;
min-width: fit-content;
margin-bottom: 0;
}
@media (max-width: 767px) {
.kh_newsletter {
padding-top: 30px;
padding-bottom: 40px;
}
.kh_newsletter_inner {
padding: 0px 25px;
}
.kh_newsletter_heading {
font-size: 18px;
}
.kh_newsletter_heading_line {
width: 4px;
height: 13px;
}
}
/* New styles Dec 24 */
.sb_newsletter {
background: #f5f5f5;
color: #4b08a1;
}
.sb_newsletter .fd-form-control {
border-radius: 0px !important;
}
.sb_newsletter .ff-65dfbb5f169219458e8a539d__footer {
width: fit-content;
}
.sb_newsletter .fd-btn {
border-radius: 0px !important;
width: fit-content !important;
}
.sb_newsletter.false {
display: block !important;
}
.sb_newsletter.true {
display: none !important;
}
.sb_newsletter_white {
background: #ffffff;
}
.sb_newsletter_blue {
background: #00a6e4;
color: #ffffff;
}
.sb_newsletter_blue .fd-form-control {
color: #ffffff !important;
border: 1px solid #ffffff !important;
}
.sb_newsletter_blue .fd-form-label {
color: #ffffff !important;
}
.sb_newsletter_blue .fd-btn {
background: #4b08a1 !important;
}
.sb_newsletter_purple {
background: #4b08a1;
color: #ffffff;
}
.sb_newsletter_purple .fd-form-control {
color: #ffffff !important;
border: 1px solid #ffffff !important;
}
.sb_newsletter_purple .fd-form-label {
color: #ffffff !important;
}
.sb_newsletter_purple .fd-btn {
background: #00a6e4 !important;
}
.sb_newsletter .ff-65dfbb5f169219458e8a539d__title {
display: none !important;
}
.sb_newsletter .ff-65dfbb5f169219458e8a539d__subtitle {
display: none !important;
}
.sb_newsletter .heading-cell {
grid-column-end: span 5;
}
.sb_newsletter .heading-cell p {
margin-top: 25px;
}
.sb_newsletter .text-cell {
grid-column-start: 8;
grid-column-end: span 5;
}
.sb_newsletter .ff-65dfbb5f169219458e8a539d__form {
padding: 0 !important;
}
.sb_newsletter .ff-65dfbb5f169219458e8a539d__container {
margin: 0 !important;
}
@media (max-width: 767px) {
.sb_newsletter .header-container {
grid-template-columns: 1fr;
}
.sb_newsletter .text-cell {
grid-column-start: 1;
}
.sb_newsletter .heading-cell{
max-width: 75%;
}
}
.page-template-template-knowledge-hub .asp_select2-container, .page-template-template-knowledge-hub .asp_select2-container ul, .page-template-template-knowledge-hub .asp_select2-container ul li, .page-template-template-knowledge-hub .asp_select2-container span {
font-family: "Poppins" !important;
font-size: 16px !important;
/* line-height: 24px !important; */
font-weight: 500 !important;
color: #4b08a1 !important;
}