body {
    opacity: 0;
    transition: opacity 0.6s ease-in;
    background-color: #f6f6f6;
}

body.loaded {
    opacity: 1;
}

p{
    font-size:20px;
}

.notification-bar .container{
    display:flex;
    flex-direction: row;
    text-align: center;
}

.notification-bar .container a{
    color:white;
    text-decoration:underline;
}

.header.home-header {
    top: 56px;
}
.home-page .content {
    padding-top: 182px;
}

.header .navbar-nav .dropdown-menu {
    padding: 44px 15px;
}

.header-bottom .navbar-nav .nav-item .nav-link {
    padding: 0 0 30px 0;
}

.header-top .navbar-nav {
    justify-content: flex-end;
    align-items: baseline;
}

.header-top .navbar-nav .search{
    position:relative;
    margin-right:2rem;
    margin-left:2rem;
}
.header-top .navbar-nav .search .header-search-icon{
    position: absolute;
    width: 22px;
    height: auto;
    top: -15px;
    right: -10px;   
}

.home-page .header-search-bar.show {
    top: 0px;
}


.header-top .header-btn .btn {
    font-size: 16px;
    line-height: 24px;
    font-weight: 700;
    letter-spacing: 1px;
    padding: 10px 25px;
}

#main section {
    background-color:white;
}

.section-head{
    margin-bottom: 60px;
}

 .section-preheading *{
  font-size: 17px;
  font-family: "Barlow";
  color: #f5ab0a;
  font-weight: bold;
  text-transform: uppercase;
  line-height: 1.2;
  text-align: center;
}

.section-heading *{
  font-size: 53px;
  font-family: "Barlow";
  color: #344157;
  font-weight: bold;
  line-height: 1.2;
  text-align: center;
}

.section-description *{
    text-align: center;
    max-width: 940px;
    margin: auto;
}

section.gradient-corners{
    background: linear-gradient(125.71deg,
      rgba(16, 153, 172, 0.3) 1.56%,
      rgba(255, 255, 255, 0) 32.09%,
      rgba(255, 255, 255, 0.2) 76.25%,
      rgba(245, 171, 10, 0.3) 100%);
}

/* ===============================
   Hero Section
   =============================== */


#main > section.banner-wrp.main-banner-wrp {
    padding:0;
}

.banner-wrp-content {
    max-width: 740px;
}

.banner-wrp-content .main-title h2{
    font-size: 52px;
    line-height: 62px;    
}

.banner-wrp-content .large-detail {
    font-size: 22px;
    line-height: 26px;
    font-weight: 400;
}

/* Gradient overlay using ::before pseudo-element */
.banner-img figure::before {
    content: '';
    position: absolute;
    top:0;
    left:0;
    width: 100%;
    height: 100%;
    background: linear-gradient(
        135deg,
        rgba(19, 61, 75, 0.95) 0%,
        rgba(19, 61, 75, 0.85) 25%,
        rgba(19, 61, 75, 0.6) 50%,
        rgba(19, 61, 75, 0.3) 70%,
        rgba(19, 61, 75, 0) 100%
    );
    z-index: 1;
}

.banner-img::after{
  background-image: -moz-linear-gradient( 127deg, rgb(16,153,172) 0%, rgb(7,103,117) 67%);
  background-image: -webkit-linear-gradient( 127deg, rgb(16,153,172) 0%, rgb(7,103,117) 67%);
  background-image: -ms-linear-gradient( 127deg, rgb(16,153,172) 0%, rgb(7,103,117) 67%);
  position: absolute;
  top:0;
  left:0;
  z-index: 3;
}

.banner-overlay-img {
    object-fit: fill;
    mix-blend-mode: normal;
    position:absolute;
    top:0;
    left:0;
    z-index: 2;
    mask-image: linear-gradient(to left, rgba(0,0,0,1) 75%, rgba(0,0,0,0) 100%);
    -webkit-mask-image: linear-gradient(to left, rgba(0,0,0,1) 75%, rgba(0,0,0,0) 100%);
    width:100%;
    height:100%;
    max-height: 100%;
}

.banner-inner{
    z-index:4;
    max-height: 100%;
}

.main-banner-wrp .banner-content {
    padding: 157px 0 145px 0;
    max-height: 100%;
}

.banner-content {
    padding: 75px 0 30px 0;
}

/* ===============================
   Simple Banner
   =============================== */

.inner-banner .banner-item{
    position: relative;
    height:100%;
    max-height:574px;
}

.simpleBanner .banner-item{
    position:relative;
}


.inner-banner .banner-content {
    padding: 80px 0 80px 0;
}

/* ===============================
   Feature Row (2 col / Media + Text)
   =============================== */
.features-section{
    padding: 4rem 0;
}

.feature-row{
    padding: 4rem 0;
}

.who-we-serve .split-content-row {
    display: flex;
    flex-direction: column;
    border-bottom: 2px solid;
    border-image: linear-gradient(180deg, rgb(16,153,172) 0%, rgb(7,103,117) 100%) 1;
    padding-bottom:2rem;
}

.split-content-row:last-child {
    border-bottom: none;
}

/* Cells */
.split-content-cell {
    padding: 1.5rem;
    align-content: center;
}

/*  Feature Row Media  */
.split-content-image img {
    width: 100%;
    height: auto;
    border-radius: 6px;
}

.split-content-image figcaption {
    margin-top: 0.5rem;
    font-size: 0.875rem;
    color: #666;
}

/* Feature Row Text Content */
.split-content-title {
  font-size: 22px;
  font-family: "Barlow";
  color: #3C4557;
  font-weight: bold;
  line-height: 1.2;
}

.split-content-text {
    font-size: 1rem;
    color: #555;
    max-width: 560px;
    margin-top: 1rem;
}

.split-content-text ul{
    padding-left:15px;
}

.split-content-text ul li p{
    margin-bottom:0.5rem;
}

.split-content-header {
    display: flex;
    gap: 1rem;
    justify-content: flex-start;
    align-items: flex-end;
    margin-bottom:3rem;
}

.split-content-icon {
    width: 80px;
    height: 80px;
    flex-shrink: 0;
}

.who-we-serve .split-content-row {
    display: flex;
    flex-direction: row;
}

/* ===============================
   Static Banner Section
   =============================== */

.static-banner-section{
    padding: 4rem 0;
}

.static-banner {
    margin: 0 auto;
    text-align: center;
}

.static-banner-section {
    position: relative;
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
}

.static-banner-section img{
    opacity:0.3;
}

.static-banner-section .banner-overlay-img{
    mask-image:unset;
}

.static-banner-heading h2 {
    font-size: 24px;
    font-weight: 700;
    color: #344157;
    margin-bottom: 20px;
    line-height: 1.3;
}

.static-banner-content p {
    font-size: 22px;
    font-weight: 400;
    color: #6c757d;
    margin-bottom: 30px;
    line-height: 1.5;
}

.static-banner-large h3 {
    font-size: 64px;
    font-weight: 700;
    color: #1099ac;
    margin-bottom: 0;
    line-height: 1.2;
}

/* Subtle gradient overlay */
.static-banner-section::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    /* Very subtle top-to-bottom gradient */
    background: linear-gradient(
        to bottom,
        rgba(0, 0, 0, 0.02) 0%,
        rgba(255, 255, 255, 0.02) 100%
    );
    z-index: 0;
    pointer-events: none;
}

/* ===============================
   Quote Section
   =============================== */

.quote-section {
    padding: 4rem 0;
    z-index: -1;
}
.testimonial-inner {
    display: flex;
    align-items: flex-start;
}

.testimonial-inner .quote{
    max-width:162px;
}

.testimonial-inner .testimonial-flx {
    margin-left: 28px;
}

.testimonial-inner .block-title * {
    text-decoration: none;
    font-size: inherit;
    line-height: inherit;
    font-weight: inherit;
    margin: 0;
    color:white;
}

.testimonial-inner .block-title {
    font-size: 36px;
    line-height: 40px;
    font-weight: 400;
}

.testimonial-inner .common-detail {
    text-transform: uppercase;
    color: var(--white);
    margin-top: 22px;
}

/* ===============================
   Quote Section
   =============================== */

 .quote-section .banner-overlay-img{
    mix-blend-mode: lighten;
    opacity: 0.75;
 }

.quote-section .block-title p{
    display:inline;
}

.quote-section .block-title::after {
    content: '"'; /* Or use """ for curly quote */
    font-size: 1.1em;
    color: #fff;
    display:inline;
}


.message-text p{
  font-size: 36px;
  font-family: "Barlow";
  color: rgb(255, 255, 255);
  line-height: 1; 
}

/* ===============================
   CardGrid Section
   =============================== */

.card-grid-section {
    padding: 4rem 0;
}

.card-grid-section .banner-overlay-img {
    mix-blend-mode: plus-lighter;
    opacity: 0.3;
}

.card-grid-section .feature-card{
    z-index: 2;
}

.our-story .card-grid-section h3.card-title{
    font-weight: 400;
    font-size:3rem;
}

.feature-card{
    border-radius: 11px 11px 80px 11px;
    background-image: -moz-linear-gradient( -45deg, rgb(16,153,172) 0%, rgb(7,103,117) 100%);
    background-image: -webkit-linear-gradient( -45deg, rgb(16,153,172) 0%, rgb(7,103,117) 100%);
    background-image: -ms-linear-gradient( -45deg, rgb(16,153,172) 0%, rgb(7,103,117) 100%);
    padding: 46px;
    height: calc(100% - 12px);
    margin-bottom: 12px;
}
.feature-card .feature-icon{
    mix-blend-mode: color-dodge;
    margin-bottom:1.25rem;
}

.feature-card .card-title{
    font-size: 24px;
    font-family: "Barlow";
    color: rgb(255, 255, 255);
    font-weight: bold;
    line-height: 1.1;
    margin-bottom:1.25rem;
}
.feature-card .card-text{
    font-size: 20px;
    font-family: "Barlow";
    color: rgb(255, 255, 255);
    font-weight: 400;
    line-height: 1;
}

.feature-card.service-card{
    padding:15px;
}

/* ===============================
   Call To Action Section
   =============================== */
.callToAction-section {
    padding: 4rem 0;
}



/* ===============================
   Full Width Text Section
   =============================== */

.full-width-text-section {
    padding: 4rem 0;
}

.full-width-text-section .banner-overlay-img {
    mix-blend-mode: plus-lighter;
    opacity: 0.3;
}

.full-width-text-section .row {
    display: flex;
    flex-direction: column;
    border-bottom: 2px solid;
    border-image: linear-gradient(180deg, rgb(16,153,172) 0%, rgb(7,103,117) 100%) 1;
    padding-bottom:2.5rem;
    margin-bottom:2.5rem;
}

.full-width-text-section .row:last-child {
    border-bottom: none;
}

/* ===============================
   Featured Event/Blog/Resource Section
   =============================== */
.featured-blog-wrapper {
    padding:0;
}

.featured-blog-inner {
    max-width: unset;
    margin: 100px 0 50px 0;
}

.featured-blog-right .sub-title {
    color: var(--trueBlue);
    margin-bottom: 1.5rem;
    font-weight: bold;
}

.featured-blog-img img{
    width: 700px;
    height: 500px !important;
}

.filter-blogs-main {
    padding-bottom: 71px;
}


.featured-blog-right .read-more {
    font-size: 20px;
    line-height: 24px;
    color: var(--trueBlue);
    font-weight: 700;
    display: flex;
    transition: 0.4s;
    -webkit-transition: 0.4s;
    -moz-transition: 0.4s;
    -ms-transition: 0.4s;
    -o-transition: 0.4s;
    display: inline-flex;
    margin: auto 0 0 0;
}

.blog-block-detail{
    padding: 26px 64px 25px 25px;
    max-width: 652px;
    width: 100%;
    display: flex;
    flex-direction: column;
}

.blog-block-box {
    display: flex;
    border-radius: 11px;
    background: #fff;
    box-shadow: 0px 0px 20px rgba(0, 0, 0, 0.1);
    margin-bottom: 29px;
    height: Calc(100% - 29px);
}

.resource.blog-block-box.resource {
    height: 100%;
    max-height: 315px;
}

.resource-filter .blog-block-detail .large-detail {
    margin:35px 0 0 0;
}

.resource.blog-block-box.resource .large-detail{
    margin:35px 0 15px 0;
}

.resource-filter .blog-block-detail .common-detail {
    padding:0;
}

.filter-blog-right{
    height: fit-content;
}

.large-detail {
    margin-bottom: 1.1rem;
}

.block-title {
    display: -webkit-box;
    -webkit-box-orient: vertical;
    overflow: hidden;
    font-weight:bold;
}

.common-detail {
    flex: 1;
}

.blog-posts-grid{
    margin-top:100px;
}

.featured-blog-right .author-wrp {
    display: flex;
    align-items: center;
    margin: 19px 0 37px 0;
}

.featured-blog-right .author-wrp img {
    border-radius: 50%;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    -ms-border-radius: 50%;
    -o-border-radius: 50%;
    margin-right: 9px;
    height: 62px;
    width: 62px;
}

.blog-block-detail .created-by {
    font-size: 16px;
    line-height: normal;
    text-transform: uppercase;
    margin: 1rem 0;
}

.blog-block-detail .created-by * {
    margin-bottom: 0;
    font-size: 16px;
}

.blog-block-detail .created-by span {
    font-weight: 700;
}

.blog-block-inner .common-detail {
    margin: 0 0 0 0;
    line-height: 19px;
    
}
.blog-block-detail .common-detail {
    line-height: 19px;
    min-height: 75px;
    padding:0;
}

.event-block-img {
  padding: 1.5rem;
}

.event-block-img img {
    object-fit: contain;
}

.blog-story-inner-wrapper {
    max-width: 1330px;
    margin: 4rem 0;
}

.blog-story-inner {
    display: flex;
    flex-wrap: wrap;
}

.blog-story-inner .back {
    margin: 8px 38px 0 0;
    display: flex;
    align-items: center;
    font-weight: normal;
    font-size: 14px;
    line-height: normal;
    height: 21px;
}

.blogs-story-content {
    max-width: 828px;
}

.blogs-story-resource {
    width:100%;
    max-width: 300px;
    margin-left: 35px;
}

.blogs-story-authors {
    display: flex;
    padding: 21px 0 24px;
    border-top: 1px solid #bfbfbf;
    border-bottom: 1px solid #bfbfbf;
    margin-bottom: 84px;
    justify-content: space-between;
    align-items: center;
}
.blog-story-imgs {
    display: flex;
    align-items: center;
}

.blog-story-imgs img {
    border-radius: 50%;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    -ms-border-radius: 50%;
    -o-border-radius: 50%;
    margin-right: 12px;
    height: 62px;
    width: 62px;
}

.blog-story-imgs p {
    text-transform: uppercase;
    font-weight: normal;
    font-size: 16px;
    margin-bottom: 0;
}

.blog-story-imgs p span {
    font-weight: 700;
    text-decoration: underline;
    cursor: pointer;
}

@media (min-width: 768px) {
    .authors {
        display: inline-flex;
        gap: 1.25rem;
    }
        .authors .author {
        justify-items: center;
    }
        .container.no-bio {
        padding: 50px 0 0 0;
    }
}

.blog-author-banner .inner-banner-detail{
    z-index:3;
}

.blog-author-banner .inner-banner-content{
    margin:0;
}

.author-page-filter .author-blog-bottom{
    padding:0 15px;
}

.blog-author-banner .author-block-details .author-img {
    border-radius: 50%;
    overflow: hidden;
    width: 115px;
    height: 115px;
    margin-right: 22px;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    -ms-border-radius: 50%;
    -o-border-radius: 50%;
}

.blog-author-banner .author-block-details {
    display: flex;
    align-items: center;
    margin-top: 53px;
}

.social-icon ul,
.blog-author-banner .author-postion ul {
    list-style: none;
    display: flex;
    padding: 0;
    margin: 0;
}

.podcast-story {
    padding-bottom: 100px;
    padding-top: 50px;
}


/* ===============================
   Filters
   =============================== */
.browse-all-providers .filter-blogs-wrp {
  margin-top: 37px;
}

.browse-all-providers .filter-blog-left {
  margin-right: 20px;
  max-width: 317px;
}

.active-filters {
    display: flex;
    align-items: center;
    margin-bottom: 36px;
}

.active-filters .clear-all {
    font-weight: 700;
    text-transform: uppercase;
    font-size: 16px;
    line-height: 19px;
    padding-left: 15px;
}

.filter-blog-right {
  width: 100%;
}

.filter-blogs-wrp {
  display: flex;
}

.filter-blog-left .search .input-icn {
  position: absolute;
  left: 24px;
  z-index: 1;
  top: 20px;
}

.filter-blog-left {
  max-width: 371px;
  width: 100%;
  margin-right: 62px;
}

.filter-blog-left .search {
  position: relative;
}

.filter-blog-left .search .form-control::placeholder {
  color: #afafaf;
  font-family: "Barlow";
  font-weight: bold;
  letter-spacing: 0.05em;
  text-transform: uppercase;
}

.filter-blog-left .search .form-control {
  padding: 20px 20px 20px 65px;
  color: var(--charcoalBlue);
  font-weight: 500;
  text-transform: unset;
  font-size: 20px;
  line-height: 24px;
  border-radius: 33px;
  border: 1px solid #858ea0;
  -webkit-border-radius: 33px;
  -moz-border-radius: 33px;
  -ms-border-radius: 33px;
  -o-border-radius: 33px;
}

.filter-blog-left .search .form-control:focus {
  box-shadow: unset;
}

.filter .large-detail {
  font-size: 20px;
  font-weight: 700;
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 21px 0 0;
  border-top: 1px solid #858ea0;
}

.blog-block-detail .created-by * {
  margin-bottom: 0;
}

.filter {
  margin-top: 36px;
}

.filter-by-solution {
  margin-bottom: 20px;
  cursor: pointer;
}

.filter-flx {
  display: none;
}

.filter-flx.active {
  display: flex;
  flex-direction: column;
}

.filter-flx a {
  margin-top: 20px;
  font-size: 18px;
  line-height: 23px;
  display: inline-flex;
}

.filter-flx a:hover {
  color: var(--trueBlue);
}

/* ===============================
   Resource Gate & Ungated
   =============================== */

.flex-container {
    display: flex;
    flex-wrap: wrap;
    padding-top:50px;
}

.request-form-wrapper{
    background-color: #fff;
    padding-bottom:100px!important;
}


@media (min-width: 768px) {

    .request-form-wrapper .right-side {
        flex: 0 0 35%;
    }
    .request-form-wrapper .left-side {
        flex: 0 0 63%;
    }
    .request-form-wrapper .join-firm-main {
        margin: 50px 0;
        padding-right:50px;
    }
    .getResource-btn {
        padding: 2rem 0;
        text-align: center;
    }

    .right-side img{
        max-width:100%;
    }

    .right-side .getResource-btn{
        text-align:center;
        margin: 0 auto 20px auto;
    }
}


/* ===============================
   Glossary
   =============================== */

.glossary-section {
    padding: 2rem 0;
    margin-top: 75px;
}

/* Filter Styles */
.glossary-filter {
    padding: 1.5rem;
    margin-bottom: 75px;
    border-top: solid 1px rgb(46, 56, 76);
    border-bottom: solid 1px rgb(46, 56, 76);
}

.glossary-filter .row{
    align-items: center;
    border-top
}


.filter-label {
    font-size: 20px;
    font-family: "Barlow";
    color: rgb(46, 56, 76);
    font-weight: bold;
}

.filter-letters {
    display: flex;
    align-items: center;
    gap: 1rem;
    flex-wrap: wrap;
}

.letter-btn {
    background: transparent;
    border: none;
    padding: 0.5rem 1rem;
    cursor: pointer;
    font-size: 20px;
    font-family: "Barlow";
    color: rgb(46, 56, 76);
    line-height: 1.2;
    transition: all 0.2s;
    position: relative;
}

.letter-btn:hover {
    color: #008B8B;
}

.letter-btn.active {
    color: #008B8B;
}

.letter-btn.active::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    height: 2px;
    background: #008B8B;
}

.separator {
    color: #999;
    font-size: 1rem;
    user-select: none;
}

/* Grid Layout */
.glossary-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(250px, 1fr));
    gap: 2rem;
}

/* Card Container */
.glossary-card-container {
    perspective: 1000px;
    height: 250px;
    transition: opacity 0.3s, transform 0.3s;
}

.glossary-card-container.hidden {
    display: none;
}

/* Flip Card */
.glossary-card {
    width: 100%;
    height: 100%;
    position: relative;
    cursor: pointer;
}

.card-inner {
    width: 100%;
    height: 100%;
    position: relative;
    transform-style: preserve-3d;
    transition: transform 0.6s;
}

.glossary-card:hover .card-inner,
.glossary-card.flipped .card-inner {
    transform: rotateY(180deg);
}

.card-front,
.card-back {
    position: absolute;
    width: 100%;
    height: 100%;
    backface-visibility: hidden;
    border-radius: 0 0 60px 0;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 1.5rem;
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
}

.card-front {
    background: #008B8B;
    color: white;
}

.card-front h3 {
    font-size: 1.25rem;
    font-weight: 600;
    text-align: center;
    margin: 0;
}

.card-back {
    background: #006B6B;
    color: white;
    transform: rotateY(180deg);
    overflow-y: auto;
}

.card-back-content {
    text-align: left;
}

.card-back h4 {
    font-size: 1rem;
    font-weight: 600;
    margin-bottom: 0.5rem;
}

.card-back p {
    font-size: 1.0rem;
    line-height: 1.375;
    margin: 0;
}

.GenericPage .full-width-text-section h2{
    margin-bottom:0.6em;
}

.search-section .search-details {
    flex: 0 0 auto;
    max-width: 350px;
}


.btn-check:checked+.btn, .btn-white-border.active, .btn-white-border.show, .btn-white-border:first-child:active, :not(.btn-white-border-check)+.btn-white-border:active,
.btn-white-border.focus, .btn-white-border:first-child:focus, :not(.btn-white-border-check)+.btn-white-border:focus,
.btn-white-border.focus-visible, .btn-white-border:first-child:focus-visible, :not(.btn-white-border-check)+.btn-white-border:focus-visible
{
    background-color: transparent;
    border: 2px solid var(--white);
    color: var(--white);
    padding: 19px 38px;
    font-size: 20px!important;
    text-decoration: none;
}

.modal-body {
    padding: 0 0 0 0;
}

.right-side {
    position: relative;
    display: flex;
    flex-direction: column;
}

.play_icon {
    display: inline-flex;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 96px;
    height: 96px;
    background: url('/media/psrjjwaa/play_btn.svg') no-repeat center center;
    background-size: 100% 100%;
    transition: 0.1s ease-in;
    z-index: 10;
}

/* Responsive */
@media (max-width: 768px) {
    /* Layout & Container */
    .container {
        padding: 0 15px;
    }
    
    #main {
        padding: 0;
        margin: 0;
        position: relative;
    }

    /* Header */
    .header {
        height: 81px;
        background-color: rgba(255, 255, 255, 0.95);
    }
    
    .header-top-mobile .navbar-nav {
        padding: 0 36px 33px 23px;
    }
    
    .header-bottom .navbar-nav {
        border-bottom: none;
    }
    
    .header-bottom .navbar-nav .nav-item .nav-link {
        padding: 0;
        font-size: 1.3rem;
        line-height: 1.3rem;
    }

    /* Navigation & Dropdowns */
    .navbar-nav .btn {
        width: 75%;
    }
    
    .nav-link.dropdown-toggle.show {
        transition: none;
    }
    
    .header .navbar-nav .dropdown-menu.mobile.show,
    .header .navbar-nav .dropdown-menu.mobile {
        top: 67px;
        transition: none!important;
        -webkit-transition:none!important;
    }
    
    .dropdown-menu.mobile.show h2 {
        font-size: 1.5rem;
    }

    /* Banner */
    .banner-img {
        display: none;
    }
    
    .main-banner-wrp .banner-inner {
        margin: 0;
        padding: 0;
    }
    
    .main-banner-wrp .banner-content {
        padding: 75px 15px;
        max-height: 100%;
    }
    
    .inner-banner .banner-item {
        max-height: unset;
    }



    /* Call to Action */
    .callToAction-section .btn {
        margin-top: 34px;
    }

    /* Glossary */
    .glossary-grid {
        grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
        gap: 1rem;
    }
    
    .filter-letters {
        gap: 0.5rem;
    }
    
    .letter-btn {
        padding: 0.4rem 0.6rem;
        font-size: 0.875rem;
    }
    
    .separator {
        font-size: 0.875rem;
    }

    .footer {
        padding: 200px 0 38px 0;
    }

    .play_icon {
        display: block;
        width: 96px;
        height: 96px;
        background: url('/media/psrjjwaa/play_btn.svg') no-repeat center center;
        background-size: 100% 100%;
        transition: 0.1s ease-in;
    }
}

@media (min-width: 768px) {
    .home-header ~ #main {
        margin-top:56px;
    }
    .banner-content .large-detail {
        max-width: 605px;
    }
    .container-fluid {
        max-width: 1920px;
    }
}