/* CSS Document */

/* Ad Styles : START */
    
#topAd{
    background-color: black;
    border-bottom: 1px solid #424242;
    padding: 15px 0;
    position: relative;
    z-index: 1065;
}

.ad_728x90_container{
    display: grid;
    padding: 0px 0px;
    margin: 0px auto;
    text-align: center;
    grid-template-columns: auto auto;
    justify-content: center;
    align-content: center;
}

.ad_728x90_text{
    font-size: 8px;
    text-transform: uppercase;
    display: inline-block;
    text-align: center;
    writing-mode: vertical-rl;
    transform: rotate(180deg);
    margin: 0px;
    height: auto;
    color: black;
    padding-left: 1px;
}

#topAd .ad_728x90_text{
    color: white;
}

.ad_728x90{
    width: max-content;
    display: grid;
    align-content: center;
/*    height: 100%;*/
/*    display: inline-block;*/
/*    border: solid 1px #424242;*/
}

.ad_728x90 > div {
    border: solid 1px #424242;
}

@media (max-width: 770px) {
  .ad_728x90_container {
    display: none;
  }
}
    

.ad-300x250-container{
    margin: 0 auto;
    text-align: center;
    width: 302px;
}

.advertisement-text-300x250 {
    font-size: 8px;
    text-transform: uppercase;
    display: block;
    text-align: center;
    margin: 0px auto 1px auto ;
}
    
.ad-image-container{
    display: inline-block;
    margin: 0px auto;
    width: max-content;
} 

.ad-image-container img{
    display: inline-block;
    margin: 0px auto;
} 
    
/*
.top-ad-sidebar{
    height: 100%;
}
*/



#heroAd{
    margin-bottom: 1.5rem;
}

@media (max-width: 1100px){
    #heroAd{
        margin-bottom: 3rem;
    }
}


.full-width-ad{
    padding: 1.5rem 0;
    background-color: var(--grey-bg-clr);
    border-top: 1px solid #CCCCCC;
    border-bottom: 1px solid #CCCCCC;
}


.c-article__in-line-ad .ad-image-container img{
    margin-bottom: 0px;
} 

/* Ad Styles : END */

/* Archive Page Styles : START */

main .pub-archive-page {
    background-color: var(--grey-bg-clr);
    padding: 2rem 0;
}

#pubArchive {
    position: relative;
}

.archive-dates{
    margin: 1.75rem 0 2rem 0;
    padding: 1rem 0;
    border-top: 1px solid #E6E6E6;
    border-bottom: 1px solid #E6E6E6;
}

.swiper{
/*    width: calc(100% - 50px);*/
    padding: 0 2rem;
}

/*
.swiper::before {
  background: linear-gradient(90deg,#fff,#fff) repeat-x;
  background: linear-gradient(90deg,#fff,hsla(0,0%,100%,0)) repeat-x;
  left: -2px;
}

.swiper::after {
  background: linear-gradient(90deg,#fff,#fff) repeat-x;
  background: linear-gradient(90deg,hsla(0,0%,100%,0),#fff) repeat-x;
  right: -2px;
}
*/

.swiper-button-next, .swiper-button-prev {
    width: calc(var(--swiper-navigation-size)/ 44 * 40);
    color: rgba(0,0,0,.5);
    transition: .2 ease-in-out;
}

.swiper-button-next.swiper-button-disabled, .swiper-button-prev.swiper-button-disabled {
    color: rgba(0,0,0,.3);
    transition: .2 ease-in-out;
}

.swiper-button-prev, .swiper-rtl .swiper-button-next {
    left: var(--swiper-navigation-sides-offset,0px);
    right: auto;
    background: linear-gradient(90deg, rgb(255, 255, 255) 0%, rgba(255,255,255,0.7) 70%, rgba(255,255,255,0) 100%);
    padding: 0 10 0 0;
}

.swiper-button-next, .swiper-rtl .swiper-button-prev {
    right: var(--swiper-navigation-sides-offset,0px);
    left: auto;
    background: linear-gradient(-90deg, rgb(255, 255, 255) 0%, rgba(255,255,255,0.7) 70%, rgba(255,255,255,0) 100%);
    padding: 0 0 0 10px;
}

.swiper-button-next::after, .swiper-button-prev::after {
  font-family: 'Material Icons';
  font-size: 1rem;
  text-transform: none !important;
  letter-spacing: 0;
  font-variant: initial;
  line-height: 1;
}

.swiper-button-prev::after{
    content: "\e5e0";
}

.swiper-button-next::after{
    content: "\e5e1";
}

.swiper-slide {
    text-align: center;
    font-size: 18px;
    background: #fff;
    display: flex;
    justify-content: center;
    align-items: center;
}

.active-issue{
    font-weight: 800;
}

.pv-page .active-issue a{
    color: var(--pv-clr);
}

.swiper-slide a{
    text-decoration: none;
    color: var(--dark);
}




.archive-issues-grid {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr 1fr 1fr;
  grid-column-gap: 1.5rem;
  grid-row-gap: 2.5rem;
}

@media (max-width: 950px) {
   .archive-issues-grid {
      grid-template-columns: 1fr 1fr 1fr 1fr;
    } 
}

@media (max-width: 750px) {
   .archive-issues-grid {
      grid-template-columns: 1fr 1fr 1fr;
    } 
}

@media (max-width: 550px) {
   .archive-issues-grid {
      grid-template-columns: 1fr 1fr;
    } 
}

.archive-issues-grid h1{
    grid-column: 1/6;
    text-align: center;
    font-size: 1.5rem;
    margin: 0; 
}

@media (max-width: 950px) {
   .archive-issues-grid h1{
       grid-column: 1/5;
    } 
}

@media (max-width: 750px) {
   .archive-issues-grid h1{
       grid-column: 1/4;
    } 
}

@media (max-width: 550px) {
   .archive-issues-grid h1{
       grid-column: 1/3;
    } 
}

.archive-issue{
    
}

.archive-issue a:first-child{
    display: inline-block;
    margin-bottom: .5rem;
    transition: .2s ease-in-out;
}

.archive-issue a:first-child:hover{
    transform: scale(1.01);
    transition: .2s ease-in-out;
}



.archive-issue img{
    width: 100%;
    max-width: 220px;
    border: 1px solid #E6E6E6;
    box-shadow: 0 0 8px rgba(0, 0, 0, 0.08);
    z-index: 1;
    transition: .2s ease-in-out;
}

.archive-issue img:hover{
    width: 100%;
    max-width: 220px;
    border: 1px solid #E6E6E6;
    box-shadow: 0 0 8px rgba(0, 0, 0, 0.08);
    z-index: 1;
    transition: .2s ease-in-out;
}

.archive-issue a:last-child{
    display: block;
    text-align: center;
    text-decoration: none;
    color: var(--dark);
    transition: .2s ease-in-out;
}

.archive-issue a:last-of-type h2{
    margin: 0;  
    font-size: 1.05rem;
    transition: .2s ease-in-out;
}

.archive-issue a:last-child p{
    margin: 0;  
    font-size: .85rem;
    transition: .2s ease-in-out;
}

.pv-page .archive-issue a:last-child:hover h2, .pv-page .archive-issue a:last-child:hover p{
    color: var(--pv-clr);
    transition: .2s ease-in-out;
}

/* Archive Page Styles : END */


/* Article Styles : START */

#article-page{
    background-color: #F2F2F2;
    padding-bottom: 1px;
}

.article-content p, .article-content li{
    font-size: 18px;
}

.article-container{
    background-color: white;
    border: 1px solid #E6E6E6;
    padding: 1.5rem;
}

.article-body-grid{
    display: grid;
    grid-template-columns: 30px 1fr;
    grid-column-gap: 3rem;
    grid-row-gap: 1.5rem;
    position: relative;
}


.article-body-grid > * {
  min-width: 0;
}

.article-container img{
    max-width: 100%;
}





#article-page .sidebar-container{
    display: grid;
    grid-template-rows: auto 1fr;
}

/*
.sidebar-grid-2{
    display: grid;
    grid-template-rows: 1fr 1fr;
}
*/

@media (max-width: 1100px) {
#article-page .sidebar-container{
    grid-template-rows: auto auto;
}
    
/*
    .sidebar-grid-2{
        grid-template-rows: auto auto;
    }
*/
}

@media (max-width: 650px){
    .article-body-grid{
        grid-template-columns: 1fr;
        grid-gap: 1.5rem;
    }
}





/* Article Header Styles */

.article-header{
    overflow: hidden;
    /* border-bottom: 1px solid #CCCCCC; */
}

.article-header p {
    font-size: .75rem;
    font-family: var(--header-font);
    font-weight: 800;
    margin: 0;
}

.content-tag{
    font-size: .85rem;
    text-transform: uppercase;
    letter-spacing: .05rem;
    margin-bottom: 0.25rem;
    font-weight: normal;
    position: relative;
    overflow: hidden;
    
}

.content-tag span {
    margin: 0 0 5px .5rem;
    padding: 0 0 0 .5rem;
    border-left: 1px solid #CCCCCC;
    line-height: 1;
    font-size: inherit;
    break-inside: avoid-column;
    position: relative;
    left: calc(-1rem - 1px);
}

.authors-list{
    display: flex;
    flex-wrap: wrap;
    margin: 1.25rem 0 1.5rem 0;
    line-height: 25px;
    font-size: .65rem;
}

.author{
    margin: 0 .75rem 0 0;
    line-height: inherit;
    font-size: inherit;
}

.authors-list p.by-author{
    padding: 0;
    margin: 0;
    line-height: 25px;
}

/*
.author:first-child{
    margin: 0 1rem 5px 0;
}
*/

.pub-date-issue-page-container{
    display: block;
    overflow: hidden;
    position: relative;
}

.pub-date-issue-page{
    display: flex;
    flex-wrap: wrap;
    font-size: .65rem;
    text-transform: uppercase;
    letter-spacing: .025rem;
    line-height: 1;
    color: #5B5B5B;
    margin-bottom: 1rem;
    position: relative;
    left: calc(-1rem - 1px);
    overflow: hidden;
}

.pub-date-issue-page span{
    margin: 0 0 5px .5rem;
    padding: 0 0 0 .5rem;
    border-left: 1px solid #CCCCCC;
    line-height: 1;
    font-size: inherit;
    break-inside: avoid-column;
}

.pub-name{
    font-style: italic;
    text-transform: uppercase;
    font-weight: 700;
    color: var(--dark);
}

/*.article-container .article-header button{
    line-height: 1;
    font-size: .75rem;
    background-color: transparent;
    color: #5B5B5B;
    border: 1px solid #CCCCCC;
    padding: .25rem .5rem;
}*/

.article-container .article-header button:hover{
    background-color: #CCCCCC;
}

.article-container .article-header .show-all{
    display: none;
}

.article-container .article-header .show-fewer{
    display: none;
}





.pv-page .article-author-date a{
    font-weight: bold;
    color: var(--pv-clr);
    text-decoration: none;
    transition: .2s ease-in-out;
}

.pv-page .article-author-date a:hover{
    text-decoration: underline;
    transition: .2s ease-in-out;
}







/* Social Media Aside Styles */

.article-aside{
    height: 100%;
    padding: 2.5rem 1.75rem 0 0;
}

.article-aside .sticky-top{
    position: sticky;
    top: 80px;
    z-index: 1000;
}

.article-aside .social-icons-container a{
    display: inline-block;
}

.social-icons{
    margin-bottom: 1rem;
    width: 30px;
}

.social-icon{
    fill: #666666;
    transition: .2s ease-in-out;
}

.social-icons:hover svg path, .social-icons:hover svg polygon{
    fill: var(--pv-clr);
    transition: .2s ease-in-out;
}

@media (max-width: 1100px) {
    .article-body-grid .article-aside .sticky-top {
        position:sticky;
        /* position: relative; */
    }
}

@media (max-width: 650px){
    .article-aside .sticky-top{
        top: 0;
    }
    
    .article-aside {
        padding: 1rem 1.75rem 0 0;
        border-bottom: 1px solid #CCC;
    }
        
    .article-aside .social-icons-container a{
        margin-right: .5rem;
    }
}








/* Article Body Content Styles */

.article-content{
    padding: 1.5rem 3rem 0 0;
    margin: 0 auto;
    max-width: 800px;
    justify-self: center;
}

.article-content :is(h1, h2, h3, h4, h5, h6, p):first-child{
    margin-top: 0;
}

.article-content h2.article__title, .article__title, .article-content h2{
    font-size: 1.75rem;
    font-family: var(--header-font);
    font-weight: 800;
    margin-top: 1.5rem;
}

.article-content h3.article__title, .article__title, .article-content h3{
    font-size: 1.55rem;
    font-family: var(--header-font);
    font-weight: 800;
    margin-top: 1.5rem;
}

.article-content h4{
    font-size: 1.25rem;
    font-family: var(--header-font);
    font-weight: 800;
    margin-top: 1.5rem;
}

.article__image_full_width{
    width: 100%;
}



.article-content figure {
    margin: 0 0 1rem 0;
}

.article-content figure.float-left {
    /*width: 350px;*/
    max-width: 350px;
    /*max-width: 100%;*/
    display: inline-block;
    margin: 0 1rem .25rem 0;
    float: left;
}

.article-content figure.float-right {
    /*width: 350px;*/
    max-width: 350px;
    /*max-width: 100%;*/
    display: inline-block;
    margin: 0 0 .25rem 1rem;
    float: right;
}

.article-content figure > .fig-img-container{
    display: grid;
    align-items: center;
    width: 100%;
/*
    background-color: #F2F2F2;
    border: 1px solid #CCCCCC;
*/
}

.article-content figure .fig-img-container .fig-img{
    position: relative;
    width: auto;
/*    width: 100%;*/
    max-width: 100%;
    margin: 0 auto;
}

.article-content figure .fig-img-container > img{
/*    width: 100%;*/
    width: auto;
    max-width: 100%;
    margin: 0 auto;
}

.article-content figure.floating-left .fig-img-container > img, .article-content figure.floating-right .fig-img-container > img{
    width: auto;
}

.article-content figure .fig-img-container .fig-img .expand-overlay{
    position: absolute;
    top: 10px;
    right: 10px;
    opacity: 0;
    display: flex;
    align-items: center;
    background-color: rgba(0,0,0,0.75);
    padding: .25rem .35rem;
    line-height: 1;
    border-radius: .25rem;
    transition: .2s ease-in-out;
}

.article-content figure .fig-img-container .fig-img:hover .expand-overlay{
    opacity: 1;
    transition: .2s ease-in-out;
}

.article-content figure .fig-img-container .fig-img svg{
    width: 15px;
}

.article-content figure .fig-img-container .fig-img svg path{
    fill: white;
}

.article-content figure .fig-img-container .fig-img .expand-overlay p{
    margin: 0 0 0 .35rem;
    font-size: .85rem;
    text-transform: uppercase;
    letter-spacing: .02rem;
    color: white;
    font-weight: 400;
}

.article-content figure .fig-img-container .fig-img:hover .expand-overlay:hover svg path, .article-content figure .fig-img-container .fig-img:hover .expand-overlay:hover p{
    opacity: .75;
    transition: .2s ease-in-out;
}

.article-content figure img{
    display: block;
    width: auto; 
    max-width: 100%;
    margin: 0 auto 1rem auto;
}

.article-content figure img:last-child{
    margin: 0 auto 0 auto;
}

.article-content figcaption, .figure__caption, .article__caption{
    font-size: .85rem;
    color: #757575;
    padding-top: .5rem;
    padding-bottom: .5rem;
    margin-bottom: 0;
    border-bottom: 1px solid #D5D5D5;
}

.article-content figcaption p{
    font-size: .85rem;
    color: #757575;
    margin-bottom: 0;
}



.article__callout{
    background-color: #F2F2F2;
    border: 1px solid #CCCCCC;
    padding: 1rem 1.5rem;
    margin: 0 0 1.5rem 0;
}


.article__callout.float-left{
    width: 300px;
    display: inline-block;
    margin: 0 1rem .25rem 0;
    float: left;
}

.article__callout.float-right{
    width: 300px;
    display: inline-block;
    margin: 0 0 .25rem 1rem;
    float: right;
}

@media (max-width: 750px) {
    .article__callout.float-left{
        width: 100%;
        margin: 0 0 1rem 0;
    }

    .article__callout.float-right{
        width: 100%;
        margin: 0 0 1rem 0;
    }
}

.c-article__callout h2:first-child, .c-article__callout h3:first-child, .c-article__callout h4:first-child, .c-article__callout p:first-child, .c-article__callout ul:first-child{
    margin-top: 0;
}

.article__callout h2:first-child, .article__callout h3:first-child, .article__callout h4:first-child, .article__callout p:first-child, .article__callout ul:first-child{
    margin-top: 0;
}

.article__callout p:last-child, .article__callout li:last-child, .article__callout ul:last-child{
    margin-bottom: 0;
}

.article__references__section h3{
    padding-top: 1.5rem;
    border-top: 1px solid #CCC;
    line-height: 1;
    margin-bottom: 1rem;
}

.article__references li, .c-article__references li{
    word-wrap: break-word; 
}

.article__in-line-ad{
    display: inline-block;
    width: 100%;
    border-top: 1px solid #CCCCCC;
    border-bottom: 1px solid #CCCCCC;
    padding: .5rem 0 1rem 0;
    margin: 2rem 0;
}

.article__related{
    display: inline-block;
    width: 100%;
    border-top: 1px solid #CCCCCC;
    border-bottom: 1px solid #CCCCCC;
    padding: 1rem 0;
    margin: 1.5rem 0;
}

.article-body-grid .article-content .article__related a{
    text-decoration: none;
    color: var(--dark);
    font-family: var(--header-font);
    font-weight: 800;
}

.article__related p{
    margin-bottom: 0;
}

.article__related span{
    font-family: var(--header-font);
    font-weight: 500;
    text-transform: uppercase;
    letter-spacing: .02rem;
}

.pvarticle .lity-content .lity-image img{
    height: 90vh;
    object-fit: contain;
}

.article__author-card{
/*
    display: grid;
    grid-template-columns: 80px 1fr;
*/
    display: flex;
    grid-gap: 1rem;
    min-height: 20px;
    padding: 16px;
    margin-bottom: 20px;
    background-color: #f5f5f5;
    border: 1px solid #e3e3e3;
    border-radius: 2px;
}

.article__author-photo{
    width: 80px;
}

.author-photo-container{
/*
    aspect-ratio: 1 / 1;
    border-radius: 50rem;
    overflow: hidden;
*/
}

.article-content .article__author-photo figure{
    margin: 0 0 0 0;
    width: 80px;
}

.article-content .article__author-photo img{
    object-fit: cover;
    object-position: center center;
    width: 100%;
}

.article__author-bio p{
    font-size: 1rem;
    line-height: 1.3;
}

.article-content .article__author-card a.btn-small{
    color: #5B5B5B;
    text-decoration: none;
}

.article-content .article__author-card a.btn-small:hover{
    color: inherit; 
    text-decoration: none;
}

@media (max-width: 650px) {
    .article-content{
        padding: 0;
    }
}


/* Table Styles */

.hscroll, .o-table-container{
    display:inline-block;
    width: 100%;
    margin: 0 0 15px 0;
    overflow-x: auto;
    scrollbar-color: var(--dark) #fafafa;
    scrollbar-width: thin;
    background: linear-gradient(to right, rgba(255, 255, 255, 1), rgba(255, 255, 255, 1), rgba(255, 255, 255, 0) calc(20px * 2)), radial-gradient(farthest-side at 0 0%, rgba(34,34,34, 0.15), rgba(255, 255, 255, 0)), linear-gradient(to left, rgba(255, 255, 255, 1), rgba(255, 255, 255, 1), rgba(255, 255, 255, 0) calc(20px * 2)), radial-gradient(farthest-side at 100% 50%, rgba(34,34,34, 0.15), rgba(255, 255, 255, 0)) 100%;
    background-color: rgba(255, 255, 255, 1);
    background-repeat: no-repeat;
    background-attachment: local, scroll, local, scroll;
    background-size: 100% 100%, 20px 200%, 100% 100%, 20px 200%;
}

.article-content table caption{
  caption-side: initial;
}





/* Article Pagination Styles */

.article-pagination{
    margin-top: 2.5rem;
}






/* Article Tag Styles */

.article-meta{
    border-top: 1px solid #CCC;
    padding: 1.5rem 0 0 0;
    margin-top: 1.5rem;
}

.article-meta h4{
    font-size: .7rem;
    text-transform: uppercase;
    letter-spacing: .025rem;
    line-height: 1;
    color: #5B5B5B;
    font-weight: 800;
    margin-bottom: 1rem;
    text-align: left;
}

.article-tag{
    padding: .5rem 1rem;
    border: 1px solid #CCCCCC;
    border-radius: .25rem;
    text-decoration: none;
    color: #000000;
    font-size: .85rem;
    font-weight: 700;   
    transition: .2s ease-in-out;
}

@media (max-width: 650px) {
    .article-meta {
        grid-column: 1/2;
    }
}









/* Related Bottom Content */

.related-content-bottom{
    display: grid;
    grid-template-columns: 1fr 1fr 1fr 1fr;
    grid-gap: 1.5rem;
    margin-bottom: 1.5rem;
}

.bottom-card{
    width: 100%;
    background-color: white;
    border: 1px solid #E6E6E6;
}

.bottom-card .thumb-image{
    width: 100%;
    overflow: hidden;
}

.bottom-card .thumb-image img{
    width: 100%;
    height: 100%;
    aspect-ratio: 16 / 9;
    object-fit: cover;
    object-position: center center;
}

.podcastpage .bottom-card .thumb-image img {
  width: 100%;
  height: 100%;
  aspect-ratio: 10 / 9;
  object-fit: cover;
  object-position: center center;
}

.bottom-card .card-copy{
    padding: 1rem;
}

@media (max-width: 900px){
    .related-content-bottom{
        grid-template-columns: 1fr 1fr;
    } 
}

@media (max-width: 600px){
    .related-content-bottom{
        grid-template-columns: 1fr;
    } 
}











/* PV Styles */

.pv-page .article-content a{
    color: var(--vs-primary-tan-80);
    text-decoration: none;
    transition: .2s ease-in-out;
}

.pv-page .article-content a:hover{
    color: var(--pv-clr);
    text-decoration: underline;
    transition: .2s ease-in-out;
}

.pv-page .article-tag:hover{
    border: 1px solid var(--pv-clr);
    background-color: var(--pv-clr);
    color: white; 
    transition: .2s ease-in-out;
}

.pv-page .article-content .btn a, .pv-page .article-content a.btn{
    color: white;
    text-decoration: none;
    transition: .2s ease-in-out;
}

.pv-page .article-content .btn a:hover, .pv-page .article-content a.btn:hover{
    text-decoration: none;
    transition: .2s ease-in-out;
}

/* Article Styles : END */


/* Author Styles : START */

main .author-profile-page {
    background-color: var(--grey-bg-clr);
    padding: 2rem 0;
}

.author-profile {
  background-color: white;
  padding: 2rem;
  border: 1px solid #E6E6E6;
}

.author-bio-section{
    display: grid;
    grid-template-columns: auto 1fr;
    grid-gap: 1.5rem;
    margin-bottom: 3rem;
}

@media (max-width: 650px) {
    .author-bio-section{
        grid-template-columns: 1fr;
    }
}

.author-bio-section h1{
    margin-bottom: 0;
}

.author-bio-section img{
    width: 150px;
    border: 1px solid #E6E6E6;
    margin: 0 auto;
}

.author-social a, p.author-social{
    font-size: .65rem;
    text-transform: uppercase;
    letter-spacing: .025rem;
    line-height: 1;
    color: #5B5B5B;
    margin-bottom: .75rem;
    text-decoration: none;
}

.author-bio{
    line-height: 1.3;
}

.author-bio-section h2{
    margin-top: 1.5rem;
}

.author-bio-section .btn{
    padding-top: .15rem;
}

.author-bio-section .btn::after{
    font-family: 'Material Icons';
    display: inline-block;
    opacity: .65;
    position: relative;
    top: 2.5px;
    content: "\e5e1";
    padding-left: 5px;
    transition: .2s ease-in-out;
}




.author-articles{
    
}


.author-articles h1.section-title{
    border-top: none;
    border-bottom: 3px solid #CCC;
}


.author-filters {
    display: grid;
    grid-template-columns: auto;
    justify-content: flex-start;
    margin: 2rem 0;
}

.author-articles .card-copy{
    padding: 0 0 1rem 0;
    margin: 0 0 1rem 0;
    border-bottom: 1px solid #B3B3B3;
}

.author-articles .card-copy .author-name {
  margin: 0 0 .5rem 0;
  font-weight: 500;
}

.author-articles .card-copy p:last-child {
  font-size: .9rem;
  color: #5B5B5B;
  font-weight: 200;
  margin-bottom: 0;
}




.resource-item-page{
    
}

main .resource-item-page {
    background-color: var(--grey-bg-clr);
    padding: 2rem 0;
}

.resource-item-page .cover-text-grid{
    border-bottom: 0px !important;
}


.resource-item-page .cover-text-grid .content-container{
    line-height: 1.3;
}

/* Author Styles : END */

/* Event Styles : START */

.c-sponsored-landing__header img { 
    width: 500px;
    margin: 0 auto;
}	

.c-sponsored-landing__twitter {
    border: 1px solid #000000;
    height: 200px;
    width: 100%;
}

.anchor{
    position: relative;
    top: -120px;
}

.eventpage hr{
    margin: 4rem auto;
}

.c-sponsored-landing__button a {
    text-decoration: none;
}    

.c-sponsored-landing__button a:hover {
    color: #ffffff;
    opacity: .9;
}

.c-sponsored-landing__button a:visted {
    color: #ffffff;
}

.c-sponsored-landing__button a:active {
    color: #ffffff;
}

.c-sponsored-landing__button a:link {
    color: #ffffff;
}

.c-sponsored-landing__button-color {
    padding: 10px 20px;
    color: #293f4e;
    font-size: 20px;
    text-decoration: none;
}	

.c-sponsored-landing__header2 img { 
    width: 240px;

}	

.c-sponsored-landing__header2 { 
    border-bottom: 1px solid #84cebe;
    padding-bottom: 10px;
}		

/*
.c-sponsored-landing__header-copy {
    padding-top: 0px;
    padding-bottom: 10px;
    border-bottom: 1px solid #84cebe;
}

.c-sponsored-landing__header-copy {
    padding-top: 10px;
    padding-bottom: 10px;
    border-bottom: 1px solid #293f4e;
}	
*/

.c-sponsored-landing__nav {
    margin-top: 40px;
    margin-bottom: 30px;
}

.c-sponsored-landing__nav p {
    padding: 0;
    margin: .5rem auto;
}

.c-sponsored-landing__nav a {
    text-decoration: none;
    transition: .2s ease-in-out;
}

.c-sponsored-landing__nav a:hover {
    text-decoration: underline;
    color: white;
    transition: .2s ease-in-out;
}

.c-sponsored-landing__main img {
    max-width: 200px;
}

.c-sponsored-landing__nav.sticky-top{
    top: 67px;
    position: sticky;
}

.c-sponsored-landing__nav div.row{
    display: flex;
    justify-content: center;
} 

.c-sponsored-landing__nav div.row div {
    display: flex;
    width: auto;
}

.c-sponsored-landing__nav p {
    padding: 0;
    margin: .5rem 1rem;
}
.c-sponsored-landing__main {

}

.c-sponsored-landing__main h1{
    margin: 3rem auto 1.5rem auto;
    text-align: center;
}

.c-sponsored-landing__main h2{
    margin: 3rem auto 1.5rem auto

}

.c-sponsored-landing__form iframe {
    border: none;
    height: 500px;
    width: 700px;
}

/* Event Styles : END */

/* Homepage Styles : START */
/* Homepage Styles */
    
#top-news-content{
    background-color: var(--grey-bg-clr);
}

@media (max-width: 670px){
    #top-news-content{
        padding-left: 0;
        padding-right: 0;
    }
}



    

/* Hero Section Styles */
    
.hero-grid{
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    grid-gap: 1.5rem;
    align-items: flex-start;
    margin-bottom: 1.5rem;
}

.hero-featured{
    grid-column: 1/3;
    border: 1px solid #E6E6E6;
    overflow: hidden;
    width: 100%;
    align-self: stretch;
    position: relative;
}

.hero-featured .thumb-image, .hero-secondary-card .thumb-image{
    overflow: hidden;
    width: 100%;
    height: 100%;
}

.hero-featured .thumb-image img{
    object-fit: cover;
    object-position: center center;
    width: 100%;
    height: 100%;
    aspect-ratio: 5 / 3;
}

/*
.hero-featured .card-copy, .hero-secondary-card .card-copy{
    position: absolute;
    bottom: 0;
    padding: 6.5rem 1rem 1rem 1rem;
    width: 100%;
    background: linear-gradient(0deg, rgb(0, 0, 0) 0%, rgba(0, 0, 0, 0.81) 23%, rgba(0,0,0,0.7) 36%, rgba(0,0,0,0.1) 85%, rgba(0,0,0,0) 100%)
}
*/

.hero-featured-copy-side{
    margin-bottom: 1.5rem;
    border: 1px solid #E6E6E6;
    height: 500px;
}

.hero-featured-copy-side .card-copy{
    height: 100%;
    background: linear-gradient(90deg, rgb(0, 0, 0) 0%, rgba(0, 0, 0, 0.81) 23%, rgba(0,0,0,0.7) 36%, rgba(0,0,0,0.1) 85%, rgba(0,0,0,0) 100%);
    width: 650px;
    padding: 0 20rem 0 1rem;
    align-content: center;
    display: grid;
    top: 0;
    bottom: 0;
}

.hero-right{
    display: grid;
    grid-column: 3/4;
    grid-template-rows: 1fr 1fr;
    grid-gap: 1.5rem;
}

.hero-secondary-card{
    border: 1px solid #E6E6E6;
    overflow: hidden;
    width: 100%;
    height: 225px;
    position: relative;
}

.hero-secondary-card img{
    object-fit: cover;
    object-position: center center;
    width: 100%;
    height: 100%;
}

.hero-grid article .card-copy h2 a{
    color: white;
}

.hero-grid article .card-copy h2 a:hover {
    color: white;
    opacity: .7;
}

.hero-grid article .card-copy h3 a{
    color: white;
}

.hero-grid article .card-copy h3 a:hover {
    color: white;
    opacity: .7;
}

.hero-grid article .card-copy h4 a{
    color: white;
}

.hero-grid article .card-copy h4 a:hover {
    color: white;
    opacity: .7;
}

.hero-grid article .card-copy p{
    color: #B2B2B2;
}

.hero-bottom{
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    grid-gap:1.5rem;
    margin-bottom: 1.5rem;
}

.hero-bottom-card{
    width: 100%;
    background-color: white;
    border: 1px solid #E6E6E6;
}

.hero-bottom-card .thumb-image{
    width: 100%;
    overflow: hidden;
}

.hero-bottom-card .thumb-image img{
    width: 100%;
    height: 100%;
    aspect-ratio: 16 / 9;
    object-fit: cover;
    object-position: center center;
}

.hero-bottom-card .card-copy{
    padding: 1rem;
}

@media (max-width: 1100px){
    #top-news-content .sticky-top{
        position: relative;
    }
}

@media (max-width: 900px){
    .hero-featured{
        grid-column: 1/4;
        height: 425px;
    }
    
    .hero-right{
        display: grid;
        grid-column: 1/4;
        grid-template-rows: 1fr;
        grid-template-columns: 1fr 1fr;
    }
    
    .hero-secondary-card{ 
        height: 250px;
    }
    
    .hero-bottom{
        grid-template-columns: 1fr;
        margin-bottom: 3rem;
    }
    
    .hero-bottom-card{
        display: grid;
        grid-template-columns: auto 1fr;
    }
    
    .hero-bottom-card .thumb-image {
      width: 280px;
    }
    
    .hero-bottom-card .thumb-image img {
      aspect-ratio: 5 / 3;
    }
}

@media (max-width: 670px){
    #top-news-content .grid-content-sidebar{
        padding-top: 0 !important;
    }
    
    .hero-featured{
        border: none;
    }
    
    .hero-right, .hero-bottom, .trending-list, .sidebar-container, .recent-news-list{
        padding-right: var(--bs-gutter-x,.75rem);
        padding-left: var(--bs-gutter-x,.75rem);
    }
    
    .hero-featured-copy-side{
        margin-bottom: 1.5rem;
        border: none;
    }
    
    .hero-featured-copy-side .card-copy{
        padding: 6.5rem 1rem 1rem 1rem;
        width: 100%;
        background: linear-gradient(0deg, rgb(0, 0, 0) 0%, rgba(0, 0, 0, 0.81) 23%, rgba(0,0,0,0.7) 36%, rgba(0,0,0,0.1) 85%, rgba(0,0,0,0) 100%);
        height: auto;
        top: auto;
    }
}

@media (max-width: 550px){
    .hero-secondary-card{ 
        grid-column: 1/3;
        height: 225px;
    }
    
    .hero-bottom-card{
        display: grid;
        grid-template-columns: 1fr;
    }  
    
    .hero-bottom-card .thumb-image {
        display: none;            
        /*
        width: 100%;
        height: 225px;
        */
    }
}



/* Latest News Section Styles */

.latest-news-list{
    
    
}

.latest-news-list h1{
    padding: .5rem 0;
    border-top: 3px solid #CCCCCC;
    margin-bottom: 1rem;
}

.latest-news-items{
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-column-gap: 1.5rem;
}

.latest-news-items article{
    display: grid;
    grid-template-columns: 1fr 150px;
    grid-gap: .5rem;
    padding: 0 0 1rem 0;
    margin: 0 0 1rem 0;
    border-bottom: 1px solid #B3B3B3;
}

.latest-news-items article h2{
    font-size: 2.75rem;
    line-height: 0.75;
    color: var(--pv-clr);
}

.latest-news-items article a{
    text-decoration: none;
    color: var(--dark);
}

.latest-news-items .thumb-image {
    width: 100%;
    overflow: hidden;
    aspect-ratio: 16 / 9;
}

.latest-news-items .thumb-image img {
    width: 100%;
    height: 100%;
    aspect-ratio: 16 / 9;
    object-fit: cover;
    object-position: center center;
}

@media (max-width: 900px){
    .latest-news-items{
        grid-template-columns: 1fr;
    }
}

@media (max-width: 600px){
    .latest-news-items{
        grid-template-columns: 1fr;
    }
    
    .latest-news-items article:last-child{
        margin: 0 0 0 0;
    }
}






/* Trending Section Styles */

.trending-list h1{
    padding: .5rem 0;
    border-top: 3px solid #CCCCCC;
/*    border-bottom: 1px solid #B3B3B3;*/
    margin-bottom: 1rem;
}

.trending-list-items{
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    grid-column-gap: 1.5rem;
}

.trending-list-items article{
    display: grid;
    grid-template-columns: auto 1fr;
    grid-gap: .5rem;
    padding: 0 0 1rem 0;
    margin: 0 0 1rem 0;
    border-bottom: 1px solid #B3B3B3;
}

.trending-list-items article h2{
    font-size: 2.75rem;
    line-height: 0.75;
    color: var(--pv-clr);
}

.trending-list-items article a{
    text-decoration: none;
    color: var(--dark);
}

@media (max-width: 900px){
    .trending-list-items{
        grid-template-columns: 1fr 1fr;
    }
}

@media (max-width: 600px){
    .trending-list-items{
        grid-template-columns: 1fr;
    }
    
    .trending-list-items article:last-child{
        margin: 0 0 0 0;
    }
}







#sponsored-content, #feat-supp-section{
    background-color: #1A1A1A;
    padding: 3rem 0;
}

#sponsored-content h1{
    border-top: 3px solid #4D4D4D;
/*    border-bottom: 1px solid #B3B3B3;*/
}

.sponsored-items-container{
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    grid-gap: 1.5rem;
}

.text-top-card.sponsored-item{
    border: 1px solid #333333;
    overflow: hidden;
    width: 100%;
    align-self: stretch;
    position: relative;
    min-height: 250px;
}

.sponsored-item .thumb-image{
    overflow: hidden;
    width: 100%;
    height: 100%;
}

.sponsored-item .thumb-image img{
    object-fit: cover;
    object-position: center center;
    width: 100%;
    height: 100%;
    aspect-ratio: 5 / 3;
}

/*
.sponsored-item .card-copy{
    position: absolute;
    bottom: 0;
    padding: 6.5rem 1rem 1rem 1rem;
    width: 100%;
    background: linear-gradient(0deg, rgb(0, 0, 0) 0%, rgba(0, 0, 0, 0.81) 23%, rgba(0,0,0,0.7) 36%, rgba(0,0,0,0.1) 85%, rgba(0,0,0,0) 100%)
}
*/

.sponsored-item .card-copy h3{
    margin-bottom: 0;
}



@media (max-width: 900px){
    .sponsored-items-container{
        grid-template-columns: 1fr 1fr;
    }
    
    .sponsored-item:nth-last-child(1):nth-child(2n+1){
        grid-column: 1 / span 1;
    }
}

@media (max-width: 650px){
    .sponsored-items-container{
        grid-template-columns: 1fr;
    }
}







/* Current Issue Styles */


#current-issues{
    padding: 3rem 0 0 0;
}

.body-cover-carousel-item .cover-img-container {
  padding: 0.25rem 1rem 0.25rem 1rem;
}

.selected-issue-section{
    background-color: var(--dark);
    margin-top: 4.5rem;
    padding-right: var(--bs-gutter-x,.75rem);
    padding-left: var(--bs-gutter-x,.75rem);
    padding-bottom: .5rem;
}

.cover-img-container.selected-cover > div{
    padding-bottom: 10px;
    border-bottom: 3px solid var(--pv-clr);
}

#current-issues .current-issue-card {
    max-width: 900px;
    margin: 0 auto;
    background-color: white;
    position: relative;
    top: -2.55rem;
    padding: 0rem 2rem 2rem 2rem;
}

#current-issues .current-issue-card h2, #current-issues .current-issue-card p, #current-issues .current-issue-card h3, #current-issues .current-issue-card h3 a, #current-issues .current-issue-card .toc-btn {
    color: var(--dark);
}










/* Featured Videos Section Styles */

#featured-videos{
    padding: 3rem 0;
}

#featured-videos .card-copy h2, #featured-videos .card-copy h3{
    margin-bottom: 0;
}

.featVid-grid{
    display: grid;
    grid-template-columns: repeat(12, 1fr);
    grid-gap: 1.5rem;
}

.featVid-left{
    grid-column: 1/9;
}

.featVid-left .card-copy{
    display: grid;
    grid-template-columns: 60px 1fr;
    grid-gap: 1rem;
    align-items: center;
}

.featVid-left .card-icon svg{
    width: 100%;
}

.featVid-right-grid{
    display: grid;
    grid-column: 9/13;
    grid-template-rows: 1fr 1fr;
    grid-gap: 1.5rem;
}

.featVid-right:nth-child(1){
    grid-row: 1/2;
}

.featVid-right:nth-child(2){
    grid-row: 2/3;
}


.featVid-left .thumb-image img {
    aspect-ratio: 16 / 9;
}


.featVid-right .thumb-image img {
    aspect-ratio: 16/9;
}

@media (max-width: 900px) {
    .featVid-left{
        grid-column: 1/13;
    }
    
    .featVid-right-grid{
        grid-column: 1/13;
        grid-template-columns: 1fr 1fr;
        grid-template-rows:1fr;
    }
    
    .featVid-right:nth-child(1){
        grid-row: 1/2;
        grid-column: 1/2
    }

    .featVid-right:nth-child(2){
        grid-row: 1/2;
        grid-column: 2/3
    }
}

@media (max-width: 650px) {
    .featVid-right-grid{
        grid-column: 1/13;
        grid-template-columns: 1fr;
    }
    
    .featVid-left .thumb-image img {
        aspect-ratio: 10 / 9;
    }

    .featVid-right:nth-child(1){
        grid-row: 1/2;
        grid-column: 1/2;
    }

    .featVid-right:nth-child(2){
        grid-row: 2/3;
        grid-column: 1/2;
    }
}






#featured-podcasts-audio{
    padding: 3rem 0;
}

.pod-text-grid{
    display: grid;
    grid-template-columns: 200px 1fr;
    grid-gap: 1.5rem;
    align-items: flex-start;
    padding: 0 0 1.5rem 0;
    margin: 0 0 1.5rem 0;
    border-bottom: 1px solid #B3B3B3;
}

.pod-text-grid:last-child{
    margin: 0 0 0 0;
}

.pod-text-grid .thumb-image img{
    width: 100%;
    height: 100%;
    aspect-ratio: 1 / 1;
    object-fit: cover;
    object-position: center center;
}

@media (max-width: 800px) {
    .pod-text-grid{
        grid-template-columns: 150px 1fr;
    }
}







#featured-events{
    padding: 3rem 0;
}

.thumb-text-grid{
    display: grid;
    grid-template-columns: 325px 1fr;
    grid-gap: 1.5rem;
    align-items: flex-start;
    padding: 0 0 1.5rem 0;
    margin: 0 0 1.5rem 0;
    border-bottom: 1px solid #B3B3B3;
}

.thumb-text-grid:last-child{
    margin: 0 0 0 0;
}

.thumb-text-grid .thumb-image img{
    width: 100%;
    height: 100%;
    aspect-ratio: 16 / 9;
    object-fit: cover;
    object-position: center center;
}

@media (max-width: 800px) {
    .thumb-text-grid{
        grid-template-columns: 1fr 2fr;
        
    }
}

@media (max-width: 550px) {
    .thumb-text-grid{
        grid-template-columns: 1fr;
    }
}






/* Web Exclusives Section */

#web-exclusives-section{
    padding: 3rem 0;
}

.web-exclusive-container{
    display: grid;
    grid-template-columns: 2fr 1fr 1fr;
    grid-gap: 1.5rem;
}

.web-exclusive-container .text-top-card .thumb-image {
    aspect-ratio: 16/9;
}

.web-exclusive-container .white-card .thumb-image img {
    aspect-ratio: 12/9;
}


@media (max-width: 800px) {
    .web-exclusive-container{
        grid-template-columns: 1fr 1fr;
        grid-template-rows: 1fr 1fr;
    }
    
    .web-exclusive-container .text-top-card{
        grid-column: 1/3;
    }
    
    .web-exclusive-container .white-card:nth-of-type(2){
        grid-column: 1/2;
    }
    .web-exclusive-container .white-card:nth-of-type(3){
        grid-column: 2/3;
    }
}

@media (max-width: 550px) {
    .web-exclusive-container .white-card:nth-of-type(2){
        grid-column: 1/3;
    }
    .web-exclusive-container .white-card:nth-of-type(3){
        grid-column: 1/3;
    }
}





/* Featured Products Section */

#featured-prod-section{
    padding: 3rem 0;
}

#featured-prod-section > .container-fluid{
    position: relative;
}

.featured-prod-container{
    display: grid;
    grid-template-columns: repeat(12, 1fr);
    grid-gap: 1.5rem;
}

.featProd-grid{
    display: grid;
    grid-template-columns: repeat(12, 1fr);
    grid-gap: 1.5rem;
}

.featProd-left{
    grid-column: 1/9;
}

.featProd-left .card-copy{
    display: grid;
    grid-template-columns: 1fr;
    align-items: center;
}

.featProd-left .card-icon svg{
    width: 100%;
}

.featProd-right-grid{
    display: grid;
    grid-column: 9/13;
    grid-template-rows: 1fr 1fr;
    grid-gap: 1.5rem;
}

.featProd-right:nth-child(1){
    grid-row: 1/2;
}

.featProd-right:nth-child(2){
    grid-row: 2/3;
}


.featProd-left .thumb-image img {
    aspect-ratio: 16 / 9;
}


.featProd-right .thumb-image img {
    aspect-ratio: 16/9;
}

.featured-prod-container .text-top-card h2, .featured-prod-container .text-top-card h3{
    margin-bottom: 0;
}

@media (max-width: 900px) {
    .featProd-left{
        grid-column: 1/13;
    }
    
    .featProd-right-grid{
        grid-column: 1/13;
        grid-template-columns: 1fr 1fr;
        grid-template-rows:1fr;
    }
    
    .featProd-right:nth-child(1){
        grid-row: 1/2;
        grid-column: 1/2
    }

    .featProd-right:nth-child(2){
        grid-row: 1/2;
        grid-column: 2/3
    }
}

@media (max-width: 650px) {
    .featProd-right-grid{
        grid-column: 1/13;
        grid-template-columns: 1fr;
    }
    
    .featProd-left .thumb-image img {
        aspect-ratio: 10 / 9;
    }

    .featProd-right:nth-child(1){
        grid-row: 1/2;
        grid-column: 1/2;
    }

    .featProd-right:nth-child(2){
        grid-row: 2/3;
        grid-column: 1/2;
    }
}





/* Homepage Socials Styles */

.socials-sidebar-widget{
    background-color: white;
    border: 1px solid #E6E6E6;
    padding: 1.5rem 2rem;
    text-align: center;
}

.socials-sidebar-widget h3{
    margin-bottom: 1rem;
}

.home-socials-container{
    display: flex;
    flex-wrap: wrap;
    gap: 1rem;
    justify-content: center;
}

.home-socials-container svg{
    width: 35px;
}

.home-socials-container svg path{
    transition: .2s ease-in-out;
}

.pv-page .home-socials-container svg:hover path, .pv-page .home-socials-container svg:hover polygon{
    fill: var(--pv-clr);
    transition: .2s ease-in-out;
}






/* Recent News Styles */


.recent-news-list-items {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  grid-column-gap: 1.5rem;
}

.recent-news-list-items article {
  display: grid;
  grid-template-columns: 1fr;
  grid-gap: .5rem;
  padding: 0 0 1rem 0;
  margin: 0 0 1rem 0;
  border-bottom: 1px solid #B3B3B3;
}



/* Featured Supplements Section */

#feat-supp-section{
    border-top: .5px solid var(--grey-bg-clr);
    border-bottom: .5px solid var(--grey-bg-clr);
}

.feat-supp-container{
    display: grid;
    grid-template-columns: min-content auto;
    justify-content: center;
    grid-column-gap: 4rem;
    align-items: center;
    width: max-content;
    margin: 0 auto;
}

.feat-supp-container h1{
    border-top: 3px solid #4D4D4D;
}

.feat-supp-container .cover-text-grid{
    max-width: 600px;
    margin: 0 auto;
    border-bottom: 0;
    padding-bottom: 0;
    margin-bottom: 0; 
    align-items: center;
}

.feat-supp-container .cover-text-grid p{
    color: #B2B2B2;
}

@media (max-width: 845px) {
    .feat-supp-container{
        grid-template-columns: 1fr;
        justify-content: flex-start;
        width: 100%;
    }

    .feat-supp-container .cover-text-grid{
        margin: 0;
    }
}

/* Homepage Styles : END */


/* List Styles : START */
/* Homepage Styles */
    
#top-news-content{
    background-color: var(--grey-bg-clr);
}

@media (max-width: 670px){
    #top-news-content{
        padding-left: 0;
        padding-right: 0;
    }
}



    

/* Hero Section Styles */
    
.hero-grid{
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    grid-gap: 1.5rem;
    align-items: flex-start;
    margin-bottom: 1.5rem;
}

.hero-featured{
    grid-column: 1/3;
    border: 1px solid #E6E6E6;
    overflow: hidden;
    width: 100%;
    align-self: stretch;
    position: relative;
}

.hero-featured .thumb-image, .hero-secondary-card .thumb-image{
    overflow: hidden;
    width: 100%;
    height: 100%;
}

.hero-featured .thumb-image img{
    object-fit: cover;
    object-position: center center;
    width: 100%;
    height: 100%;
    aspect-ratio: 5 / 3;
}

/*
.hero-featured .card-copy, .hero-secondary-card .card-copy{
    position: absolute;
    bottom: 0;
    padding: 6.5rem 1rem 1rem 1rem;
    width: 100%;
    background: linear-gradient(0deg, rgb(0, 0, 0) 0%, rgba(0, 0, 0, 0.81) 23%, rgba(0,0,0,0.7) 36%, rgba(0,0,0,0.1) 85%, rgba(0,0,0,0) 100%)
}
*/

.hero-featured-copy-side{
    margin-bottom: 1.5rem;
    border: 1px solid #E6E6E6;
    height: 500px;
}

.hero-featured-copy-side .card-copy{
    height: 100%;
    background: linear-gradient(90deg, rgb(0, 0, 0) 0%, rgba(0, 0, 0, 0.81) 23%, rgba(0,0,0,0.7) 36%, rgba(0,0,0,0.1) 85%, rgba(0,0,0,0) 100%);
    width: 650px;
    padding: 0 20rem 0 1rem;
    align-content: center;
    display: grid;
    top: 0;
    bottom: 0;
}

.hero-right{
    display: grid;
    grid-column: 3/4;
    grid-template-rows: 1fr 1fr;
    grid-gap: 1.5rem;
}

.hero-secondary-card{
    border: 1px solid #E6E6E6;
    overflow: hidden;
    width: 100%;
    height: 225px;
    position: relative;
}

.hero-secondary-card img{
    object-fit: cover;
    object-position: center center;
    width: 100%;
    height: 100%;
}

.hero-grid article .card-copy h2 a{
    color: white;
}

.hero-grid article .card-copy h2 a:hover {
    color: white;
    opacity: .7;
}

.hero-grid article .card-copy h3 a{
    color: white;
}

.hero-grid article .card-copy h3 a:hover {
    color: white;
    opacity: .7;
}

.hero-grid article .card-copy h4 a{
    color: white;
}

.hero-grid article .card-copy h4 a:hover {
    color: white;
    opacity: .7;
}

.hero-grid article .card-copy p{
    color: #B2B2B2;
}

.hero-bottom{
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    grid-gap:1.5rem;
    margin-bottom: 1.5rem;
}

.hero-bottom-card{
    width: 100%;
    background-color: white;
    border: 1px solid #E6E6E6;
}

.hero-bottom-card .thumb-image{
    width: 100%;
    overflow: hidden;
}

.hero-bottom-card .thumb-image img{
    width: 100%;
    height: 100%;
    aspect-ratio: 16 / 9;
    object-fit: cover;
    object-position: center center;
}

.hero-bottom-card .card-copy{
    padding: 1rem;
}

@media (max-width: 1100px){
    #top-news-content .sticky-top{
        position: relative;
    }
}

@media (max-width: 900px){
    .hero-featured{
        grid-column: 1/4;
        height: 425px;
    }
    
    .hero-right{
        display: grid;
        grid-column: 1/4;
        grid-template-rows: 1fr;
        grid-template-columns: 1fr 1fr;
    }
    
    .hero-secondary-card{ 
        height: 250px;
    }
    
    .hero-bottom{
        grid-template-columns: 1fr;
        margin-bottom: 3rem;
    }
    
    .hero-bottom-card{
        display: grid;
        grid-template-columns: auto 1fr;
    }
    
    .hero-bottom-card .thumb-image {
      width: 280px;
    }
    
    .hero-bottom-card .thumb-image img {
      aspect-ratio: 5 / 3;
    }
}

@media (max-width: 670px){
    #top-news-content .grid-content-sidebar{
        padding-top: 0 !important;
    }
    
    .hero-featured{
        border: none;
    }
    
    .hero-right, .hero-bottom, .trending-list, .sidebar-container, .recent-news-list{
        padding-right: var(--bs-gutter-x,.75rem);
        padding-left: var(--bs-gutter-x,.75rem);
    }
    
    .hero-featured-copy-side{
        margin-bottom: 1.5rem;
        border: none;
    }
    
    .hero-featured-copy-side .card-copy{
        padding: 6.5rem 1rem 1rem 1rem;
        width: 100%;
        background: linear-gradient(0deg, rgb(0, 0, 0) 0%, rgba(0, 0, 0, 0.81) 23%, rgba(0,0,0,0.7) 36%, rgba(0,0,0,0.1) 85%, rgba(0,0,0,0) 100%);
        height: auto;
        top: auto;
    }
}

@media (max-width: 550px){
    .hero-secondary-card{ 
        grid-column: 1/3;
        height: 225px;
    }
    
    .hero-bottom-card{
        display: grid;
        grid-template-columns: 1fr;
    }  
    
    .hero-bottom-card .thumb-image {
        display: none;            
        /*
        width: 100%;
        height: 225px;
        */
    }
}



/* Latest News Section Styles */

.latest-news-list{
    
    
}

.latest-news-list h1{
    padding: .5rem 0;
    border-top: 3px solid #CCCCCC;
    margin-bottom: 1rem;
}

.latest-news-items{
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-column-gap: 1.5rem;
}

.latest-news-items article{
    display: grid;
    grid-template-columns: 1fr 150px;
    grid-gap: .5rem;
    padding: 0 0 1rem 0;
    margin: 0 0 1rem 0;
    border-bottom: 1px solid #B3B3B3;
}

.latest-news-items article h2{
    font-size: 2.75rem;
    line-height: 0.75;
    color: var(--pv-clr);
}

.latest-news-items article a{
    text-decoration: none;
    color: var(--dark);
}

.latest-news-items .thumb-image {
    width: 100%;
    overflow: hidden;
    aspect-ratio: 16 / 9;
}

.latest-news-items .thumb-image img {
    width: 100%;
    height: 100%;
    aspect-ratio: 16 / 9;
    object-fit: cover;
    object-position: center center;
}

@media (max-width: 900px){
    .latest-news-items{
        grid-template-columns: 1fr;
    }
}

@media (max-width: 600px){
    .latest-news-items{
        grid-template-columns: 1fr;
    }
    
    .latest-news-items article:last-child{
        margin: 0 0 0 0;
    }
}






/* Trending Section Styles */

.trending-list h1{
    padding: .5rem 0;
    border-top: 3px solid #CCCCCC;
/*    border-bottom: 1px solid #B3B3B3;*/
    margin-bottom: 1rem;
}

.trending-list-items{
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    grid-column-gap: 1.5rem;
}

.trending-list-items article{
    display: grid;
    grid-template-columns: auto 1fr;
    grid-gap: .5rem;
    padding: 0 0 1rem 0;
    margin: 0 0 1rem 0;
    border-bottom: 1px solid #B3B3B3;
}

.trending-list-items article h2{
    font-size: 2.75rem;
    line-height: 0.75;
    color: var(--pv-clr);
}

.trending-list-items article a{
    text-decoration: none;
    color: var(--dark);
}

@media (max-width: 900px){
    .trending-list-items{
        grid-template-columns: 1fr 1fr;
    }
}

@media (max-width: 600px){
    .trending-list-items{
        grid-template-columns: 1fr;
    }
    
    .trending-list-items article:last-child{
        margin: 0 0 0 0;
    }
}







#sponsored-content, #feat-supp-section{
    background-color: #1A1A1A;
    padding: 3rem 0;
}

#sponsored-content h1{
    border-top: 3px solid #4D4D4D;
/*    border-bottom: 1px solid #B3B3B3;*/
}

.sponsored-items-container{
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    grid-gap: 1.5rem;
}

.text-top-card.sponsored-item{
    border: 1px solid #333333;
    overflow: hidden;
    width: 100%;
    align-self: stretch;
    position: relative;
    min-height: 250px;
}

.sponsored-item .thumb-image{
    overflow: hidden;
    width: 100%;
    height: 100%;
}

.sponsored-item .thumb-image img{
    object-fit: cover;
    object-position: center center;
    width: 100%;
    height: 100%;
    aspect-ratio: 5 / 3;
}

/*
.sponsored-item .card-copy{
    position: absolute;
    bottom: 0;
    padding: 6.5rem 1rem 1rem 1rem;
    width: 100%;
    background: linear-gradient(0deg, rgb(0, 0, 0) 0%, rgba(0, 0, 0, 0.81) 23%, rgba(0,0,0,0.7) 36%, rgba(0,0,0,0.1) 85%, rgba(0,0,0,0) 100%)
}
*/

.sponsored-item .card-copy h3{
    margin-bottom: 0;
}



@media (max-width: 900px){
    .sponsored-items-container{
        grid-template-columns: 1fr 1fr;
    }
    
    .sponsored-item:nth-last-child(1):nth-child(2n+1){
        grid-column: 1 / span 1;
    }
}

@media (max-width: 650px){
    .sponsored-items-container{
        grid-template-columns: 1fr;
    }
}







/* Current Issue Styles */


#current-issues{
    padding: 3rem 0 0 0;
}

.body-cover-carousel-item .cover-img-container {
  padding: 0.25rem 1rem 0.25rem 1rem;
}

.selected-issue-section{
    background-color: var(--dark);
    margin-top: 4.5rem;
    padding-right: var(--bs-gutter-x,.75rem);
    padding-left: var(--bs-gutter-x,.75rem);
    padding-bottom: .5rem;
}

.cover-img-container.selected-cover > div{
    padding-bottom: 10px;
    border-bottom: 3px solid var(--pv-clr);
}

#current-issues .current-issue-card {
    max-width: 900px;
    margin: 0 auto;
    background-color: white;
    position: relative;
    top: -2.55rem;
    padding: 0rem 2rem 2rem 2rem;
}

#current-issues .current-issue-card h2, #current-issues .current-issue-card p, #current-issues .current-issue-card h3, #current-issues .current-issue-card h3 a, #current-issues .current-issue-card .toc-btn {
    color: var(--dark);
}










/* Featured Videos Section Styles */

#featured-videos{
    padding: 3rem 0;
}

#featured-videos .card-copy h2, #featured-videos .card-copy h3{
    margin-bottom: 0;
}

.featVid-grid{
    display: grid;
    grid-template-columns: repeat(12, 1fr);
    grid-gap: 1.5rem;
}

.featVid-left{
    grid-column: 1/9;
}

.featVid-left .card-copy{
    display: grid;
    grid-template-columns: 60px 1fr;
    grid-gap: 1rem;
    align-items: center;
}

.featVid-left .card-icon svg{
    width: 100%;
}

.featVid-right-grid{
    display: grid;
    grid-column: 9/13;
    grid-template-rows: 1fr 1fr;
    grid-gap: 1.5rem;
}

.featVid-right:nth-child(1){
    grid-row: 1/2;
}

.featVid-right:nth-child(2){
    grid-row: 2/3;
}


.featVid-left .thumb-image img {
    aspect-ratio: 16 / 9;
}


.featVid-right .thumb-image img {
    aspect-ratio: 16/9;
}

@media (max-width: 900px) {
    .featVid-left{
        grid-column: 1/13;
    }
    
    .featVid-right-grid{
        grid-column: 1/13;
        grid-template-columns: 1fr 1fr;
        grid-template-rows:1fr;
    }
    
    .featVid-right:nth-child(1){
        grid-row: 1/2;
        grid-column: 1/2
    }

    .featVid-right:nth-child(2){
        grid-row: 1/2;
        grid-column: 2/3
    }
}

@media (max-width: 650px) {
    .featVid-right-grid{
        grid-column: 1/13;
        grid-template-columns: 1fr;
    }
    
    .featVid-left .thumb-image img {
        aspect-ratio: 10 / 9;
    }

    .featVid-right:nth-child(1){
        grid-row: 1/2;
        grid-column: 1/2;
    }

    .featVid-right:nth-child(2){
        grid-row: 2/3;
        grid-column: 1/2;
    }
}






#featured-podcasts-audio{
    padding: 3rem 0;
}

.pod-text-grid{
    display: grid;
    grid-template-columns: 200px 1fr;
    grid-gap: 1.5rem;
    align-items: flex-start;
    padding: 0 0 1.5rem 0;
    margin: 0 0 1.5rem 0;
    border-bottom: 1px solid #B3B3B3;
}

.pod-text-grid:last-child{
    margin: 0 0 0 0;
}

.pod-text-grid .thumb-image img{
    width: 100%;
    height: 100%;
    aspect-ratio: 1 / 1;
    object-fit: cover;
    object-position: center center;
}

@media (max-width: 800px) {
    .pod-text-grid{
        grid-template-columns: 150px 1fr;
    }
}







#featured-events{
    padding: 3rem 0;
}

.thumb-text-grid{
    display: grid;
    grid-template-columns: 325px 1fr;
    grid-gap: 1.5rem;
    align-items: flex-start;
    padding: 0 0 1.5rem 0;
    margin: 0 0 1.5rem 0;
    border-bottom: 1px solid #B3B3B3;
}

.thumb-text-grid:last-child{
    margin: 0 0 0 0;
}

.thumb-text-grid .thumb-image img{
    width: 100%;
    height: 100%;
    aspect-ratio: 16 / 9;
    object-fit: cover;
    object-position: center center;
}

@media (max-width: 800px) {
    .thumb-text-grid{
        grid-template-columns: 1fr 2fr;
        
    }
}

@media (max-width: 550px) {
    .thumb-text-grid{
        grid-template-columns: 1fr;
    }
}






/* Web Exclusives Section */

#web-exclusives-section{
    padding: 3rem 0;
}

.web-exclusive-container{
    display: grid;
    grid-template-columns: 2fr 1fr 1fr;
    grid-gap: 1.5rem;
}

.web-exclusive-container .text-top-card .thumb-image {
    aspect-ratio: 16/9;
}

.web-exclusive-container .white-card .thumb-image img {
    aspect-ratio: 12/9;
}


@media (max-width: 800px) {
    .web-exclusive-container{
        grid-template-columns: 1fr 1fr;
        grid-template-rows: 1fr 1fr;
    }
    
    .web-exclusive-container .text-top-card{
        grid-column: 1/3;
    }
    
    .web-exclusive-container .white-card:nth-of-type(2){
        grid-column: 1/2;
    }
    .web-exclusive-container .white-card:nth-of-type(3){
        grid-column: 2/3;
    }
}

@media (max-width: 550px) {
    .web-exclusive-container .white-card:nth-of-type(2){
        grid-column: 1/3;
    }
    .web-exclusive-container .white-card:nth-of-type(3){
        grid-column: 1/3;
    }
}





/* Featured Products Section */

#featured-prod-section{
    padding: 3rem 0;
}

#featured-prod-section > .container-fluid{
    position: relative;
}

.featured-prod-container{
    display: grid;
    grid-template-columns: repeat(12, 1fr);
    grid-gap: 1.5rem;
}

.featProd-grid{
    display: grid;
    grid-template-columns: repeat(12, 1fr);
    grid-gap: 1.5rem;
}

.featProd-left{
    grid-column: 1/9;
}

.featProd-left .card-copy{
    display: grid;
    grid-template-columns: 1fr;
    align-items: center;
}

.featProd-left .card-icon svg{
    width: 100%;
}

.featProd-right-grid{
    display: grid;
    grid-column: 9/13;
    grid-template-rows: 1fr 1fr;
    grid-gap: 1.5rem;
}

.featProd-right:nth-child(1){
    grid-row: 1/2;
}

.featProd-right:nth-child(2){
    grid-row: 2/3;
}


.featProd-left .thumb-image img {
    aspect-ratio: 16 / 9;
}


.featProd-right .thumb-image img {
    aspect-ratio: 16/9;
}

.featured-prod-container .text-top-card h2, .featured-prod-container .text-top-card h3{
    margin-bottom: 0;
}

@media (max-width: 900px) {
    .featProd-left{
        grid-column: 1/13;
    }
    
    .featProd-right-grid{
        grid-column: 1/13;
        grid-template-columns: 1fr 1fr;
        grid-template-rows:1fr;
    }
    
    .featProd-right:nth-child(1){
        grid-row: 1/2;
        grid-column: 1/2
    }

    .featProd-right:nth-child(2){
        grid-row: 1/2;
        grid-column: 2/3
    }
}

@media (max-width: 650px) {
    .featProd-right-grid{
        grid-column: 1/13;
        grid-template-columns: 1fr;
    }
    
    .featProd-left .thumb-image img {
        aspect-ratio: 10 / 9;
    }

    .featProd-right:nth-child(1){
        grid-row: 1/2;
        grid-column: 1/2;
    }

    .featProd-right:nth-child(2){
        grid-row: 2/3;
        grid-column: 1/2;
    }
}





/* Homepage Socials Styles */

.socials-sidebar-widget{
    background-color: white;
    border: 1px solid #E6E6E6;
    padding: 1.5rem 2rem;
    text-align: center;
}

.socials-sidebar-widget h3{
    margin-bottom: 1rem;
}

.home-socials-container{
    display: flex;
    flex-wrap: wrap;
    gap: 1rem;
    justify-content: center;
}

.home-socials-container svg{
    width: 35px;
}

.home-socials-container svg path{
    transition: .2s ease-in-out;
}

.pv-page .home-socials-container svg:hover path, .pv-page .home-socials-container svg:hover polygon{
    fill: var(--pv-clr);
    transition: .2s ease-in-out;
}






/* Recent News Styles */


.recent-news-list-items {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  grid-column-gap: 1.5rem;
}

.recent-news-list-items article {
  display: grid;
  grid-template-columns: 1fr;
  grid-gap: .5rem;
  padding: 0 0 1rem 0;
  margin: 0 0 1rem 0;
  border-bottom: 1px solid #B3B3B3;
}



/* Featured Supplements Section */

#feat-supp-section{
    border-top: .5px solid var(--grey-bg-clr);
    border-bottom: .5px solid var(--grey-bg-clr);
}

.feat-supp-container{
    display: grid;
    grid-template-columns: min-content auto;
    justify-content: center;
    grid-column-gap: 4rem;
    align-items: center;
    width: max-content;
    margin: 0 auto;
}

.feat-supp-container h1{
    border-top: 3px solid #4D4D4D;
}

.feat-supp-container .cover-text-grid{
    max-width: 600px;
    margin: 0 auto;
    border-bottom: 0;
    padding-bottom: 0;
    margin-bottom: 0; 
    align-items: center;
}

.feat-supp-container .cover-text-grid p{
    color: #B2B2B2;
}

@media (max-width: 845px) {
    .feat-supp-container{
        grid-template-columns: 1fr;
        justify-content: flex-start;
        width: 100%;
    }

    .feat-supp-container .cover-text-grid{
        margin: 0;
    }
}

/* List Styles : END */


/* lity Styles : Start */
/*! Lity - v2.4.1 - 2020-04-26
* http://sorgalla.com/lity/
* Copyright (c) 2015-2020 Jan Sorgalla; Licensed MIT */
.lity {
  z-index: 9990;
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  white-space: nowrap;
  background: #0b0b0b;
  background: rgba(0, 0, 0, 0.9);
  outline: none !important;
  opacity: 0;
  -webkit-transition: opacity 0.3s ease;
  -o-transition: opacity 0.3s ease;
  transition: opacity 0.3s ease;
}
.lity.lity-opened {
  opacity: 1;
}
.lity.lity-closed {
  opacity: 0;
}
.lity * {
  -webkit-box-sizing: border-box;
     -moz-box-sizing: border-box;
          box-sizing: border-box;
}
.lity-wrap {
  z-index: 9990;
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  text-align: center;
  outline: none !important;
}
.lity-wrap:before {
  content: '';
  display: inline-block;
  height: 100%;
  vertical-align: middle;
  margin-right: -0.25em;
}
.lity-loader {
  z-index: 9991;
  color: #fff;
  position: absolute;
  top: 50%;
  margin-top: -0.8em;
  width: 100%;
  text-align: center;
  font-size: 14px;
  font-family: Arial, Helvetica, sans-serif;
  opacity: 0;
  -webkit-transition: opacity 0.3s ease;
  -o-transition: opacity 0.3s ease;
  transition: opacity 0.3s ease;
}
.lity-loading .lity-loader {
  opacity: 1;
}
.lity-container {
  z-index: 9992;
  position: relative;
  text-align: left;
  vertical-align: middle;
  display: inline-block;
  white-space: normal;
  max-width: 100%;
  max-height: 100%;
  outline: none !important;
}
.lity-content {
  z-index: 9993;
  width: 100%;
  -webkit-transform: scale(1);
      -ms-transform: scale(1);
       -o-transform: scale(1);
          transform: scale(1);
  -webkit-transition: -webkit-transform 0.3s ease;
  transition: -webkit-transform 0.3s ease;
  -o-transition: -o-transform 0.3s ease;
  transition: transform 0.3s ease;
  transition: transform 0.3s ease, -webkit-transform 0.3s ease, -o-transform 0.3s ease;
}
.lity-loading .lity-content,
.lity-closed .lity-content {
  -webkit-transform: scale(0.8);
      -ms-transform: scale(0.8);
       -o-transform: scale(0.8);
          transform: scale(0.8);
}
.lity-content:after {
  content: '';
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  display: block;
  right: 0;
  width: auto;
  height: auto;
  z-index: -1;
  -webkit-box-shadow: 0 0 8px rgba(0, 0, 0, 0.6);
          box-shadow: 0 0 8px rgba(0, 0, 0, 0.6);
}
.lity-close {
  z-index: 9994;
  width: 35px;
  height: 35px;
  position: fixed;
  right: 0;
  top: 0;
  -webkit-appearance: none;
  cursor: pointer;
  text-decoration: none;
  text-align: center;
  padding: 0;
  color: #fff;
  font-style: normal;
  font-size: 35px;
  font-family: Arial, Baskerville, monospace;
  line-height: 35px;
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.6);
  border: 0;
  background: none;
  outline: none;
  -webkit-box-shadow: none;
          box-shadow: none;
}
.lity-close::-moz-focus-inner {
  border: 0;
  padding: 0;
}
.lity-close:hover,
.lity-close:focus,
.lity-close:active,
.lity-close:visited {
  text-decoration: none;
  text-align: center;
  padding: 0;
  color: #fff;
  font-style: normal;
  font-size: 35px;
  font-family: Arial, Baskerville, monospace;
  line-height: 35px;
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.6);
  border: 0;
  background: none;
  outline: none;
  -webkit-box-shadow: none;
          box-shadow: none;
}
.lity-close:active {
  top: 1px;
}
/* Image */
.lity-image img {
  max-width: 100%;
  display: block;
  line-height: 0;
  border: 0;
}
/* iFrame */
.lity-iframe .lity-container,
.lity-youtube .lity-container,
.lity-vimeo .lity-container,
.lity-facebookvideo .lity-container,
.lity-googlemaps .lity-container {
  width: 100%;
  max-width: 964px;
}
.lity-iframe-container {
  width: 100%;
  height: 0;
  padding-top: 56.25%;
  overflow: auto;
  pointer-events: auto;
  -webkit-transform: translateZ(0);
          transform: translateZ(0);
  -webkit-overflow-scrolling: touch;
}
.lity-iframe-container iframe {
  position: absolute;
  display: block;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  -webkit-box-shadow: 0 0 8px rgba(0, 0, 0, 0.6);
          box-shadow: 0 0 8px rgba(0, 0, 0, 0.6);
  background: #000;
}
.lity-hide {
  display: none;
}

/* list Sytles: END */


/* Modal Styles : START */
@charset "UTF-8";
/* Modal CSS */

/*.splash-screen {
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    z-index: 9999;
    width: 100%;
    height: 100%;
    background-color: rgba(0,0,0,0.95);
}
#modal-wrapper{
    display: block;
}
.close {
    font-size: 25px;
    font-weight: 700;
    line-height: 1;
    color: white;
    opacity: 1;
    transition: .2s ease-in-out;
}
.close:focus, .close:hover {
    text-decoration: none;
    cursor: pointer;
    opacity: .5;
    transition: .2s ease-in-out;
}
button.close {
    padding: 0;
    cursor: pointer;
    background: transparent;
    border: 0;
    -webkit-appearance: none;
}
.modal {
    display: block;
    position: fixed;
    overflow: hidden;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    -webkit-overflow-scrolling: touch;
    outline: 0;
    z-index: 10000;
}
.modal.in{
    display: block;
}  
.modal.fade .modal-dialog {
    opacity: 1;
    transition: all .3s ease-out, -webkit-all .3s ease-out
}
.modal.fade:not(.show) {
  opacity: 1;
}
.modal.in .modal-dialog {
    top: 50%;
    bottom: auto;
    transform: translateY(-50%);
    transition: all .2s ease-out, -webkit-all .2s ease-out; 
}
.modal-dialog {
    opacity: 0;
    position: relative;
    width: 100%;
    max-width: max-content;
    margin: 0 auto;
    top: 0;
    transform: none;
    transition: all .2s ease-out, -webkit-all .2s ease-out;
}
.modal-content {
    position: relative;
    border-radius: 6px;
    outline: 0;
    border: 0;
    background: transparent;
}
    
.modal-header {
    margin-bottom: .5rem;
    text-align: right;
    padding: 0;
    justify-content: flex-end;
    border: 0;
}
.modal-header .close {

}
.modal-title {
    margin: 0;
}
.modal-body {
    position: relative;
    padding: 0;
}
#ad-interstitial{
    box-shadow: 0 5px 15px rgba(0,0,0,.5)
}
.modal-footer {
    text-align: center;
    color: white;
    font-family: Arial, sans-serif;
    margin-top: 15px;
    border: 0;
    justify-content: center;
    padding: 0;
}
.modal-scrollbar-measure {
    position: absolute;
    top: -9999px;
    width: 50px;
    height: 50px;
    overflow: scroll
}

@media (min-width:768px) {
    .modal-dialog {
        width: max-content;
        margin: 0px auto;
        max-width: 600px;
    }
*/
/*Modal Styles : END */


/* Nav Styles : START */
/* Nav Styles */
    
nav{
    background-color: black;
    color: white;
}

nav ul{
    list-style: none;
}

nav ul li{
    list-style: none;
}

.topNav{
    display: grid;
    grid-template-columns: 1fr 400px 1fr;
    justify-items: center;
    align-items: center;
    padding: 0 1rem;
    border-bottom: 1px solid #424242;
}

.topNav-left{
    display: flex;
    flex-direction: row;
    padding-left: 0;
    margin-bottom: 0;
    list-style: none;
    justify-self: flex-start;  
}

.dropdown-menu{
    padding: 0;
}

.dropdown-item:focus, .dropdown-item:hover {
    background-color: transparent;
}

.view-all-nav{
    border-top: 1px solid rgba(0,0,0,.15);
}


@media (max-width: 570px){
    .topNav{
        grid-template-columns: auto 1fr;
    }
}







/*
.topNav-left li{
    padding-right: .9rem;
}
*/
/*

ul.topNav-left li:last-child{
    padding-right: 0;
}
*/


/*
.navbar-nav .publications-dropdown {
    position: inherit;
}

.navbar-nav .publications-dropdown .dropdown-menu {
    position: absolute;
    margin: 0 -2px 0 -2px;
    top: calc(100% + 1px);
    left: 0;
    border-radius: 0;
    width: calc(100vw + 4px);
    border: 1px solid #E6E6E6;
}
*/





/*  Sidebar Nav Styles  */ 

.menu-search{
    height: 100%;
    position: inherit;
}

.menu-search-icon{
    width: 25px;
    height: 25px;
    position: relative;
    transition: all 0.2s ease-in-out;
    margin: 0;
    padding: 0;
    background-color: transparent;
    border: 1px solid transparent;
    border-radius: .25rem;
}
.menu-search-icon svg{
    width: 25px;
    position: relative;
    z-index: 2;
    padding: 0 0 4px 2px;
    transition: all 0.2s ease-in-out;
}
.menu-search-icon:hover svg{
    width: 22px;
    transition: all 0.2s ease-in-out;
}
.menu-search-icon:hover svg g path{
    fill: var(--pv-clr);
    transition: all 0.2s ease-in-out;
}
.menu-search-icon:hover::before {
    background: white;
    transform: scale(1.7);
    transition: all 0.2s ease-in-out;
}
.menu-search-icon::before {
    content: "";
    background: #fff;
    transform: scale(0);
    position: absolute;
    top: 0;
    left: 0;
    width: 22px;
    height: 22px;
    border-radius: 2rem;
    z-index: 1;
    transition: transform .25s cubic-bezier(.4,0,.2,1),background .25s cubic-bezier(.4,0,.2,1);
}

.menu-search .menu-search-icon::after {
  content: none;
}

.navbar-nav .menu-search .dropdown-menu {
    position: fixed;
    margin: 0 -2px 0 -2px;
    top: 91px;
    left: 0;
    border-radius: 0;
    width: 300px;
    border: 1px solid #E6E6E6;
    overflow: scroll;
}

.nav-scrolled .navbar-nav .menu-search .dropdown-menu{
    top: 51px;
}

.topNav-left .menu-search .menu-search-icon.active::before{
    background: var(--pv-clr);
    color: white;
    transform: scale(1.7);
    transition: all 0.2s ease-in-out;
}

.menu-search-icon.active svg{
    width: 22px;
    transition: all 0.2s ease-in-out;
}

.topNav-left .menu-search .menu-search-icon.active:hover svg g path{
    fill: white;
}

#sideNav{
    position: fixed;
    z-index: 1000;
/*    display: none;*/
    min-width: 10rem;
    padding: .5rem 0;
    margin: 0;
    font-size: 1rem;
    color: #212529;
    text-align: left;
    list-style: none;
    background-color: #fff;
    background-clip: padding-box;
    border: 1px solid #E6E6E6;
    border-radius: 0;
    width: 300px;
    height: 100%;
    left: 0;
    overflow: scroll;
}

.sideNav-container.sidenav {
    display: block;
}

#sideNav ul{
    padding: 0;
}

#sideNav ul.dropdown-menu.show {
  display: block;
  position: relative !important;
  transform: translate(0) !important;
}

#sideNav li {
    display: block;
    padding: .5rem 0;
    margin-bottom: 0px;
    color: var(--dark);
    position: relative;
    list-style: none;
    width: 100%;
    font-weight: 500;
}

#sideNav li a {
    display: block;
    margin-bottom: 0px;
    color: var(--dark);
    position: relative;
    list-style: none;
    text-decoration: none;
}

#sideNav li > ul > li:first-child {
  padding: 1rem .9rem .5rem .9rem;
}

#sideNav li > ul > li {
    font-size: .9rem;
    font-weight: 400;
    padding: .5rem 0.9rem;
}

.sidenav li ul {
    position: absolute;
    left: -9999px;
    bottom: 0;
    min-width: 150px;
    width: auto;
}

.sidenav ul > li.hover > ul, .sidenav ul li li.hover ul {
    position: static;
}

.sidenav li .parent::after {
    font-family: 'Material Icons';
    content: "\e5cf";
    text-align: right;
    right: 0px;
    position: absolute;
    opacity: .5;
    color: var(--dark);
    transition: all 0.25s ease-in-out;
}

.sidenav li.hover > .parent::after {
    transform: rotate(-180deg);
    transition: all 0.25s ease-in-out;
}

.pv-page #sideNav li.hover > .parent {
    color: var(--pv-clr);
    transition: all 0.25s ease-in-out;
}

.pv-page #sideNav li.hover > .parent .animated-underline {
    background-size: 100% 2px;
    color: inherit;
}

.sidenav li.hover > ul > li.hover > .parent::after {
    transform: rotate(-180deg);
    transition: all 0.25s ease-in-out;
}

.pv-page #sideNav li.hover > ul > li.hover > .parent {
    color: var(--pv-clr);
    transition: all 0.25s ease-in-out;
}

.pv-page #sideNav li.hover > ul > li.hover > .parent .animated-underline {
    background-size: 100% 2px;
    color: inherit;
}

#sideNav .sub-signin-menu{
    padding: .6rem 0 1rem 0;
}

#sideNav .sub-signin-menu .navbar-nav{
    position: static;
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    gap: 1.5rem;
}

#sideNav .sub-signin-menu .navbar-nav li{
    width: fit-content;
}

#sideNav .subscribe-btn .btn {
    color: white;
}

#sideNav .subscribe-btn:hover .btn {
    background-color: var(--dark);
}

.pv-page #sideNav .sign-in-btn:hover a{
    color: var(--pv-clr);
}



.sideSearch{
    margin: 0 .9rem;
}


.sideSearch form{
    position: relative;
    padding-bottom: 2rem;
}

.form-control {
    background-color: transparent;
    border: none;
    border-bottom: 1px solid rgba(0,0,0,0.125);
    border-radius: 0;
    padding: .375rem 20px .375rem 0;
    color: rgba(0,0,0,1);
}

.form-control::placeholder {
    color: rgba(0,0,0,1);
    opacity: 0.35;
}

.form-control:focus {
    background-color: transparent;
    box-shadow: none;
    border-bottom: 1px solid rgba(0,0,0,1);
    color: rgba(0,0,0,1);
}

form svg{
    position: absolute;
    right: 0;
    top: 8px;
    height: 18px;
}

form svg path{
    transition: .2s ease-in-out;
}

form svg:hover path{
    fill: var(--pv-clr);
    transition: .2s ease-in-out;
}

.sidenav-specialty-section{
    margin: 0 .9rem;
    padding: 1rem 0 .5rem 0;
    margin-bottom: .5rem;
    border-top: 3px solid rgba(0,0,0,0.125);
    border-bottom: 3px solid rgba(0,0,0,0.125);
}

.sidenav-specialty-section h3, .sidenav-pub-section h3{
    padding: 0rem;
}

.sidenav-specialty-section ul{
    margin-bottom: 0;
}

.sidenav-pub-section{
    margin: 0 .9rem;
    padding: 1rem 0 .5rem 0;
    margin-bottom: .5rem;
    border-bottom: 3px solid rgba(0,0,0,0.125);
}




@media (max-width: 550px){
    #sideNav {
        width: 100%;
    }
}







/* Publications Carousel */

.pubsToggle{
    position: relative;
    margin: 0 0 0 1.5rem;
    padding: 0;
    background-color: transparent;
    border: 1px solid transparent;
    border-radius: .25rem;
    color: white;
    transition: all 0.2s ease-in-out;
}

.pv-page .pubsToggle.pubsShow{
    color: var(--pv-clr);
    transition: all 0.2s ease-in-out;
}

.pv-page .pubsToggle.pubsShow .animated-underline {
    background-size: 100% 2px;
}

.pubsToggle::after {
    display: inline-block;
    margin-left: .255em;
    vertical-align: .255em;
    font-family: 'Material Icons';
    content: "\e5cf";
    border-top: none;
    border-right: none;
    border-bottom: none;
    border-left: none;
    line-height: 0;
    position: relative;
    top: 6px;
    opacity: .5;
    transition: all 0.25s ease-in-out;
}

.pubsToggle.pubsShow::after {
    transform: rotate(-180deg);
    transition: all 0.25s ease-in-out;
}

@media (max-width: 900px){
    .pubsToggle{
        display: none;
    }
}

/*

.topNav ul li a:hover .animated-underline{
    background-size: 100% 2px;
    color: inherit;
}

.topNav-left .publications-dropdown a.nav-link.show{
    color: var(--pv-clr);  
    transition: all 0.25s ease-in-out;
}
*/

.pubs-nav-carousel {
    display: block;
    position: fixed;
    width: 100%;
    transform: none !important;
    top: -100%;
    background-clip: border-box;
    border-radius: 0px;
    opacity: 0;
    transition: all .5s ease-in-out;
    z-index: 1060;
    background-color: white;
}

.pubs-carousel-open {
    display: block;
    opacity: 1;
    transition: all .5s ease-in-out;
}

.cover-carousel-section {
    position: relative;
    max-width: 1300px;
    margin: 0 auto;
    padding: 1rem var(--bs-gutter-x,.75rem);
}

#nav-cover-carousel-container, #body-cover-carousel-container  {
    width: calc(100% - 4rem);
    margin: 0 auto;
    overflow: hidden;
}

#nav-cover-carousel, #body-cover-carousel {
    display: flex;
    transition: transform 0.5s ease-in-out;
}

.cover-carousel-item, .body-cover-carousel-item {
    flex: 0 0 16.66%;
}

.cover-img-container {
    overflow: hidden;
    padding: 0.25rem 1rem 0rem 1rem;
    text-align: center;
}

.cover-img-container img {
    width: 100%;
    display: block;
    box-shadow: 0 0 5px rgba(0, 0, 0, 0.25);
    transition: .2s ease-in-out;
}

.cover-img-container img:hover {
    transform: scale(1.025);
    transition: .2s ease-in-out;
}

.carousel-pub-name{
    display: block;
    text-align: center;
    line-height: 1;
    margin-top: 1rem;
    padding-bottom: .25rem;
    text-decoration: none;
    color: var(--dark);
    transition: .2s ease-in-out;
}

#nav-cover-prev, #nav-cover-next, #body-cover-prev, #body-cover-next {
    cursor: pointer;
    top: 50%;
    transform: translateY(-50%);
    position: absolute;
    margin: 0;
    padding: 0;
    background-color: transparent;
    border: 1px solid transparent;
}

#nav-cover-prev::after, #nav-cover-next::after, #body-cover-prev::after, #body-cover-next::after {
    font-family: 'Material Icons';
    content: "\e5cf";
    display: block;
    font-size: 45px;
    opacity: .3;
    transition: .2s ease-in-out;
}

#nav-cover-prev:hover::after, #nav-cover-next:hover::after, #body-cover-prev:hover::after, #body-cover-next:hover::after {
    opacity: .5;
    transition: .2s ease-in-out;
}

#nav-cover-prev, #body-cover-prev {
    left: 0; 
}

#nav-cover-prev::after, #body-cover-prev::after {
    transform: rotate(90deg);
}

#nav-cover-next, #body-cover-next {
    right: 0;
}

#nav-cover-next::after, #body-cover-next::after {
    transform: rotate(-90deg);
}


@media (max-width: 1200px){
   .cover-carousel-item, .body-cover-carousel-item {
        flex: 0 0 20%;
    }   
}

@media (max-width: 1000px){
   .cover-carousel-item, .body-cover-carousel-item {
        flex: 0 0 25%;
    }   
}

@media (max-width: 800px){
   .cover-carousel-item, .body-cover-carousel-item {
        flex: 0 0 33.33%;
    }   
}

@media (max-width: 600px){
   .cover-carousel-item, .body-cover-carousel-item {
        flex: 0 0 50%;
    }   
}


















/* Logo Styles */

.nav-logo{
    position: relative;
    height: 90px;
    transition: .2s ease-in-out;
}


#pv-logo-lrg{
    width: 250px;
}

#pv-logo-sm{
    width: 395px;
}

.nav-logo-lrg, .nav-logo-sm{
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

.homepage-nav .nav-logo-lrg{
    opacity: 1;
}

.homepage-nav .nav-logo-sm{
    opacity: 0;
}

@media (max-width: 810px){
    #pv-logo-sm{
        width: 300px;
    }  
    
}

@media (max-width: 810px){
    #pv-logo-lrg{
        width: 200px;
    } 
}

@media (max-width: 570px) {
  #pv-logo-sm {
    width: 250px;
  }
}







/* Subscribe - Sign In Styles  */

.topNav .sub-signin-menu{
    justify-self: flex-end;
}

.topNav .sub-signin-menu .navbar-nav {
    display: flex;
    flex-direction: row;
    padding-left: 0;
    margin-bottom: 0;
    list-style: none;
    align-items: center;
}

.sub-signin-menu ul li{
    display: block;
    padding: .3rem .9rem;
    margin-bottom: 0px;
    color: white;
    position: relative;
    list-style: none;
}

.sub-signin-menu ul li a{
    color: white;
    text-decoration: none;
}

.pv-page .subscribe-btn {
    padding: .5rem 0;
}

.pv-page .subscribe-btn a, .pv-page .subscribe-btn .btn{
/*    padding: .5rem .9rem;*/
    background-color: var(--pv-clr);
    border-radius: .5rem;
    transition: .2s ease-in-out;
}

.pv-page .subscribe-btn:hover a, .pv-page .subscribe-btn:hover .btn{
    background-color: white;
    color: var(--pv-clr);
    border-radius: .5rem;
    transition: .2s ease-in-out;
}

@media (max-width: 900px){
    .sub-signin-menu .sign-in-btn{
        display: none;
    }
    
    .sub-signin-menu .account-btn{
        display: none;
    }
}

@media (max-width: 570px){
    .sub-signin-menu .subscribe-btn {
        display: none;
    }
}







/* Publication Secondary Nav */

.pub-topNav .nav-logo, .pub-topNav .nav-scrolled .nav-logo {
  height: 50px;
  transition: .2s ease-in-out;
}

.pub-topNav .nav-logo-lrg{
    opacity: 0
}

.pub-topNav .nav-logo-sm{
    opacity: 1;
}

.menu-search.fixed-icon {
    position: fixed;
    top: 21px;
    right: 1.35rem;
    z-index: 1050;
    height: 25px;
}

.menu-search.fixed-icon .menu-search-icon svg g path {
  fill: var(--dark);
  transition: all 0.2s ease-in-out;
}

.menu-search.fixed-icon .menu-search-icon:hover::before {
  background: var(--dark);
  transform: scale(1.7);
  transition: all 0.2s ease-in-out;
}

.menu-search.fixed-icon:hover .menu-search-icon svg g path {
  fill: white;
  transition: all 0.2s ease-in-out;
}

.secondaryNav{
    min-height: 66px;
    padding: 0 1rem;
    position: sticky;
    top: 0;
    z-index: 1020;
    background-color: white;
    border-bottom: 1px solid #E6E6E6;
    box-shadow: 0px 0px 8px rgba(0, 0, 0, .5);
}

.pub-nav-container{
    display: grid;
    grid-template-columns: auto 1fr;
    grid-gap: 1.5rem;
    width: 100%;
/*    max-width: 1200px;*/
    margin: 0 auto; 
    padding: 0;
    transition: all .2s ease-in-out;
}

/*
.secondary-scrolled .pub-nav-container{
    padding: 0 0 0 2.25rem;
    transition: padding .2s ease-in-out;
} 
*/

/*
@media (max-width: 1295px){
    .secondary-scrolled .pub-nav-container{
        padding: 0 0 0 2.65rem;
        transition: padding .2s ease-in-out;
    } 
}
*/


.pub-nav-logo{
    padding: .85rem 0;
    transition: all .2s ease-in-out;
}

.secondary-scrolled .pub-nav-logo {
    padding: .5rem 0 .5rem 0;
/*
    border-left: 1px solid rgba(0,0,0,0.15);
    margin-left: .35rem;
*/
    transition: all .2s ease-in-out;
}

.pub-nav-logo img{
    height: 60px;
}

.secondary-scrolled .pub-nav-logo img{
    height: 50px;
}

.secondaryNav ul.navbar-nav {
    display: flex;
    flex-direction: row;
    padding-left: 0;
    margin-bottom: 0;
    list-style: none;
    justify-content: center;
    justify-self: flex-end;
    height: 100%;
    align-items: center;
}

.secondaryNav.secondary-scrolled ul.navbar-nav {
    margin-right: 2.25rem;
}

.secondaryNav ul li{
    padding: .5rem .9rem;
    margin-bottom: 0px;
    color: var(--dark);
    position: relative;
    list-style: none;
    height: 100%;
    white-space: nowrap;
}

.secondaryNav ul li a:focus-visible {
    outline-color: transparent;
    outline-style: none;
    outline-width: 0px;
}

.pv-page .secondaryNav ul.dropdown-menu > li:hover {
    background-color: var(--pv-clr);
    transition: .2s ease-in-out;
}

.secondaryNav ul.dropdown-menu > li:hover  a{
    color: white;
    transition: .2s ease-in-out;
}

/*
.secondaryNav ul.navbar-nav > li:last-child {
    padding: .5rem 0 .5rem .9rem;
}
*/

.secondaryNav ul li a{
    color: var(--dark);
    padding: 0;
    text-align: center;
    transition: .2s ease-in-out;
    line-height: 1.2;
}

.secondaryNav ul.navbar-nav > li > a{
    position: relative;
    top: 50%;
    transform: translateY(-50%);
}

.secondaryNav ul li ul li a{
    color: var(--dark);
}

.secondaryNav ul li a.nav-link:hover, .secondaryNav ul li a.nav-link:focus {
    color: black;
    transition: .2s ease-in-out;
}

.pv-page .secondaryNav ul li a.nav-link.show {
    color: var(--pv-clr);
    transition: .2s ease-in-out;
}

.secondaryNav .navbar-nav .dropdown-menu {
    position: absolute;
    margin-top: 0;
    top: 100%;
    left: 50%;
    transform: translateX(-50%);
    border-top: none;
    border-radius: 0 0 .25rem .25rem;
    z-index: 40;
    max-width: 200px;
}

.secondaryNav .navbar-nav .nav-item:last-child .dropdown-menu {
    right: 0;
    left: auto;
    transform: translateX(0);
}

.secondaryNav.secondary-scrolled .navbar-nav .nav-item:last-child .dropdown-menu {
    right: auto;
    left: 50%;
    transform: translateX(-50%);
}

.secondaryNav ul.dropdown-menu > li:last-child {
    border-radius: 0 0 .15rem .15rem;
}

.secondaryNav ul li a.dropdown-item {
    white-space: normal;
}

/*
@media (max-width: 1230px){
    .pub-nav-logo {
        margin: 0 auto;
    }
    
    .secondaryNav ul.navbar-nav {
        display: none;
    }
}
*/

/*
.moreMenuBtn{
    position: fixed;
    right: 1.9rem;
    top: 21px;
    display: none;
}

.moreMenuBtn::after {
    display: inline-block;
    margin-left: .255em;
    vertical-align: .255em;
    font-family: 'Material Icons';
    content: "\e5d3";
    border-top: none;
    border-right: none;
    border-bottom: none;
    border-left: none;
    line-height: 0;
    position: relative;
    top: 6px;
    opacity: .5;
    transition: all 0.25s ease-in-out;
}
*/



@media (max-width: 1350px){
/*
    .secondaryNav.secondary-scrolled ul.navbar-nav {
        margin-right: 5.3rem;
    }
*/
    
/*
    .secondaryNav ul.navbar-nav > li:nth-child(8), .secondaryNav ul.navbar-nav > li:nth-child(7) {
        display: none;
    }
    
*/
/*
    .pub-topNav .fixed-icon .moreMenuBtn{
        display: block;
    }
*/
}



@media (max-width: 1280px){
    .pub-nav-container {
        grid-template-columns: 1fr;
        align-items: center;
    }
    
    .pub-nav-logo {
        margin: 0 auto;
    }
    
    .secondary-scrolled .pub-nav-container {
        grid-template-columns: auto 1fr;
        align-items: center;
    }
    
    .secondaryNav ul.navbar-nav {
        display: none;
    }
    
    .secondaryNav ul.navbar-nav > li:nth-child(6) {
        display: none;
    }
/*
    .secondaryNav ul.navbar-nav > li:nth-child(6) {
        padding: .5rem 0 .5rem .9rem;
    }
*/
}














/* Bottom Nav Styles */

.bottomNav{
    background-color: black;
    justify-content: center;
    padding: 0;  
}

.bottomNav ul.navbar-nav {
    display: flex;
    flex-direction: row;
    padding-left: 0;
    margin-bottom: 0;
    list-style: none;
    justify-content: center;
}

.bottomNav ul li{
    padding: .5rem .9rem;
    margin-bottom: 0px;
    color: white;
    position: relative;
    list-style: none;
}

.bottomNav ul li a{
    color: white;
    padding: 0;
    text-align: center;
    transition: .2s ease-in-out;
    line-height: 1.2;
}

.bottomNav ul li ul li a{
    color: var(--dark);
}

.bottomNav ul li a.nav-link:hover, .bottomNav ul li a.nav-link:focus, .topNav ul li a.nav-link:hover, .topNav ul li a.nav-link:focus{
    color: white;
    transition: .2s ease-in-out;
}

.dropdown-toggle::after {
    display: inline-block;
    margin-left: .255em;
    vertical-align: .255em;
    font-family: 'Material Icons';
    content: "\e5cf";
    border-top: none;
    border-right: none;
    border-bottom: none;
    border-left: none;
    line-height: 0;
    position: relative;
    top: 6px;
    opacity: .5;
    transition: all 0.25s ease-in-out;
}

.dropdown-toggle.show::after {
  transform: rotate(-180deg);
  transition: all 0.25s ease-in-out;
}

.bottomNav ul li a:hover .animated-underline{
    background-size: 100% 2px;
    color: inherit;
}

.dropdown-toggle.show .animated-underline{
    background-size: 100% 2px;
}

.bottomNav .navbar-nav .dropdown-menu {
    position: absolute;
    margin-top: 0;
    top: 98%;
    left: 50%;
    transform: translateX(-50%);
    border-radius: 0 0 .25rem .25rem;
    z-index: 40;
}

.bottomNav ul li a.nav-link.show{
    color: var(--pv-clr);  
    transition: all 0.25s ease-in-out;
}









.scrolled-down{
  transform:translateY(-100%); transition: all 0.3s ease-in-out;
}
.scrolled-up{
  transform:translateY(0); transition: all 0.3s ease-in-out;
}












.nav-scrolled{
    
}

.nav-scrolled .nav-logo{
    height: 50px;
    transition: .2s ease-in-out;
}

.nav-scrolled .nav-logo-lrg{
    opacity: 0;
    transition: .2s ease-in-out;
}

.nav-scrolled .nav-logo-sm{
    opacity: 1;
    transition: .2s ease-in-out;
}






/* Pentavision Specific Styles */


@media (max-width: 935px){
    .bottomNav{
        display: none;
    }   
}


/* Nav Styles: END */


/* Podcast Style : START */
@charset "UTF-8";
/* Podcasts CSS Document */

.podcast-embed-container{
    width: 100%; 
    line-height: 0;
    box-shadow: 0 0 8px 0 rgba(0,0,0,0.15);
    margin-bottom: 1.5rem;
}


.guest-list{
    display: flex;
    flex-wrap: wrap;
    margin: .25rem 0 1.5rem 0;
    line-height: 25px;
    font-size: .65rem;
}

.guest-list p.by-author{
    padding: 0;
    margin: 0;
    line-height: 25px;
}


.pod-series-grid{
    display: grid;
    grid-gap: 1.5rem;
}

.pod-series-grid article h3{
    margin-bottom: 0;
}

.accordion-body.pod-series-grid {
    padding: 0;
}

/* Podcast Styles : END */


/* Product Styles : START */
/* Products Page Styles */
#product-page{
    background-color: var(--grey-bg-clr);
}

.featured-prod-grid{
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-gap: 1.5rem;
    border-bottom: 1px solid #CCCCCC;
    padding: 0 0 2rem 0;
    margin-bottom: 2rem;
}

.featured-prod-grid article .thumb-image img {
  width: 100%;
  height: 100%;
  aspect-ratio: 12 / 9;
  object-fit: cover;
  object-position: center center;
}



.prod-filters{
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-start;
    gap: 1.5rem;
}

.all-prod-grid{
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    grid-gap: 1.5rem;
    margin: 1.5rem auto;
}

@media (max-width: 850px) {
    .all-prod-grid{
        grid-template-columns: 1fr 1fr;
    }
}

@media (max-width: 700px) {
    .featured-prod-grid{
        grid-template-columns: 1fr;
    }
}

@media (max-width: 650px) {
   .all-prod-grid{
        grid-template-columns: 1fr;
    } 
}

.all-prod-grid article .thumb-image img {
  width: 100%;
  height: 100%;
  aspect-ratio: 12 / 9;
  object-fit: cover;
  object-position: center center;
}

/* Product Styles : END */


/* pubhome Styles : START */
#pub-top-content{
     background-color: var(--grey-bg-clr);
}

.main-hero-card{
    display: grid;
    grid-template-columns: 21fr 11fr;
    margin-bottom: 1.5rem;
    width: 100%;
    min-height: 400px;
    background-color: white;
    border: 1px solid #E6E6E6;
}

.main-hero-card .thumb-image{
    width: 100%;
    overflow: hidden;
    border-right: 1px solid #E6E6E6;
}

.main-hero-card .thumb-image img{
    width: 100%;
    height: 100%;
    aspect-ratio: 16 / 9;
    object-fit: cover;
    object-position: center center;
}

.main-hero-card .card-copy{
    padding: 1rem;
}

@media (max-width: 900px) {
    .main-hero-card{
        grid-template-columns: 1fr;
    }
    .main-hero-card .thumb-image{
        border-right: 0;
        border-bottom: 1px solid #E6E6E6;
    }
}

@media (max-width: 670px) {
    #pub-top-content {
        padding-left: 0;
        padding-right: 0;
    }
    
    #pub-top-content .grid-content-sidebar {
        padding-top: 0 !important;
    }
    
    .main-hero-card{
        border-top: none;
        border-right: none;
        border-bottom: 2px solid #E6E6E6;
        border-left: none;
    }
    .main-hero-card .thumb-image{
        min-height: 400px;
    }
}

.current-issue-card{
    padding: 2rem;
    background-color: #1A1A1A;
    color: white;
}

.ci-card-header {
    display: grid;
    grid-template-columns: auto auto;
    justify-content: flex-start;
    align-items: flex-end;
    margin: 0 0 1rem 0;
    padding: 0 0 .75rem 0;
    border-bottom: 2px solid #B3B3B3;
}

.ci-card-header h2{
    font-size: 1.75rem;
    margin: 0 .75rem 0 0;
    line-height: 1;
}

.ci-card-header p{
    display: flex;
    flex-wrap: wrap;
    font-size: .9rem;
    margin-bottom: 0;
    line-height: 1;
}

.ci-card-header p span{
    margin: 5px 0.5rem 2px 0;
    padding: 0 0.5rem 0 0;
    line-height: 1;
    border-right: 1.5px solid #666;
    font-weight: 200;
    break-inside: avoid-column;
}

.ci-card-header p span:last-child{
    border-right: none;
}

.ci-cover-toc-grid{
    display: grid;
    grid-template-columns: 280px 1fr;
    grid-gap: 1.5rem;
}

.ci-cover{
    max-width: 320px;
    margin: 0 auto;
}

.current-issue-card img{
    width: 100%;
    border: 1px solid #E6E6E6;
    margin-bottom: 1rem;
    box-shadow: 0 0 7px rgba(0, 0, 0, 0.1);
    transition: .2s ease-in-out;
}

.current-issue-card img:hover{
    transform: scale(1.015);
    transition: .2s ease-in-out;
}

.ci-button-container{
    display: grid;
    grid-template-columns: 2fr 3fr;
    grid-gap: 1rem;
}

.ci-button-container a.btn{
    font-size: .9rem;
}

.ci-article-list{
    display: grid;
    align-content: flex-start;
}

.ci-article-list .card-copy{
    padding: 0 0 1rem 0;
    margin: 0 0 1rem 0;
    border-bottom: 1px solid #B3B3B3;
}

.ci-article-list .card-copy h2 a, .ci-article-list .card-copy h3 a {
    color: white;
    text-decoration: none; 
    transition: .2s ease-in-out;
}

.pv-page .ci-article-list .card-copy h2 a:hover, .pv-page .ci-article-list .card-copy h3 a:hover{
    color: var(--pv-clr);
    transition: .2s ease-in-out;
}

.ci-article-list .card-copy p a{
  color: #B2B2B2;
}

.ci-article-list .card-copy p {
  color: #B2B2B2;
}

.ci-article-list div:last-child{
    display: grid;
    justify-content: flex-end;
}

a.toc-btn{
    display: inline-block;
    position: relative;
    right: 0;
    color: white;
    text-decoration: none;
    text-align: right;
    transition: all 0.2s ease-in-out;
}

.toc-btn::after {
    display: inline-block;
    margin-left: .255em;
    vertical-align: .255em;
    font-family: 'Material Icons';
    content: "\e5c8";
    border-top: none;
    border-right: none;
    border-bottom: none;
    border-left: none;
    line-height: 0;
    position: relative;
    top: 6px;
    opacity: .5;
    transform: scale(1.3);
    transition: all 0.2s ease-in-out;
}

a.toc-btn:hover {
    right: -5px;
    transition: all 0.2s ease-in-out;
}




@media (max-width: 770px){
    .ci-card-header{
        grid-template-columns: 1fr 1fr;
        grid-gap: 1rem;
    }
    
    .ci-card-header p{
        justify-content: flex-end;
        overflow: hidden;
    }
    
    .ci-card-header p span {
        position: relative;
        right: -1rem;
    }
    
    .ci-cover-toc-grid{
        display: grid;
        grid-template-columns:1fr;
        grid-gap: 1.5rem;
    }
}

@media (max-width: 550px){
    .ci-card-header {
        grid-template-columns: 1fr;
        grid-gap: .5rem;
        justify-items: center;
      }
    
    .ci-card-header h2 {
        margin: 0 0 0 0;
        text-align: center
    }
    
    .ci-card-header p {
        justify-content: center;
        text-align: center;
    }
    
    .ci-card-header p span {
        right: 0;
    }
    
    .ci-card-header p span:last-child {
        margin: 5px 0 2px 0;
        padding: 0 0 0 0;
    }
}

/* pubhome Styles : END */


/* series Styles : START */
@charset "UTF-8";
/* Series/Episodes CSS Document */

.series-thumb-desc{
    display: grid;
    grid-template-columns: auto 1fr;
    grid-gap: 1.5rem;
    margin-bottom: 3rem;
}

@media (max-width: 650px) {
    .series-thumb-desc{
        grid-template-columns: 1fr;
    }
}

.series-thumb-desc img {
  width: 250px;
  border: 1px solid #E6E6E6;
  margin: 0 auto;
}


.series-thumb-desc .tag-texts {
    margin-bottom: .25rem;
    font-weight: bold;
    font-size: .75rem;
    text-transform: uppercase;
    letter-spacing: .025rem;
    line-height: 1;
    color: #5B5B5B;
}

.series-thumb-desc .title-subtext {
    font-size: .65rem;
    text-transform: uppercase;
    letter-spacing: .025rem;
    line-height: 1;
    color: #5B5B5B;
    margin-top: .5rem;
    margin-bottom: .75rem;
    text-decoration: none;
}
/* series Styles : END */

/* sitewide Styles : START */
:root{
    --brand-clr-1: #383838;
    --brand-clr-2: ;
    --dark: #1A1A1A;
    --grey-bg-clr: #F2F2F2;
    --pv-clr: #c1b09c;
    --pv-hvr-clr: #70665C;
    --bcm-clr: #e60c2e;
    --accent-clr: ; 
    --header-font: var(--vs-header-font);
    --body-font: var(--vs-body-font);
}



/* Sitewide Styles */
    
body{
    font-size: 16px;
    font-family: var(--body-font);
}

body *{
    scroll-margin-top: 85px;
}

header{
/*
    position: sticky;
    top: 0;
*/
    z-index: 1070;
    box-shadow: 0px 0px 8px rgba(0, 0, 0, .5);
}
    
h1{
    font-size: 2rem;
    font-family: var(--header-font);
    font-weight: 800;
    letter-spacing: .02rem;
}

h1.section-title{
    font-size: 1.5rem;
    font-family: var(--header-font);
    font-weight: 300;
    text-transform: uppercase;
    letter-spacing: .02rem;
    border-top: 3px solid #CCCCCC;
    padding: .25rem 0 .75rem 0;
}

h1.page-title{
    font-size: 2.25rem;
    font-family: var(--header-font);
    font-weight: 300;
    text-transform: uppercase;
    letter-spacing: .02rem;
    border-bottom: 3px solid #CCCCCC;
    padding: 0 0 .75rem 0;
    margin: 0 0 1.5rem 0;
}

h2{
    font-size: 1.35rem;
    font-family: var(--header-font);
    font-weight: 800;
}

h2 a{
    color: var(--dark);
    text-decoration: none;
}

h3{
    font-size: 1rem;
    font-family: var(--header-font);
    font-weight: 800;
}

h3 a{
    color: var(--dark);
    text-decoration: none;
}

.white-text h1, .white-text h2, .white-text h3, .white-text p{
    color: white;
}

h1, h2, h3, h4, h5, h6 {
    font-family: var(--header-font);
    font-weight: var(--vs-fw-bold);
    font-optical-sizing: auto;
    color: var(--text-primary);
    line-height: var(--vs-lh-header);
    text-wrap: pretty;
}

h1 {font-size: var(--vs-fs-h1-global);}
h2 {font-size: var(--vs-fs-h2-global);}
h3 {font-size: var(--vs-fs-h3-global);}
h4 {font-size: var(--vs-fs-h4-global);}
h5 {font-size: var(--vs-fs-h5-global);}
h6 {font-size: var(--vs-fs-h6-global);}

hr{
  margin: 1.5rem 0;
}

a.btn, .btn{
    background-color: var(--brand-clr-1);
    color: white;
    padding: .25rem .9rem;
    border-radius: .5rem;
    text-decoration: none;
    transition: .2s ease-in-out;
}

a.btn:hover, .btn:hover{
    color: white;
    background-color: #1E1E1E;
    transition: .2s ease-in-out;
}

a.btn-small, .btn-small{
    line-height: 1;
    font-size: .75rem;
    background-color: transparent;
    color: #5B5B5B;
    border: 1px solid #CCCCCC;
    padding: .25rem .75rem;
    border-radius: .5rem;
    text-decoration: none;
    transition: .2s ease-in-out;
}

a.btn-outlined{
    background-color: transparent;
    border: 1px solid #CCCCCC;
    transition: .2s ease-in-out;
}

a.btn-outlined{
    background-color: #CCCCCC;
    border: 1px solid #CCCCCC;
    color: white;
    transition: .2s ease-in-out;
}

.btn-small:hover{
    background-color: #CCCCCC;
    transition: .2s ease-in-out;
}

.btn-disabled {
  opacity: .5;
  cursor: initial;
  color: white;
}
 
.pv-page .btn.btn-disabled:hover {
  opacity: .5;
  cursor: initial;
  background-color: var(--pv-clr);
  color: white;
}

.view-more{
    position: absolute;
    top: 15px;
    right: 0;
    padding: 0 var(--bs-gutter-x,.75rem);
    color: var(--dark);
    text-decoration: none;
    line-height: 1;
}

.white-card {
  width: 100%;
  background-color: white;
  border: 1px solid #E6E6E6;
}

.white-card .card-copy {
  padding: 1rem;
}

.white-card .card-copy h3{
    font-size: 1rem;
    margin-top: 0;
}

.white-card .card-copy h2 a, .white-card .card-copy h3 a {
  color: var(--dark);
  text-decoration: none;
}

.pv-page .white-card .card-copy h2 a:hover, .pv-page .white-card .card-copy h3 a:hover {
  color: var(--pv-clr);
  text-decoration: none;
}

.white-card .thumb-image {
  width: 100%;
  overflow: hidden;
}

.text-top-card{
    overflow: hidden;
    width: 100%;
    position: relative;
    border: 1px solid #E6E6E6;
}

.text-top-card .thumb-image {
    overflow: hidden;
    width: 100%;
    height: 100%;
}

/*
.text-top-card .card-copy {
    position: absolute;
    bottom: 0;
    padding: 6.5rem 1rem 1rem 1rem;
    width: 100%;
    background: linear-gradient(0deg, rgb(0, 0, 0) 0%, rgba(0, 0, 0, 0.81) 23%, rgba(0,0,0,0.7) 36%, rgba(0,0,0,0.1) 85%, rgba(0,0,0,0) 100%);
}
*/

.text-top-card .card-copy {
    position: absolute;
    bottom: 1rem;
    left: 1rem;
    right: 1rem;
}

.text-top-card .thumb-image::after{
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: linear-gradient(0deg, rgb(0, 0, 0) 0%, rgba(0, 0, 0, 0.81) 23%, rgba(0,0,0,0.7) 36%, rgba(0,0,0,0.1) 85%, rgba(0,0,0,0) 100%);
}

.text-top-card .card-copy h2 a,.text-top-card .card-copy h3 a {
    color: white;
    transition: .2s ease-in-out;
}

.text-top-card .card-copy p.pub-source {
    color: #B2B2B2;
}

.tag-rule-overflow{
    display: block;
    overflow: hidden;
    position: relative;
}

.top-tags, .card-copy p.top-tags {
    display: flex;
    flex-wrap: wrap;
    font-size: .65rem;
    text-transform: uppercase;
    letter-spacing: .025rem;
    line-height: 1;
    color: #5B5B5B;
    margin-bottom: 0rem;
    position: relative;
    left: calc(-1rem - 1px);
    overflow: hidden;
}

.top-tags span {
    margin: 0 0 5px .5rem;
    padding: 0 0 0 .5rem;
    border-left: 1px solid #CCCCCC;
    line-height: 1;
    font-size: inherit;
    break-inside: avoid-column;  
}

.tag-spctly{
    font-weight: bold;
}

.text-top-card .card-copy h2 a:hover, .text-top-card .card-copy h3 a:hover {
    color: white;
    opacity: .7;
    transition: .2s ease-in-out;
}

.card-copy p.tag-texts, .card-copy p.tag-texts a, p.tag-text a, .tag-texts{
    font-size: .65rem;
    text-transform: uppercase;
    letter-spacing: .025rem;
    line-height: 1;
    color: #5B5B5B;
}

article.text-top-card .card-copy p {
  color: #B2B2B2;
}

.text-top-card .card-copy p.tag-texts a, .text-top-card p.tag-texts a, .text-top-card .card-copy .tag-texts p a{
    color: #B2B2B2;
    text-decoration: none;
}

.text-top-card .card-copy p.tag-texts a:hover, .text-top-card p.tag-texts a:hover, .text-top-card .card-copy .tag-texts p a:hover{
    color: var(--pv-clr);
    text-decoration: none;
}

.card-copy .pub-source{
    font-weight: bold;
    margin-bottom: .25rem !important;
    line-height: 1;
}

.card-copy .source-name{
    font-size: .65rem;
    text-transform: uppercase;
    letter-spacing: .025rem;
    line-height: 1;
    color: #5B5B5B;
    margin-bottom: 0;
    font-style: italic;
}

.card-copy .pub-source a{
    text-decoration: none;
}

.card-copy h2, .card-copy h3{
    margin-bottom: .5rem;
}

.card-copy h2 a, .card-copy h3 a{
    color: var(--dark);
    text-decoration: none;
}

.card-copy p{
    font-size: 1rem;
    line-height: 1.3;
    margin-bottom: .75rem;
}

.thumb-image{
    position: relative;
}

.content-icon{
    position: absolute;
    top: 1rem;
    left: 1rem;
    z-index: 10;
    transition: .2s ease-in-out;
}

.content-icon svg{
    width: 40px;
    filter: drop-shadow(0 0 5px rgba(0, 0, 0, .25));
}

.vid-icon{
    transition: .2s ease-in-out;
}

.content-icon:hover, .vid-icon:hover{
    transform: scale(1.05);
    transition: .2s ease-in-out;
}


.author-name, .author-name p, p.author-name{
    font-size: .65rem;
    text-transform: uppercase;
    letter-spacing: .025rem;
    line-height: 1;
    color: #5B5B5B;
    margin-bottom: 0;
}

.animated-underline{
    padding-bottom: 3px;
    text-decoration: none;
    background-repeat: no-repeat;
    background-position: bottom left;
    background-size: 0% 2px;
    transition: background-size .25s ease-in-out;
}

.animated-underline:hover {
    background-size: 100% 2px;
    color: inherit;
}







.white-fill{
    fill: #fff;
}

.pv-tan-fill{
    fill:#c1b09c;
}

.bcm-red-fill{
    fill:#e60c2e;
}

.grey-bg{
    background-color: var(--grey-bg-clr);
}

.max-width{
    width: 100%;
    max-width: 1200px;
}

.homepage .max-width{
    width: 100%;
    max-width: 1300px;
}

.articlepage .max-width{
    width: 100%;
    max-width: 1200px;
}

.body-overlay{
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    opacity: 0;
    background-color: transparent;
    width: 100%;
    height: 100vh; 
    z-index: -1000;
    transition: .15s ease-in-out;
}

.overlay-on{
    opacity: 1;
    background-color: rgba(0,0,0,.5);
    z-index: 10;
    transition: .3s ease-in-out;
}

.grid-content-sidebar{
    display: grid;
    grid-template-columns: 1fr auto;
    position: relative;
    z-index: 1;
    align-items: flex-start;
}

.grid-gutter{
    grid-gap: 1.5rem;
}

.body-content-container{
    max-width: 876px;
    margin: 0 auto;
}

.body-content-container.sticky-top{
    top: 80px;
}

.sidebar-container{
    height: 100%;
    width: 300px;
}

.sidebar-container .sticky-top {
    z-index: 1;
    display: grid;
    grid-gap: 1.5rem;
    top: 80px;
}

@media (max-width: 1100px){
    .grid-content-sidebar{
        grid-template-columns: 1fr;
        grid-row-gap: 3rem;
    }
    
    .body-content-container.sticky-top{
        top: 0;
    }
    
    .grid-content-sidebar .sticky-top{
        position: relative;
    }
    
    .sidebar-container .sticky-top {
        top: 0px;
        grid-gap: 3rem;
    }
}

.thumb-image img{
    object-fit: cover;
    object-position: center center;
    width: 100%;
    height: 100%;
    transform: scale(1);
    transition: .25s ease-in-out;
}

article:hover > .thumb-image img, article:hover > a .thumb-image img{
    transform: scale(1.05);
    transition: .25s ease-in-out;
}









/* Sidebar Section Styles */

.sidebar-list{
    max-width: 500px;
    margin: 0 auto;
}

.sidebar-list h1{
    padding: .5rem 0;
    border-top: 3px solid #CCCCCC;
/*    border-bottom: 1px solid #B3B3B3;*/
}

.sidebar-list-items article{
    padding: 0 0 1rem 0;
    margin: 0 0 1rem 0;
    border-bottom: 1px solid #B3B3B3;
}

.sidebar-list-items article a{
    text-decoration: none;
    color: var(--dark);
}

@media (max-width: 1100px){
    .sidebar-list-items article:last-child {
      margin: 0 0 0 0;
    }
}





/* Pagination */

.pagination {
    margin-bottom: 0;
}

.page-item a.page-link {
    position: relative;
    display: block;
    color: var(--dark);
    text-decoration: none;
    background-color: #fff;
    border: 1px solid #CCCCCC;
    transition: color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out;
}

.pv-page .page-item a.page-link:hover {
    color: var(--pv-clr);
    text-decoration: none;
}

.pv-page .page-item.active .page-link {
    z-index: 3;
    color: #fff;
    background-color: var(--pv-clr);
    border-color: var(--pv-clr);
}

.pv-page .page-item.active .page-link:hover {
    color: #fff;
}

.page-link:hover {
    z-index: 2;
    color: var(--pv-clr);
    background-color: white;
    border: 1px solid #CCCCCC;
}

.page-item.disabled .page-link {
    color: rgba(0,0,0,0.25);
}







/* Pagination */

.pagination {
  margin-top: 1.5rem;
}












/* Footer Styles */

footer{
    background: black;
    padding: 3rem 2rem;
    font-size: .85rem;
}

.footer-grid{
    display: grid;
    grid-template-columns: 1.5fr 1fr 1fr 1fr;
    grid-column-gap: 2.5rem;
    margin-bottom: 1.5rem;
    padding-bottom: 1.5rem;
    border-bottom: 1px solid #808080; 
}

.footer-logo{
    width: 100%;
}

.footer-logo p{
    color: #808080;
    margin-top: 1rem;
}

.footer-grid h3{
    color: #FFFFFF;
    text-transform: uppercase;
    font-size: .8rem;
    letter-spacing: .05rem;
    margin-bottom: 1rem;
}

.footer-nav-list{
    list-style: none;
    padding: 0;
}

.footer-nav-list li{
    line-height: 1.2;
    margin-bottom: .5rem;
}

.footer-nav-list li a{
    color: #808080;
    text-decoration: none;
    transition: .2s ease-in-out;
}

/*
.footer-nav-list li:hover a{
    color: var(--pv-clr);
    transition: .2s ease-in-out;
}
*/


.all-footer-logos-section{
    margin-bottom: 1.5rem;
    padding: 1rem 0 2rem 0;
    border-bottom: 1px solid #808080;
}

.all-footer-logos-section h3{
    text-align: center;
    color: #FFFFFF;
    text-transform: uppercase;
    font-size: .8rem;
    letter-spacing: .05rem;
    margin-bottom: 2rem;
}

.all-footer-logos{
    display: flex;
    flex-wrap: wrap;
    column-gap: 2.5rem;
    row-gap: 1.5rem;
    justify-content: center;
    align-items: center;
}

.pub-logo-footer{
    width: 140px;
}

.terms-copyright-grid{
    display: grid;
/*    grid-template-columns: 1fr 1fr;*/
    grid-template-columns: 1fr;
    grid-column-gap: 1.5rem;
    color: #808080;
/*
    margin-top: 2.5rem;
    padding-top: 1rem;
    border-top: 1px solid #808080; 
*/
}

.terms-privacy-links ul{
    list-style: none;
    padding: 0;
}

.terms-privacy-links ul li{
    display: inline-block;
    padding-right: .5rem;
    margin-right: .25rem;
    border-right: 1px solid #808080;
    line-height: 1
}

.terms-privacy-links ul li:last-child{
    border-right: none;
}

.terms-privacy-links li{
    line-height: 1.2;
}

.terms-privacy-links li a{
    color: #808080;
    text-decoration: none;
    transition: .2s ease-in-out;
}

.copyright-text{
/*    text-align: right;*/
    text-align: center;
}

@media (max-width: 900px){
    .footer-grid{
        display: grid;
        grid-template-columns: 1fr 1fr 1fr;
        grid-column-gap: 1.5rem;
    }
    
    .footer-logo{
        grid-column: 1/4;
        margin-bottom: 2.5rem;
/*        order: 1;*/
    } 
    
/*
    .footer-nav:nth-child(1){
        order: 2;
    }
    
    .footer-nav:nth-child(2){
        order: 3;
    }
    
    .footer-nav:nth-child(3){
        order: 4;
    }
*/
    
    
}

@media (max-width: 800px){
    .terms-copyright-grid {
        grid-template-columns: 1fr;
    }
/*
    
    .footer-grid .footer-nav.pubs {
        grid-column: 1/4;
    }
    .footer-grid .footer-nav.pubs .footer-nav-list{
        column-count: 2;
    }
*/
    
    
    
    .terms-privacy-links{
        text-align: center;
    }
    
    .copyright-text{
        text-align: center;
    }
}



/* VisionCare CE */

.visioncarece .max-width{
    max-width: 1000px;
}

.visioncarece .top-section{
    padding: 3rem 0;
    background-color: var(--grey-bg-clr);
}  

.hero-card{
    background-color: white;
    border: 1px solid #E6E6E6;
}

.hero-card .card-copy{
    padding: 2rem;
}

.hero-card .card-copy p:last-child{
    margin-bottom: 0;
}

.ce-home-card-container{
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 1.75rem;
    margin-top: 2rem;
    justify-content: center;
}

.ce-home-card{
    text-align: center;
    display: grid;
    justify-items: center;
    align-content: center;
    border: 1px solid #E6E6E6;
    background: rgb(154,202,237);
    background: -webkit-linear-gradient(5deg, rgba(154,202,237,1) 0%, rgba(83,96,164,1) 100%);
    background: -o-linear-gradient(5deg, rgba(154,202,237,1) 0%, rgba(83,96,164,1) 100%);
    background: linear-gradient(95deg, rgba(154,202,237,1) 0%, rgba(83,96,164,1) 100%);
    transition: .2s ease-in-out;
}

.ce-home-card:hover{
    transform: scale(1.02);
    transition: .2s ease-in-out;
}

.ce-home-card a{
    text-decoration: none;
    width: 100%;
    height: 100%;
    padding: 2rem;
    transition: .2s ease-in-out;
}



.ce-home-card h2{
    font-size: 1.75rem;
    color: white;
    text-align: center;
    text-decoration: none;
    margin-bottom: 0;
}

.ce-home-card p{
    color: white;
}

.ce-home-card img{
    margin-top: 1.5rem;
    width: 100%;
    max-width: 150px;
}

.visioncarece .cover-text-grid .thumb-image img {
    border-radius: 1.15rem;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center center;
    box-shadow: 0 0 5px rgba(0,0,0,0.25);
}

.visioncarece .cover-text-grid .description {
    margin-top: .75rem;
}

.footer-ce-text{
    grid-column: 1/3
}

.footer-ce-text p {
  color: #808080;
}

@media (max-width: 900px) {
    .footer-ce-text{
        grid-column: 1/4
    }
}

@media (max-width: 800px) {
    .ce-home-card-container{
        grid-template-columns: 1fr;
    }
}









/* Sitewide PV Styles */

.pv-page a{
    transition: .2s ease-in-out;
}

.pv-page a:hover{
    color: var(--pv-clr);
    transition: .2s ease-in-out;
}

.pv-page .animated-underline{
    background-image: linear-gradient(var(--pv-clr), var(--pv-clr));
}

/*
.pv-page .btn{
    background-color: var(--pv-clr);
}

.pv-page .btn:hover{
    background-color: var(--pv-hvr-clr);
    color: white;
}*/

.pv-logo-footer{
    width: 100%;
    max-width: 250px;
}

.pv-page a.btn-outlined{
    background-color: transparent;
    border: 1px solid var(--pv-clr);
    transition: .2s ease-in-out;
}

.pv-page a.btn-outlined:hover{
    background-color: var(--pv-clr);
    color: white;
    transition: .2s ease-in-out;
}

/*sitewide Stles : END */


/* Button Styles ----------------- */
/* ------------------------------ */
/* ----------------------------- */
/* ---------------------- (°_°) */


/* Default Button ---------------- */
/* ------------------------------ */

[type="button"], [type="reset"], [type="submit"], button, a.btn, .btn {
    display: inline-flex;
    position: relative;
    column-gap: var(--vs-spacing-4);
    align-items: center;
    justify-content: center;
    padding: var(--vs-spacing-4) var(--vs-spacing-5);
    min-width: 24px;
    min-height: 24px;
    font-family: var(--vs-body-font);
    font-size: var(--vs-fs-4);
    line-height: var(--vs-lh-dense);
    white-space: nowrap;
    text-decoration: none;
    color: var(--text-primary-contrastText);
    background: var(--btn-primary);
    border: 1px solid var(--btn-primary);
    border-radius: var(--vs-radius-sm);
    box-shadow: none;
    transition: var(--vs-anim-normal);
    flex-shrink: 0;
}

a.btn:hover, .btn:hover{
    color: var(--text-primary-contrastText);
    background: var(--btn-primary-hover);
    border: 1px solid var(--btn-primary-hover);
    transition: var(--vs-anim-normal) ;
}

a.btn:focus, .btn:focus{
    color: var(--text-primary-contrastText);
    background: var(--btn-primary-active);
    border: 1px solid var(--btn-primary-active);
    outline: 3px solid var(--border-focused);
    transition: var(--vs-anim-normal);
}

a.btn.btn:active, button.btn.btn:active{
    color: var(--text-primary-contrastText);
    background: var(--btn-primary-active);
    border: 1px solid var(--btn-primary-active);
    transition: var(--vs-anim-normal);
}

.btn svg, .btn .icon{
    max-width: var(--vs-spacing-6); max-height: var(--vs-spacing-6);
}


/* CTA Button -------------------- */
/* ------------------------------ */

a.btn--cta, .btn--cta {
    color: var(--text-primary-contrastText);
    background: transparent;
    border: 1px solid var(--btn-cta);
}

.btn--cta * {
    position: relative;
    z-index: 2;
}

a.btn--cta::after, .btn--cta::after {
    content: '';
    position: absolute;
    top: 0; right: 0; bottom: 0; left: 0;
    z-index: -1;
    background: 
      linear-gradient(
          0deg, 
          #107BA9 0%,
          #0693CC 25%,
          #3CABD9 100%
      );
    opacity: 1;
    transition: var(--vs-anim-normal);
}

a.btn--cta:hover, .btn--cta:hover {
    color: var(--text-primary-contrastText);
    background: var(--btn-cta-hover);
    border: 1px solid var(--vs-primary-blue-80);
    box-shadow: var(--vs-shadow-xs);
}

a.btn--cta::after:hover, .btn--cta::after:hover, a.btn--cta::after:focus, .btn--cta::after:focus, a.btn--cta::after:active, .btn--cta::after:active {
    opacity: 0;
    transition: var(--vs-anim-normal);
}

a.btn--cta:focus, .btn--cta:focus {
    color: var(--text-primary-contrastText);
    background: var(--btn-cta-hover);
    border: 1px solid var(--vs-primary-blue-80);
    outline: 3px solid var(--border-focused);
    box-shadow: var(--vs-shadow-xs);
}

a.btn.btn--cta:active, button.btn.btn--cta:active {
    color: var(--text-primary-contrastText);
    background: var(--btn-cta-hover);
    border: 1px solid var(--vs-primary-blue-80);
    box-shadow: var(--vs-shadow-xs);
}


/* Primary Button ---------------- */
/* ------------------------------ */
/* 
These classes are not needed as they are the same as the default btn class. Left here for reference.

a.btn--primary, .btn--primary {}
a.btn--primary:hover, .btn--primary:hover {}
a.btn--primary .fill--clr-1, .btn--primary .fill--clr-1 {}
a.btn--primary:hover .fill--clr-1, .btn--primary:hover .fill--clr-1 {}
*/


/* Primary Reverse Button -------- */
/* ------------------------------ */

a.btn--primary-rev, .btn--primary-rev {
    color: var(--btn-primary-rev-contrastText);
    background: var(--btn-primary-rev);
    border: 1px solid var(--btn-primary-rev);
}

a.btn--primary-rev:hover, .btn--primary-rev:hover {
    color: var(--btn-primary-rev-contrastText);
    background: var(--btn-primary-rev-hover);
    border: 1px solid var(--btn-primary-rev-hover);
    box-shadow: var(--vs-shadow-xs);
}

a.btn--primary-rev:focus, .btn--primary-rev:focus {
    color: var(--btn-primary-rev-contrastText);
    background: var(--btn-primary-rev-active);
    border: 1px solid var(--btn-primary-rev-active);
    outline: 3px solid var(--border-focused);
    box-shadow: var(--vs-shadow-xs);
}

a.btn.btn--primary-rev:active, button.btn.btn--primary-rev:active {
    color: var(--btn-primary-rev-contrastText);
    background: var(--btn-primary-rev-active);
    border: 1px solid var(--btn-primary-rev-active);
    box-shadow: var(--vs-shadow-xs);
}

a.btn--primary-rev .fill--clr-1, .btn--primary-rev .fill--clr-1 {fill: var(--text-primary);}
a.btn--primary-rev:hover .fill--clr-1, .btn--primary-rev:hover .fill--clr-1 {fill: var(--btn-primary-rev-contrastText);}


/* Primary Outlined Button ------- */
/* ------------------------------ */

a.btn--primary-outlined, .btn--primary-outlined{
    color: var(--text-primary);
    background: transparent;
    border: 1px solid var(--btn-primary);
}

a.btn--primary-outlined:hover, .btn--primary-outlined:hover{
    color: var(--text-primary);
    background: var(--btn-primary);
    border: 1px solid var(--btn-primary);
}

a.btn--primary-outlined:focus, .btn--primary-outlined:focus{
    color: var(--text-primary);
    background: var(--btn-primary);
    border: 1px solid var(--btn-primary);
    outline: 3px solid var(--border-focused);
}

a.btn.btn--primary-outlined:active, button.btn.btn--primary-outlined:active{
    color: var(--text-primary);
    background: var(--btn-primary);
    border: 1px solid var(--btn-primary);
}

a.btn--primary-outlined .fill--clr-1, .btn--primary-outlined .fill--clr-1 {fill: var(--text-primary);}

a.btn--primary-outlined:hover .fill--clr-1, .btn--primary-outlined:hover .fill--clr-1 {fill: var(--text-primary-contrastText);}


/* Primary Outlined Reversed Button ------- */
/* --------------------------------------- */

a.btn--primary-outlined-rev, .btn--primary-outlined-rev{
    color: var(--text-primary-contrastText);
    background: transparent;
    border: 1px solid var(--btn-primary-rev);
}

a.btn--primary-outlined-rev:hover, .btn--primary-outlined-rev:hover{
    color: var(--text-primary);
    background: var(--btn-primary-rev);
    border: 1px solid var(--btn-primary-rev);
}

a.btn--primary-outlined-rev:focus, .btn--primary-outlined-rev:focus{
    color: var(--text-primary);
    background: var(--btn-primary-rev);
    border: 1px solid var(--btn-primary-rev);
    outline: 3px solid var(--border-focused);
}

a.btn.btn--primary-outlined-rev:active, button.btn.btn--primary-outlined-rev:active{
    color: var(--text-primary);
    background: var(--btn-primary-rev);
    border: 1px solid var(--btn-primary-rev);
}

a.btn--primary-outlined-rev .fill--clr-1, .btn--primary-outlined-rev .fill--clr-1 {fill: var(--text-primary-contrastText);}
a.btn--primary-outlined-rev:hover .fill--clr-1, .btn--primary-outlined-rev:hover .fill--clr-1 {fill: var(--text-primary);}


/* Primary Text Button ----------- */
/* ------------------------------ */

a.btn--primary-text, .btn--primary-text{
    color: var(--text-primary);
    background: transparent;
    border: 1px solid transparent;
    padding: var(--vs-spacing-4) 0;
}

a.btn--primary-text:hover, .btn--primary-text:hover{
    color: var(--text-primary);
    background: transparent;
    border: 1px solid transparent;
    text-decoration: underline;
}

a.btn--primary-text:focus, .btn--primary-text:focus{
    color: var(--text-primary);
    background: transparent;
    border: 1px solid transparent;
    outline: 3px solid var(--border-focused);
    text-decoration: underline;
}

a.btn.btn--primary-text:active, button.btn.btn--primary-text:active{
    color: var(--text-primary);
    background: transparent;
    border: 1px solid transparent;
    text-decoration: underline;
}

a.btn--primary-text .fill--clr-1, .btn--primary-text .fill--clr-1 {fill: var(--text-primary);}
a.btn--primary-text:hover .fill--clr-1, .btn--primary-text:hover .fill--clr-1 {fill: var(--text-primary);}


/* Primary Outlined Text Button ------ */
/* ---------------------------------- */

a.btn--primary-text, .btn--primary-text{
    color: var(--text-primary);
    background: transparent;
    border: 1px solid transparent;
    padding: var(--vs-spacing-4) 0;
}

a.btn--primary-text:hover, .btn--primary-text:hover{
    color: var(--text-primary);
    background: transparent;
    border: 1px solid transparent;
    text-decoration: underline;
}

a.btn--primary-text:focus, .btn--primary-text:focus{
    color: var(--text-primary);
    background: transparent;
    border: 1px solid transparent;
    outline: 3px solid var(--border-focused);
    text-decoration: underline;
}

a.btn.btn--primary-text:active, button.btn.btn--primary-text:active{
    color: var(--text-primary);
    background: transparent;
    border: 1px solid transparent;
    text-decoration: underline;
}

a.btn--primary-text .fill--clr-1, .btn--primary-text .fill--clr-1 {fill: var(--text-primary);}
a.btn--primary-text:hover .fill--clr-1, .btn--primary-text:hover .fill--clr-1 {fill: var(--text-primary);}


/* Secondary Button -------------- */
/* ------------------------------ */

a.btn--secondary, .btn--secondary {
    color: var(--text-secondary-contrastText);
    background: var(--btn-secondary);
    border: 1px solid var(--btn-secondary);
}

a.btn--secondary:hover, .btn--secondary:hover {
    color: var(--text-secondary);
    background: var(--btn-secondary-hover);
    border: 1px solid var(--btn-secondary-hover);
    box-shadow: var(--vs-shadow-xs);
}

a.btn--secondary:focus, .btn--secondary:focus {
    color: var(--text-secondary);
    background: var(--btn-secondary-hover);
    border: 1px solid var(--btn-secondary-hover);
    outline: 3px solid var(--border-focused);
    box-shadow: var(--vs-shadow-xs);
}

a.btn.btn--secondary:active, button.btn.btn--secondary:active {
    color: var(--text-secondary);
    background: var(--btn-secondary-active);
    border: 1px solid var(--btn-secondary-active);
    box-shadow: var(--vs-shadow-xs);
}

a.btn--secondary .fill--clr-1, .btn--secondary .fill--clr-1 {
    fill: var(--text-secondary);
}

a.btn--secondary:hover .fill--clr-1, .btn--secondary:hover .fill--clr-1 {
    fill: var(--text-secondary);
}


/* Secondary Outlined Button ----- */
/* ------------------------------ */

a.btn--secondary-outlined, .btn--secondary-outlined {
    color: var(--text-secondary);
    background: transparent;
    border: 1px solid var(--btn-secondary);
}

a.btn--secondary-outlined:hover, .btn--secondary-outlined:hover {
    color: var(--text-secondary);
    background: var(--btn-secondary-hover);
    border: 1px solid var(--btn-secondary-hover);
}

a.btn--secondary-outlined:focus, .btn--secondary-outlined:focus {
    color: var(--text-secondary);
    background: var(--btn-secondary-hover);
    border: 1px solid var(--btn-secondary-hover);
    outline: 3px solid var(--border-focused);
}

a.btn.btn--secondary-outlined:active, button.btn.btn--secondary-outlined:active {
    color: var(--text-secondary);
    background: var(--btn-secondary-active);
    border: 1px solid var(--btn-secondary-active);
}

a.btn--secondary-outlined .fill--clr-1, .btn--secondary-outlined .fill--clr-1 {fill: var(--text-secondary);}
a.btn--secondary-outlined:hover .fill--clr-1, .btn--secondary-outlined:hover .fill--clr-1 {fill: var(--text-secondary);}


/* Secondary Text Button --------- */
/* ------------------------------ */

a.btn--secondary-text, .btn--secondary-text {
    color: var(--text-secondary);
    background: transparent;
    border: 1px solid transparent;
    padding: inherit 0;
}

a.btn--secondary-text:hover, .btn--secondary-text:hover {
    color: var(--text-secondary-hover);
    background: transparent;
    border: 1px solid transparent;
}

a.btn--secondary-text:focus, .btn--secondary-text:focus {
    color: var(--text-secondary-hover);
    background: transparent;
    border: 1px solid transparent;
    outline: 3px solid var(--border-focused);
}

a.btn.btn--secondary-text:active, button.btn.btn--secondary-text:active {
    color: var(--text-secondary-active);
    background: var(--btn-secondary-active);
    border: 1px solid var(--btn-secondary-active);
}

a.btn--secondary-text .fill--clr-1, .btn--secondary-text .fill--clr-1 {fill: var(--text-secondary);}
a.btn--secondary-text:hover .fill--clr-1, .btn--secondary-text:hover .fill--clr-1 {fill: var(--text-secondary-hover);} 


/* Button Links --------- */
/* ------------------------------ */
a.btn--link, .btn--link {
    color: var(--text-primary);
    background-color: transparent;
    border: 1px solid transparent;
}

a.btn--link:hover, .btn--link:hover {
    text-decoration: underline;
    color: var(--text-primary-hover);
    background-color: transparent;
    border: 1px solid transparent;
    box-shadow: 0 0 0 transparent;
}

a.btn--link .fill--clr-1, .btn--link .fill--clr-1 {
    fill: var(--text-secondary);
}

a.btn--link:hover .fill--clr-1, .btn--link:hover .fill--clr-1 {
    fill: var(--text-secondary-hover);
}


/* Button Size Variants ---------------- */
/* (Must come after other variants ---- */

a.btn--xs, .btn--xs{
    font-size: var(--vs-fs-3);
    padding: 0 var(--vs-spacing-4);
}

.btn--xs svg, .btn--xs .icon{
    max-width: var(--vs-spacing-3); max-height: var(--vs-spacing-3);
}

a.btn--sm, .btn--sm{
    font-size: var(--vs-fs-3);
    padding: var(--vs-spacing-2) var(--vs-spacing-4);
}

.btn--sm svg, .btn--sm .icon{
    max-width: var(--vs-spacing-5); max-height: var(--vs-spacing-5);
}

a.btn--lg, .btn--lg{
    font-size: var(--vs-fs-5);
    padding: var(--vs-spacing-5) var(--vs-spacing-6);
    column-gap: var(--vs-padding-smedium);
}

.btn--lg svg, .btn--lg .icon{
    max-width: var(--vs-spacing-3); max-height: var(--vs-spacing-3);
}

a.btn--icon-only, .btn--icon-only{
    padding: var(--vs-spacing-4);
}

a.btn--icon-only.btn--xs, .btn--icon-only.btn--xs{
    padding: 0;
}

a.btn--icon-only.btn--sm, .btn--icon-only.btn--sm{
    padding: var(--vs-spacing-2);
}

a.btn--icon-only.btn--lg, .btn--icon-only.btn--lg{
    padding: var(--vs-spacing-5);
}



/* Button Row -------------------- */
/* ------------------------------ */

.btn-row{
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: var(--vs-gutter-xs);
    flex-wrap: wrap;
}



/* toc Styles : START */
/* TOC Page Styles */

main .pub-toc-page {
    background-color: var(--grey-bg-clr);
    padding: 2rem 0;
}

.pub-toc-container{
    padding: 2rem;
    background-color: white;
    border: 1px solid #E6E6E6;
}

.toc-header-grid{
    display: grid;
    grid-template-columns: 220px 1fr auto;
    align-items: center;
    grid-gap: 1.5rem;
    margin-bottom: 2rem;
}

.toc-cover{
    position: relative;
    background-color: var(--dark);
    display: block;
}

.toc-cover:hover{
    transform: scale(1.01);
    background-color: var(--dark);
    transition: .2s ease-in-out;
}

.toc-cover p{
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
    opacity: 0;
    transition: .2s ease-in-out;
}

.toc-cover:hover p {
    opacity: 1;
    z-index: 2;
    background-color: white;
    border: none;
    color: #5B5B5B;
    transition: .05s .2s ease-in-out;
}

.pub-toc-container .toc-header-grid .toc-cover:hover p:hover {
    background-color: #5B5B5B;
    color: white;
    transition: .2s ease-in-out;
}

.toc-cover img{
    width: 100%;
    max-width: 220px;
    border: 1px solid #E6E6E6;
    box-shadow: 0 0 8px rgba(0, 0, 0, 0.08);
    z-index: 1;
    transition: .2s ease-in-out;
}

.toc-cover:hover img{
    opacity: .5;
    transition: .2s ease-in-out;
}

.pub-toc-container .toc-header-grid .btn-small:hover {
    color: #5B5B5B;
}

.toc-header-grid > div:last-child{
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    grid-gap: .5rem;
    align-items: center;
}

.toc-header-grid > div:last-child > a:first-child::before, .toc-header-grid > div:last-child > a:last-child::after, .toc-bottom-btn-grid > a.btn:first-child::before, .toc-bottom-btn-grid > a.btn:last-child::after{
    font-family: 'Material Icons';
    display: inline-block;
    opacity: .65;
    position: relative;
    top: 2.5px;
    transition: .2s ease-in-out;
}

.toc-header-grid > div:last-child > a:first-child::before, .toc-bottom-btn-grid > a.btn:first-child::before{
    content: "\e5e0";
    padding-right: 2px;
}

.toc-header-grid > div:last-child > a:last-child::after, .toc-bottom-btn-grid > a.btn:last-child::after{
    content: "\e5e1";
    padding-left: 2px;
}

@media (max-width: 950px) {
    .toc-header-grid{
        grid-template-columns: 220px 1fr;
        grid-gap: 1.5rem;
    }
    
    .toc-header-grid > div:last-child {
      grid-gap: 1.5rem;
      grid-column: 1/3;
    }
}

@media (max-width: 700px) {
    .toc-header-grid{
        grid-template-columns: 1fr;
        justify-items: center;
    }
    
    .toc-info{
        text-align: center;
    }
    
    .toc-header-grid > div:last-child {
        grid-gap: .5rem;
        grid-column: 1/2;
    }
}


.toc-section{
    margin-bottom: 3rem;
}

.toc-section h1.section-title {
    font-size: 1.875rem;
    border-top: 4px solid #CCC;
}

.toc-section .card-copy{
    padding: 0 0 1rem 0;
    margin: 0 0 1rem 0;
    border-bottom: 1px solid #B3B3B3;
}

.toc-section .card-copy:last-child{
    padding: 0 0 1rem 0;
    margin: 0 0 1rem 0;
    border-bottom: none;
}

.toc-section .card-copy .author-name{
    margin: 0 0 .5rem 0;
    font-weight: 500;
}

.toc-section .card-copy .toc-item-desc {
    font-size: .9rem;
    color: #5B5B5B;
    font-weight: 200;
    margin-bottom: 0;
}

.toc-bottom-btn-grid{
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-gap: 1.5rem;
}

.toc-bottom-btn-grid .btn:first-child{
    justify-self: flex-start;
    min-width: 145px;
    padding-top: .15rem;
}

.toc-bottom-btn-grid .btn:last-child{
    justify-self: flex-end;
    min-width: 145px;
    padding-top: .15rem;
}


.recent-issues-grid{
    display: grid;
    grid-template-columns: 1fr 1fr 1fr 1fr;
    grid-gap: 1.5rem;
}

.recent-issues-grid img{
    width: 100%;
}

@media (max-width: 700px) {
    .recent-issues-grid{
        grid-template-columns: 1fr 1fr;
    }
}

/* TOC Styles : END */


/* video Styles : START */
@charset "UTF-8";
/* Video Page CSS */

/*
.videopage .article-header{
    border-bottom: 0;
}
*/

.video-embed-container{
    width: 100%; 
    aspect-ratio: 16 / 9;
    line-height: 0;
    box-shadow: 0 0 8px 0 rgba(0,0,0,0.15);
}

.video-embed-container iframe{
    width: 100%; 
    aspect-ratio: 16 / 9;
}

#accordionVidSeries{
    margin-bottom: 1.5rem;
}

#accordionVidSeries .accordion-header{
    
}

#accordionVidSeries h2 .accordion-button{
    font-family: var(--body-font);
    font-weight: bold;
    text-transform: uppercase;
    letter-spacing: .02rem;
    transition: all .2s ease-in-out;
}

.pv-page #accordionVidSeries h2:hover .accordion-button{
    color: var(--pv-clr);
    transition: all .2s ease-in-out;
}

#accordionVidSeries .accordion-button{
    padding: 0 0 1rem 0;
    border-radius: 0;
    border-top: 0;
    border-bottom: 2px solid transparent;
    transition: all .2s ease-in-out;
}

#accordionVidSeries .accordion-button:hover{
    transition: all .2s ease-in-out;
}

/*
#accordionVidSeries .accordion-button.collapsed{
    border-bottom: 2px solid rgba(0,0,0,0.125);
}
*/

#accordionVidSeries .accordion-button::after {
    font-family: 'Material Icons';
    content: "\e145";
    font-size: 1.15rem;
    width: auto;
    height: auto;
    background-image: none;
    transition: all .2 ease-in-out;
}

#accordionVidSeries .accordion-button:not(.collapsed) {
    color: inherit;
    background-color: inherit;
    box-shadow: 0 0 0 0;
    font-weight: bold;
}

.pv-page #accordionVidSeries .accordion-button:not(.collapsed) {
    color: var(--pv-clr);
}



#accordionVidSeries .accordion-button:not(.collapsed)::after {
    transform: rotate(45deg);
    transition: all .2 ease-in-out;
}

#accordionVidSeries .accordion-button:focus {
    z-index: 3;
/*    border-color: transparent;*/
    outline: 0;
    box-shadow: 0 0 0 0;
}

#accordionVidSeries .accordion-item{
    border-radius: 0;
    border: 0;
}

.vid-series-grid {
    margin-bottom: 1.5rem;
}

.accordion-body.vid-series-grid {
    padding: 0;
/*
    padding: 0 0 1.5rem 0;
    border-bottom: 2px solid rgba(0,0,0,0.125);
*/
}

.vid-series-grid{
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    grid-gap: 1.5rem;
}

.vid-series-grid .thumb-image img {
    width: 100%;
    height: 100%;
    aspect-ratio: 16 / 9;
    object-fit: cover;
    object-position: center center;
}


@media (max-width: 800px) {
    .vid-series-grid{
        grid-template-columns: 1fr 1fr;
    }
}

@media (max-width: 600px) {
    .vid-series-grid{
        grid-template-columns: 1fr;
    }
}



.embed-responsive {
  position:relative;
  display:block;
  height:0;
  padding:0;
  overflow:hidden
}
.embed-responsive .embed-responsive-item,
.embed-responsive embed,
.embed-responsive iframe,
.embed-responsive object,
.embed-responsive video {
  position:absolute;
  top:0;
  left:0;
  bottom:0;
  height:100%;
  width:100%;
  border:0
}
.embed-responsive-16by9 {
  padding-bottom:56.25%;
}
.embed-responsive-4by3 {
  padding-bottom:75%
}

/* video Styles : END */


/* AI DERIVATIVES : START */

/* AI Derivative - Takeaways Styles : START ------ */
/* ---------------------------------------------- */
/* --------------------------------------------- */
/* -------------------------------------- (°_°) */
.panel-takeaways .btn {
    white-space: normal;
    text-align: left;
    text-wrap: pretty;
}
.number-of-takeaways{
    font-weight: var(--vs-fw-bold);
}

.panel-takeaways ul {
    display: grid;
    grid-gap: var(--vs-gutter-sm);
}

.panel-takeaways ul .card{
    display: grid;
    grid-template-columns: var(--vs-fs-h4-display) 1fr;
    grid-template-rows: auto auto;
    align-items: center;
    padding: var(--vs-padding-lg);
    box-shadow: 0 0 0 transparent;
    border: 1px solid var(--vs-primary-grey-10);
}

.panel-takeaways ul .card .display{
    grid-row: 1/3;
    grid-column: 1/2;
    margin: 0;
    line-height: 0.65;
    font-size: var(--vs-fs-h1-display);
    color: var(--vs-primary-tan-60);
}

.panel-takeaways ul .card h5.header{
    grid-row: 1/2;
    grid-column: 2/3;
    margin: 0;
}
.panel-takeaways ul .card p{
    grid-row: 1/3;
    grid-column: 2/3;
    margin-bottom: 0;
}



/* AI Derivative - Takeaways Styles : END ------ */



/* AI Derivative - Listen Tab Player Styles : START */
/* === Player Container === */
#listen .audio-player {
    width: 100%;
    display: flex;
    align-items: center;
    gap: var(--vs-gutter-sm);
    padding: var(--vs-padding-sm) var(--vs-padding-md) var(--vs-padding-sm) var(--vs-padding-sm);
    background: var(--vs-bg-grey);
    border: 1px solid var(--border-regular);
    border-radius: var(--vs-radius-md);
}

#listen .audio-btns {
    display: flex;
    align-items: center;
    gap: var(--vs-gutter-xs);
}

#listen .audio-btn {
    background: none;
    border: 0;
    padding: 0;
    cursor: pointer;
    width: 2.5rem;           /* consistent clickable area */
    height: 2.5rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    transition: var(--vs-anim-fast);
    line-height: 0;    
}

#listen .audio-btn svg {
    display: block;
    width: 1.375rem;
    height: 1.375rem;
    fill: var(--text-primary);
}

#listen .audio-btn:hover svg {
    fill: var(--text-primary-hover);
}

#listen .audio-btn:disabled {
    opacity: var(--disabled);
    cursor: not-allowed;
}

/* === Waveform === */
#listen .audio-wave {
    flex: 1 1 auto;
    min-width: 160px;
}

#listen #waveform {
    width: 100%;
    height: 44px;
}

/* === Time === */
#listen .audio-time {
    font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
    font-size: var(--vs-fs-3);
    color: var(--text-tertiary);
    white-space: nowrap;
}

/* === Volume Popover === */
#listen .volume-wrapper {
    position: relative;
    display: flex;
    align-items: center;
}

#listen .volume-popover {
    position: absolute;
    top: calc(100% + var(--vs-spacing-2));
    left: 50%;
    transform: translateX(-50%);
    padding: var(--vs-padding-xs) var(--vs-padding-sm);
    background: var(--background-primary);
    border: 1px solid var(--border-regular);
    border-radius: var(--vs-radius-sm);
    box-shadow: var(--vs-shadow-sm);
    z-index: 10;
}

#listen .volume-popover[hidden] {
    display: none;
}

#listen .volume__range {
    width: 110px;
    height: 6px;
    appearance: none;
    background: var(--border-regular);
    border-radius: var(--vs-radius-round);
    outline: none;
}

#listen .volume__range:focus-visible {
    box-shadow: 0 0 0 2px var(--btn-focusedBorder);
}

#listen .volume__range::-webkit-slider-thumb {
    appearance: none;
    width: 14px;
    height: 14px;
    background: var(--vs-primary-blue-60);
    border-radius: var(--vs-radius-round);
    border: 2px solid var(--background-primary);
    cursor: pointer;
}

#listen .volume__range::-moz-range-thumb {
    width: 14px;
    height: 14px;
    background: var(--vs-primary-blue-60);
    border-radius: var(--vs-radius-round);
    border: 2px solid var(--background-primary);
    cursor: pointer;
}

/* === Screen-reader only === */
#listen .sr-only {
    position: absolute;
    width: 1px;
    height: 1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
}
/* AI Derivative - Listen Tab Player Styles : END */


/* AI Derivative - Author Profile Modal Styles : START ------ */
/* ---------------------------------------------- */
/* --------------------------------------------- */
/* -------------------------------------- (°_°) */
.author-profile-link {
    font-weight: 600;
}

.author-profile-modal .modal-dialog {
    max-width: 1080px;
}

.author-profile-modal .modal-content {
    padding: var(--vs-padding-xl);
    border: 0;
    border-radius: var(--vs-radius-lg);
    box-shadow: var(--vs-shadow-lg);
}

.author-profile-modal .modal-body {
    position: relative;
    padding: 0;
}

.author-profile-modal__close {
    position: absolute;
    top: 0;
    right: 0;
    z-index: 2;
}

.author-profile-modal__layout {
    display: grid;
    gap: var(--vs-gutter-lg);
}

.author-profile-modal__header {
    display: grid;
    grid-template-columns: 160px minmax(0, 1fr);
    gap: var(--vs-gutter-md);
    align-items: start;
}

.author-profile-modal__avatar {
    width: 160px;
    height: 160px;
    border-radius: 999px;
    object-fit: cover;
    border: 1px solid var(--border-regular);
}

.author-profile-modal__title-row {
    display: flex;
    flex-wrap: wrap;
    gap: 0.35rem;
    align-items: baseline;
    margin-bottom: var(--vs-spacing-2);
}

.author-profile-modal__title-row h2,
.author-profile-modal__title-row p {
    margin: 0;
}

.author-profile-modal__role {
    margin-bottom: var(--vs-spacing-5);
    color: var(--text-secondary);
}

.author-profile-modal__meta {
    display: grid;
    gap: var(--vs-spacing-2);
    margin-bottom: var(--vs-spacing-6);
}

.author-profile-modal__meta-row {
    display: flex;
    flex-wrap: wrap;
    gap: var(--vs-spacing-2);
}

.author-profile-modal__meta-row strong {
    font-weight: 600;
}

.author-profile-modal__specialties {
    display: inline-flex;
    flex-wrap: wrap;
    align-items: center;
    gap: var(--vs-spacing-2);
}

.author-profile-modal__specialties span + span::before {
    content: "•";
    margin-right: var(--vs-spacing-2);
    color: var(--text-tertiary);
}

.author-profile-modal__actions {
    display: flex;
    flex-wrap: wrap;
    gap: var(--vs-gutter-sm);
}

.author-profile-modal__rule {
    margin: 0;
}

.author-profile-modal__section-head {
    margin-bottom: var(--vs-spacing-5);
}

.author-profile-modal__list {
    display: grid;
    gap: var(--vs-gutter-sm);
}

.author-profile-modal__item {
    display: flex;
    flex-direction: row;
    gap: var(--vs-gutter-md);
    align-items: center;
    padding: var(--vs-padding-smedium);
    background: var(--vs-bg-grey);
    border-radius: var(--vs-radius-md);
    box-shadow: 0 0 6px rgba(23, 52, 64, 0.13);
    text-decoration: none;
    color: inherit;
}

.author-profile-modal__item:hover {
    text-decoration: none;
}

.author-profile-modal__item:focus-visible {
    outline: 2px solid var(--btn-focusedBorder);
    outline-offset: 4px;
}

.author-profile-modal__item > div {
    flex: 1 1 auto;
    min-width: 0;
}

.author-profile-modal__item-label,
.author-profile-modal__item-meta {
    margin: 0;
}

.author-profile-modal__item-label {
    color: var(--text-tertiary);
}

.author-profile-modal__item-title {
    margin: 0.25rem 0 0.5rem;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    transition: var(--vs-anim-fast);
}

.author-profile-modal__item:hover .author-profile-modal__item-title,
.author-profile-modal__item:focus-visible .author-profile-modal__item-title {
    color: var(--text-primary-hover);
}

.author-profile-modal__item-meta {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: var(--vs-spacing-2);
    color: var(--text-tertiary);
}

.author-profile-modal__dot,
.author-profile-modal__item-dot {
    width: 4px;
    height: 4px;
    border-radius: 999px;
    background: currentColor;
    opacity: 0.55;
}

.author-profile-modal__time {
    display: inline-flex;
    align-items: center;
    gap: var(--vs-spacing-1);
    padding: 0.1rem 0.45rem;
    border-radius: 999px;
    background: var(--background-primary);
    border: 1px solid var(--border-regular);
    color: var(--text-secondary);
}

.author-profile-modal__thumb {
    flex: 0 0 114px;
    width: 116px;
    height: 64px;
    border-radius: var(--vs-radius-sm);
    object-fit: cover;
}

.author-profile-modal__show-all {
    margin-top: var(--vs-spacing-3);
}

@media (max-width: 767px) {
    .author-profile-modal .modal-content {
        padding: var(--vs-padding-md);
    }

    .author-profile-modal__header {
        grid-template-columns: 1fr;
    }

    .author-profile-modal__avatar {
        width: 96px;
        height: 96px;
    }

    .author-profile-modal__item {
        flex-direction: column;
        align-items: flex-start;
    }

    .author-profile-modal__thumb {
        width: 100%;
        height: auto;
        aspect-ratio: 114 / 64;
    }
}

/* AI Derivative - Author Profile Modal Styles : END ------ */
/* ---------------------------------------------- */
/* --------------------------------------------- */
/* -------------------------------------- (°_°) */




/* AI Derivative - Author Profile Page Styles : START */

.page-layout--profile {
    display: grid;
    grid-template-areas: "profile aside";
    grid-template-columns: 1fr 18.875rem;
    align-items: start;
    gap: var(--vs-gutter-xl) var(--vs-gutter-md);
    padding-top: var(--vs-padding-md);
    padding-bottom: var(--vs-padding-xxl);
}

.profile-page {
    grid-area: profile;
    display: grid;
    gap: var(--vs-gutter-lg);
}

.card.profile-page__hero,
.card.profile-page__panel {
    padding: var(--vs-padding-lg);
}

.profile-page__hero-header {
    display: grid;
    grid-template-columns: 160px minmax(0, 1fr);
    gap: var(--vs-gutter-md);
    align-items: start;
}

.profile-page__avatar {
    width: 160px;
    height: 160px;
    border-radius: 999px;
    object-fit: cover;
    border: 1px solid var(--border-regular);
}

.profile-page__hero-copy {
    display: grid;
    gap: var(--vs-spacing-4);
}

.profile-page__title-row {
    display: flex;
    flex-wrap: wrap;
    gap: var(--vs-spacing-2);
    align-items: baseline;
}

/* .profile-page__title-row h1,
.profile-page__title-row p,
.profile-page__section h4,
.profile-page__section h6 {
    margin: 0;
} */

.profile-page__title-row p,
.profile-page__role,
.profile-page__item p,
.profile-page__inline-list {
    color: var(--text-secondary);
}

.profile-page__actions {
    display: flex;
    flex-wrap: wrap;
    gap: var(--vs-gutter-sm);
}

.profile-page__tabs {
    display: flex;
    align-items: center;
    gap: var(--vs-padding-md);
    border-bottom: 1px solid var(--border-regular);
}

.profile-page__tab {
    display: inline-flex;
    align-items: center;
    padding: var(--vs-padding-smedium) var(--vs-spacing-2);
    border: 0px solid transparent;
    border-top: 1px solid transparent;
    border-bottom: 2px solid transparent;
    color: var(--text-secondary);
    font-size: var(--vs-fs-5);
    font-weight: var(--vs-fw-medium);
    text-decoration: none;
    transition: var(--vs-anim-fast);
    border-style: inset;
}

.profile-page__tab:hover {
    color: var(--text-primary-hover);
    text-decoration: none;
    border-bottom: 2px solid var(--border-subtleBlue);
    transition: var(--vs-anim-fast);
}

.profile-page__tab.is-active {
    border-bottom: 2px solid var(--border-emphasis);
    color: var(--text-primary-hover);
}

.profile-page__tab.is-active:hover {
    border-top: 0px solid transparent;
    border-bottom: 3px solid var(--border-emphasis);
    transition: var(--vs-anim-fast);
}

.profile-page__hero .avatar,
.profile-page__item .avatar{
    width: 100%;
}

.page-layout--profile .area--aside{
    display: grid;
}

.profile-page__item {
    display: grid;
    grid-template-columns: 1fr;
    gap: var(--vs-gutter-sm);
    align-items: start;
}

.profile-page__item:has(.avatar){
    grid-template-columns: 18px minmax(0, 1fr);
}

.profile-page__inline-list--bulleted {
    display: flex;
    flex-wrap: wrap;
    gap: 0.25rem 1rem;
    margin: 0;
    padding: 0;
    list-style: none;
    overflow: hidden;
    color: var(--text-secondary);
}

.profile-page__inline-list--bulleted li {
    display: inline-flex;
    align-items: center;
    position: relative;
    padding-left: calc(1rem + 8px);
    left: calc(-1rem - 8px);
}

.profile-page__inline-list--bulleted li::before {
    content: "•";
    position: absolute;
    font-size: 1.5rem;
    top: 50%;
    aspect-ratio: 1 / 1;
    color: var(--vs-primary-grey-30);
    transform: translateY(-51%);
    left: 0;
}

@media (max-width: 767px) {
    .profile-page__hero .avatar--profile{
        width: 100px;
    }
}

.profile-page__panel hr {
    margin: var(--vs-padding-lg) 0;
}

.profile-page__section {
    display: grid;
    gap: var(--vs-spacing-4);
    border-bottom: 1px solid var(--divider);
    width: 100%;
    padding-bottom: var(--vs-gutter-lg);
    margin-bottom: var(--vs-gutter-lg);
}

.profile-page__stack {
    display: grid;
    gap: var(--vs-padding-md);
}

.profile-page__stack--compact {
    gap: var(--vs-padding-sm);
}

.profile-page__item {
    display: grid;
    grid-template-columns: 18px minmax(0, 1fr);
    gap: var(--vs-gutter-sm);
    align-items: start;
}

.profile-page__item-icon {
    width: 18px;
    height: 18px;
    border-radius: var(--vs-radius-xs);
    background: var(--border-regular);
    margin-top: 0.25rem;
}

.profile-page__item h6 + p {
    margin-top: 0.15rem;
}

.profile-page__inline-list {
    display: inline-flex;
    flex-wrap: wrap;
    gap: var(--vs-spacing-2);
    align-items: center;
}

.profile-page__bottom-ad {
    padding-bottom: var(--vs-padding-xl);
}

@media (max-width: 970px) {
    .page-layout--profile {
        grid-template-areas:
            "profile"
            "aside";
        grid-template-columns: 1fr;
    }
}

@media (max-width: 966px) {
    .page-layout--profile .aside-grouping--1, .page-layout--profile .aside-grouping--2, .page-layout--profile .aside-grouping--2 > .position-sticky {
        display: grid;
        justify-content: center;
    }
}

@media (max-width: 767px) {
    .profile-page__hero-header {
        grid-template-columns: 1fr;
    }

    .profile-page__avatar {
        width: 96px;
        height: 96px;
    }

    .profile-page__hero,
    .profile-page__panel {
        padding: var(--vs-padding-md);
    }

    .profile-page__tabs {
        gap: var(--vs-spacing-4);
        overflow-x: auto;
    }
}

/* AI Derivative - Author Profile Pages Styles : END */



/* AI Derivative - Thought Leaders : START */
.asco-tabs--article{
	margin: -8px calc(var(--vs-gutter-lg) * -1);
	padding: 8px var(--vs-gutter-lg);
	scroll-padding-inline: var(--vs-gutter-lg);
	width: calc(100% + (2 * var(--vs-gutter-lg)));
	--fade-l: var(--vs-gutter-lg, 8px);
	--fade-r: var(--vs-gutter-lg, 8px);
	-webkit-mask-image: linear-gradient(to right, transparent 0, #000 var(--fade-l), #000 calc(100% - var(--fade-r)), transparent 100%);
	-webkit-mask-repeat: no-repeat;
	-webkit-mask-size: 100% 100%;
	mask-image: linear-gradient(to right, transparent 0, #000 var(--fade-l), #000 calc(100% - var(--fade-r)), transparent 100%);
	mask-repeat: no-repeat;
	mask-size: 100% 100%;
	mask-mode: match-source;
	overflow: scroll;
}

#top_thought_leaders .thought-leaders {
	display: grid;
	gap: var(--vs-gutter-md);
}

#top_thought_leaders .thought-leaders__intro {
	max-width: 56ch;
}

#top_thought_leaders .thought-leaders__intro h6 {
	margin-bottom: var(--vs-spacing-1);
}

#top_thought_leaders .thought-leaders__intro-copy {
	display: flex;
	flex-wrap: wrap;
	gap: 0 var(--vs-spacing-2);
	align-items: baseline;
}

#top_thought_leaders .thought-leaders__intro-copy p,
#top_thought_leaders .thought-leaders__intro-copy a {
	margin: 0;
	font-size: var(--vs-fs-2);
	line-height: 1.4;
}

#top_thought_leaders .thought-leaders__intro-copy a {
	color: var(--vs-primary-blue-60);
	text-decoration: underline;
}

#top_thought_leaders .thought-leaders__list {
	display: grid;
	gap: var(--vs-gutter-md);
	padding-top: var(--vs-padding-md);
	margin: 0;
	list-style: none;
	border-top: 1px solid var(--border-regular);
}

#top_thought_leaders .thought-leaders__item {
	list-style: none;
}

/* Frontend behavior note: hover/focus color and avatar motion are CSS-only; backend only needs to output the trigger markup and matching modal ids. */
#top_thought_leaders .thought-leaders__trigger {
	display: grid;
	grid-template-columns: 2.25rem minmax(0, 1fr);
	gap: var(--vs-spacing-3);
	align-items: center;
	width: 100%;
	padding: 0;
	border: 0;
	background: transparent;
	text-align: left;
	cursor: pointer;
}

#top_thought_leaders .thought-leaders__trigger:has(.avatar){
	grid-template-columns: 2.25rem 40px minmax(0, 1fr);
}

#top_thought_leaders .thought-leaders__trigger:focus-visible {
	outline: 2px solid var(--btn-focusedBorder);
	outline-offset: 4px;
	border-radius: var(--vs-radius-sm);
}

#top_thought_leaders .thought-leaders__rank {
	margin: 0;
	font-size: var(--vs-fs-3);
	font-weight: var(--vs-fw-bold);
	line-height: 1;
	justify-self: start;
}

#top_thought_leaders .avatar--thought-leaders {
	width: 40px;
	height: 40px;
	overflow: hidden;
	border: 1px solid var(--border-regular);
	border-radius: 50%;
	transition: var(--vs-anim-fast);
}

#top_thought_leaders .thought-leaders__trigger:hover .avatar--thought-leaders,
#top_thought_leaders .thought-leaders__trigger:focus-visible .avatar--thought-leaders {
	transform: scale(1.05);
	transition: var(--vs-anim-fast);
}

#top_thought_leaders .avatar--thought-leaders img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

#top_thought_leaders .thought-leaders__content {
	min-width: 0;
}

#top_thought_leaders .thought-leaders__name {
	margin: 0 0 2px;
	font-size: var(--vs-fs-2);
	line-height: 1.3;
	transition: var(--vs-anim-fast);
}

#top_thought_leaders .thought-leaders__trigger:hover .thought-leaders__name,
#top_thought_leaders .thought-leaders__trigger:focus-visible .thought-leaders__name {
	color: var(--text-primary-hover);
	transition: var(--vs-anim-fast);
}

#top_thought_leaders .thought-leaders__meta {
	display: flex;
	flex-wrap: wrap;
	gap: 0.2rem 0.45rem;
	align-items: center;
}

#top_thought_leaders .thought-leaders__meta p,
#top_thought_leaders .thought-leaders__meta span {
	margin: 0;
	font-size: 11px;
	line-height: 1.35;
	color: var(--text-secondary);
}

#top_thought_leaders .thought-leaders__meta span {
	color: var(--text-tertiary);
}

.thought-leader-modal .modal-dialog {
	max-width: 1024px;
}

.thought-leader-modal .modal-content {
	border: 0;
	border-radius: var(--vs-radius-md);
	box-shadow: 0 0 6px rgba(23, 52, 64, 0.13);
}

.thought-leader-modal .modal-body {
	position: relative;
	padding: var(--vs-spacing-12);
}

.thought-leader-modal__close {
	position: absolute;
	top: var(--vs-spacing-6);
	right: var(--vs-spacing-6);
	z-index: 2;
}

.thought-leader-modal__profile {
	display: grid;
	grid-template-columns: 160px minmax(0, 1fr);
	gap: var(--vs-spacing-6);
	padding-bottom: var(--vs-spacing-8);
	margin-bottom: var(--vs-spacing-8);
	border-bottom: 1px solid var(--border-regular);
}

.avatar--thought-leaders-modal {
	width: 160px;
	height: 160px;
	overflow: hidden;
	border: 1px solid var(--border-regular);
	border-radius: 50%;
}

.avatar--thought-leaders-modal img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.thought-leader-modal__title-row {
	display: flex;
	flex-wrap: wrap;
	gap: 0 var(--vs-spacing-2);
	align-items: baseline;
	margin-bottom: var(--vs-spacing-1);
}

.thought-leader-modal__title-row h1,
.thought-leader-modal__title-row .xl,
.thought-leader-modal__role,
.thought-leader-modal__bio,
.thought-leader-modal__label-row p,
.thought-leader-modal__show-all {
	margin: 0;
}

.thought-leader-modal__role.xl {
	margin-bottom: var(--vs-spacing-4);
}

.thought-leader-modal__details {
	display: grid;
	gap: var(--vs-spacing-1);
	margin-bottom: var(--vs-spacing-4);
}

.thought-leader-modal__label-row {
	display: flex;
	flex-wrap: wrap;
	gap: 0 var(--vs-spacing-2);
	align-items: baseline;
}

.thought-leader-modal__actions {
	display: flex;
	flex-wrap: wrap;
	gap: var(--vs-spacing-4);
	margin-top: var(--vs-spacing-5);
}

.thought-leader-modal__contributions {
	display: grid;
	gap: var(--vs-gutter-smedium);
}

.thought-leader-modal__contributions h6 {
	margin-bottom: 0;
}

.thought-leader-modal__contribution {
	display: flex;
	gap: var(--vs-gutter-md);
	align-items: center;
	padding: var(--vs-padding-smedium);
	background: var(--background-secondary);
	border-radius: var(--vs-radius-md);
	box-shadow: 0 0 6px rgba(23, 52, 64, 0.13);
	text-decoration: none;
	color: inherit;
}

.thought-leader-modal__contribution:hover {
	text-decoration: none;
}

.thought-leader-modal__contribution:focus-visible {
	outline: 2px solid var(--btn-focusedBorder);
	outline-offset: 4px;
}

.thought-leader-modal__contribution-copy {
	flex: 1 1 auto;
	min-width: 0;
}

.thought-leader-modal__contribution-copy label,
.thought-leader-modal__contribution-copy h5,
.thought-leader-modal__contribution-copy p,
.thought-leader-modal__contribution-meta {
	margin: 0;
}

.thought-leader-modal__contribution-title {
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
	transition: var(--vs-anim-fast);
}

.thought-leader-modal__contribution:hover .thought-leader-modal__contribution-title,
.thought-leader-modal__contribution:focus-visible .thought-leader-modal__contribution-title {
	color: var(--text-primary-hover);
	transition: var(--vs-anim-fast);
}

.thought-leader-modal__contribution-meta {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 0.45rem 0.75rem;
	margin-top: var(--vs-spacing-1);
}

.thought-leader-modal__contribution-meta p {
	font-size: var(--vs-fs-2);
	color: var(--text-secondary);
}

.thought-leader-modal__contribution-thumb {
	flex: 0 0 114px;
	width: 114px;
	height: 64px;
	border-radius: var(--vs-radius-sm);
	overflow: hidden;
}

.thought-leader-modal__contribution-thumb img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.thought-leader-modal__show-all {
	display: inline-flex;
	align-items: center;
	gap: var(--vs-spacing-2);
	color: var(--text-primary);
	text-decoration: none;
}

@media (max-width: 575px) {
	#top_thought_leaders .thought-leaders__trigger {
		grid-template-columns: 2rem minmax(0, 1fr);
		gap: var(--vs-spacing-2);
	}

	#top_thought_leaders .thought-leaders__trigger:has(.avatar){
		grid-template-columns: 2rem 40px minmax(0, 1fr);
	}

	#top_thought_leaders .thought-leaders__intro-copy {
		display: block;
	}

	.thought-leader-modal .modal-body {
		padding: var(--vs-spacing-8);
	}

	.thought-leader-modal__profile {
		grid-template-columns: 1fr;
	}

	.avatar--thought-leaders-modal {
		width: 96px;
		height: 96px;
	}

	.thought-leader-modal__contribution {
		flex-direction: column;
		align-items: flex-start;
	}

	.thought-leader-modal__contribution-thumb {
		width: 100%;
		height: auto;
		aspect-ratio: 114 / 64;
	}
}
/* Thought Leaders Derivative : END */


/* Top Institutions Derivative : START */
.modal {
    z-index: 1300;
}

#top_institutions .top-institutions {
	display: grid;
	gap: var(--vs-gutter-md);
}

#top_institutions .top-institutions__intro {
	max-width: 56ch;
}

#top_institutions .top-institutions__intro h6 {
	margin-bottom: var(--vs-spacing-1);
}

#top_institutions .top-institutions__intro-copy p {
	margin: 0;
	font-size: var(--vs-fs-2);
	line-height: 1.4;
}

#top_institutions .top-institutions__list {
	margin: 0;
	padding: 0;
	list-style: none;
	border-top: 1px solid var(--border-regular);
}

#top_institutions .top-institutions__item {
	list-style: none;
}

#top_institutions .top-institutions__entry {
	border-bottom: 1px solid var(--border-regular);
}

#top_institutions .top-institutions__entry[open] {
	padding-bottom: var(--vs-padding-md);
}

#top_institutions .top-institutions__summary {
	display: grid;
	grid-template-columns: 2.25rem minmax(0, 1fr) 1rem;
	gap: var(--vs-spacing-3);
	align-items: center;
	padding: var(--vs-padding-md) 0;
	cursor: pointer;
	list-style: none;
}

#top_institutions .top-institutions__summary:has(.avatar) {
	grid-template-columns: 2.25rem 32px minmax(0, 1fr) 1rem;
}

#top_institutions .top-institutions__summary::-webkit-details-marker {
	display: none;
}

#top_institutions .top-institutions__summary:focus-visible {
	outline: 2px solid var(--btn-focusedBorder);
	outline-offset: 4px;
	border-radius: var(--vs-radius-sm);
}

#top_institutions .top-institutions__rank,
#top_institutions .top-institutions__heading h6,
#top_institutions .top-institutions__heading p,
#top_institutions .top-institutions__panel p,
#top_institutions .top-institutions__tags p,
#top_institutions .top-institutions__tags ul {
	margin: 0;
}

#top_institutions .top-institutions__rank {
	font-size: var(--vs-fs-3);
	font-weight: var(--vs-fw-bold);
	line-height: 1;
}

#top_institutions .avatar--top-institutions {
	width: 32px;
	height: 32px;
	overflow: hidden;
	border: 1px solid var(--border-regular);
	border-radius: var(--vs-radius-round);
	transition: var(--vs-anim-fast);
}

#top_institutions .avatar--top-institutions img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

#top_institutions .top-institutions__heading {
	min-width: 0;
}

#top_institutions .top-institutions__heading h6 {
	font-size: var(--vs-fs-2);
	line-height: 1.3;
}

#top_institutions .top-institutions__heading p {
	font-size: 11px;
	line-height: 1.35;
	color: var(--text-secondary);
}

#top_institutions .top-institutions__chevron {
	color: var(--text-secondary);
	transition: transform var(--vs-anim-fast);
}

#top_institutions .top-institutions__entry[open] .top-institutions__chevron {
	transform: rotate(180deg);
}

#top_institutions .top-institutions__panel {
	padding-left: calc(2.25rem + 32px + var(--vs-spacing-3));
	display: grid;
	gap: var(--vs-spacing-3);
}

#top_institutions .top-institutions__panel > p {
	max-width: 64ch;
	font-size: var(--vs-fs-2);
	line-height: 1.4;
	color: var(--text-secondary);
}

#top_institutions .top-institutions__tags {
	display: grid;
	gap: 0;
	padding-top: var(--vs-spacing-3);
}

#top_institutions .top-institutions__tags p {
	font-size: 12px;
	font-weight: 700;
	line-height: 1.4;
	color: var(--text-primary);
}

#top_institutions .top-institutions__tags ul {
	display: flex;
	flex-wrap: wrap;
	gap: 0.25rem 0.625rem;
	padding: 0;
	list-style: none;
	font-size:12px;
}

#top_institutions .top-institutions__tags li {
	position: relative;
	padding-right: 0.75rem;
}

#top_institutions .top-institutions__tags li:not(:last-child)::after {
	content: "\2022";
	position: absolute;
	right: 0;
	top: 0;
	color: var(--text-tertiary);
}

#top_institutions .top-institutions__tags a {
	color: var(--vs-primary-blue-60);
	text-decoration: underline;
}


@media (max-width: 575px) {
	#top_institutions .top-institutions__summary {
		grid-template-columns: 2rem minmax(0, 1fr) 1rem;
		gap: var(--vs-spacing-2);
	}

	#top_institutions .top-institutions__summary:has(.avatar) {
		grid-template-columns: 2rem 32px minmax(0, 1fr) 1rem;
	}

	#top_institutions .top-institutions__panel {
		padding-left: 0;
	}
}
/* AI Derivative - Top Institutions : END */


/* AI DERIVATIVE : END */

/* Action Bar Styles ----------------- */
/* ------------------------------ */
/* ----------------------------- */
/* ---------------------- (°_°) */

.action-bar {
	grid-area: action-bar;
    display: grid;
    position: relative;
    top: auto;
    inset: auto;
    background: var(--background-primary);
    width: 100%;
    min-height: 0;
    margin: 0;
    padding: 0;
    border: 0;
    box-shadow: none;
    float: none;
    --action-bar-inline-padding: 0px;
    --action-bar-scrollbar-size: 8px;
    --action-bar-scroll-btn-size: 1.25rem;
    --action-bar-scroll-btn-offset: max(var(--vs-spacing-2), calc((var(--action-bar-inline-padding) - var(--action-bar-scroll-btn-size)) / 2));
    --action-bar-edge-fade-width: calc(var(--action-bar-inline-padding) + var(--vs-spacing-4));
    --action-bar-scroll-top-allowance: var(--vs-spacing-2);
}

.action-bar__list {
	display: flex;
	flex-wrap: nowrap;
	gap: var(--vs-spacing-8);
	padding: var(--vs-padding-xs) var(--vs-padding-xl);
	border-bottom: 1px solid var(--border-regular);
	margin: 0;
	list-style: none;
    min-width: max-content
}

.action-bar__item {
	margin: 0;
	flex: 0 0 auto;
}

.action-bar__scroll-area {
	width: 100%;
	padding-bottom: 0;
}

.action-bar--article {
    --action-bar-inline-padding: var(--vs-padding-article-body);
    width: calc(100% + (var(--action-bar-inline-padding) * 2));
    margin: .5rem calc(var(--action-bar-inline-padding) * -1) 0;
    position: relative;
    z-index: 0;
    isolation: isolate;
    overflow: visible;
}

.action-bar--article .action-bar__scroll-area {
    position: relative;
    overflow: visible;
    padding-top: var(--action-bar-scroll-top-allowance);
    margin-top: calc(var(--action-bar-scroll-top-allowance) * -1);
}

.action-bar--article .action-bar__list {
	width: max-content;
	min-width: 100%;
    padding-left: var(--action-bar-inline-padding);
    padding-right: var(--action-bar-inline-padding);
}

.action-bar__scroll-area .os-scrollbar-horizontal {
	--os-size: var(--action-bar-scrollbar-size);
    height: var(--action-bar-scrollbar-size) !important;
    padding: var(--os-padding-perpendicular) var(--action-bar-inline-padding);
	bottom: 0;
    opacity: 0;
    pointer-events: none;
}

.action-bar__scroll-area:hover .os-scrollbar-horizontal,
.action-bar__scroll-area .os-scrollbar-horizontal:hover,
.action-bar__scroll-area .os-scrollbar-horizontal.os-scrollbar-interaction,
.action-bar__scroll-area .os-scrollbar-horizontal.os-scrollbar-visible {
    opacity: 0 !important;
    pointer-events: none;
}

.action-bar__scroll-area .os-scrollbar-track,
.action-bar__scroll-area .os-scrollbar-track:hover {
	background: var(--divider);
}

.action-bar__scroll-area .os-scrollbar-horizontal .os-scrollbar-handle {
	width: 3rem !important;
	max-width: 3rem !important;
	min-width: 1.75rem !important;
	border-radius: 3px;
}

.action-bar--vertical {
    flex-direction: row;
}

.action-bar--vertical .action-bar__list {
    flex-direction: column;
}

.action-bar--vertical .action-bar__panels {
    flex: 1;
    padding: 1rem;
}

.action-bar__tab {
    appearance: none;
    border: 0;
    background: transparent;
    color: var(--text-secondary);
    padding: 0 0.125rem 0.25rem 0.125rem;
    font: 500 14px/1.2 ui-sans-serif, system-ui;
    border-radius: 0;
    cursor: pointer;
    transition: background var(--vs-anim-fast), color var(--vs-anim-fast);
    width: 100%;
    text-align: left;

    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
	text-decoration:none;
}

.action-bar__icon {
    display: inline-flex;
    flex-shrink: 0;
    width: 1rem;
    height: 1rem;
    fill: currentColor;
}

.action-bar__label {
    flex: 1;
}

.action-bar__tab:hover {
    color: var(--text-primary-hover);
}

.action-bar__tab:focus-visible {
    outline: none;
    box-shadow: var(--vs-primary-blue-50);
}

.action-bar__tab[aria-selected="true"] {
    color: var(--text-primary-selected);
    border-bottom: 2px solid var(--vs-primary-blue-50);
}

.action-bar__tab[disabled],
.action-bar__tab[aria-disabled="true"] {
    color: var(--text-secondary);
    opacity: var(--disabled);
    cursor: not-allowed;
    pointer-events: none;
}

.action-bar__panel {
	padding-top: var(--vs-padding-sm);
    padding-bottom: var(--vs-padding-xl);
    grid-area: article-body;
}

.action-bar__panel[hidden] {
    display: none;
	
}

.action-bar__panel--fade {
    opacity: 0;
    transition: opacity var(--vs-anim-fast);
}

.action-bar__panel--fade.action-bar__panel--show {
    opacity: 1;
}

.action-bar--scrollable::before,
.action-bar--scrollable::after {
    content: "";
    position: absolute;
    top: 0;
    bottom: 0;
    width: var(--action-bar-edge-fade-width);
    pointer-events: none;
    z-index: 2;
    opacity: 0;
    transition: opacity var(--vs-anim-fast);
}

.action-bar--scrollable::before {
    left: 0;
    background: linear-gradient(to right, var(--background-primary) 40%, transparent 100%);
}

.action-bar--scrollable::after {
    right: 0;
    background: linear-gradient(to left, var(--background-primary) 40%, transparent 100%);
}

.action-bar--scrollable.action-bar--has-prev::before {
    opacity: 1;
}

.action-bar--scrollable.action-bar--has-next::after {
    opacity: 1;
}

.action-bar__scroll-btn {
    position: absolute;
    top: calc(50% + (var(--action-bar-scroll-top-allowance) / 2) - (var(--action-bar-scrollbar-size) / 2));
    z-index: 3;
    width: var(--action-bar-scroll-btn-size);
    height: var(--action-bar-scroll-btn-size);
    justify-content: center;
    transform: translateY(-50%);
}

.action-bar__scroll-btn--prev {
    left: var(--action-bar-scroll-btn-offset);
}

.action-bar__scroll-btn--next {
    right: var(--action-bar-scroll-btn-offset);
}

.action-bar__scroll-btn[disabled] {
    color: var(--text-tertiary);
    background: var(--btn-secondary);
    border-color: var(--btn-secondary);
    pointer-events: none;
    box-shadow: none;
}

.action-bar__scroll-btn .icon {
    width: 0.625rem;
    height: 0.625rem;
}


.page-layout--article .action-bar__panel h2 {
    margin-top: 2rem;
}

.page-layout--article .action-bar__panel h3 {
    margin-top: 1.5rem;
}

.page-layout--article .action-bar__panel h4 {
    margin-top: 1.125rem;
}

.page-layout--article .action-bar__panel h5 {
    margin-top: 1rem;
}

.page-layout--article .action-bar__panel h6 {
    margin-top: .75rem;
}

.page-layout--article .action-bar__panel p {
    margin-bottom: 1rem;
}

.page-layout--article:first-child .action-bar__panel h2:first-child, .page-layout--article:first-child .action-bar__panel h3:first-child, .page-layout--article:first-child .action-bar__panel h4:first-child, .page-layout--article:first-child .action-bar__panel h5:first-child, .page-layout--article:first-child .action-bar__panel h6:first-child {
    margin-top: 0;
}

.action-bar__panels #summary p,
.action-bar__panels #takeaways ul,
.action-bar__panels #takeaways ol {
  /* default fallback styles */
  position: relative;
  max-height: calc((var(--vs-lh-body)) * 3);
  overflow: hidden;
}

.btn--audio-preview {
   flex: 1 0 auto;
   box-shadow: var(--vs-shadow-sm) !important;
}

@supports (-webkit-line-clamp: 1) {
  .action-bar__panels #summary p,
  .action-bar__panels #takeaways ul,
  .action-bar__panels #takeaways ol {
    /* use the clamp approach in supporting browsers */
    overflow: hidden;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
    /* optionally override or remove fade overlay */
  }
}

.action-bar__panels #takeaways ul,
.action-bar__panels #takeaways ol {
    margin-bottom: 0;
}

.action-bar__panels #takeaways ul li:nth-child(n+4),
.action-bar__panels #takeaways ol li:nth-child(n+4) {
    display: none;
}

.action-bar .btn.action-bar__read-more-btn,
.action-bar .btn.action-bar__read-more-btn:hover,
.action-bar .btn.action-bar__read-more-btn:active {
    background: linear-gradient(90deg, hsl(210 60 98 / .0) 0%, hsl(210 60 98 / 1) 35%);
    position: absolute;
    bottom: calc((var(--vs-padding-smedium) - var(--vs-spacing-4) - 2px) * -1);
    right: calc(var(--vs-padding-smedium) - var(--vs-spacing-4));
    padding: var(--vs-spacing-4) var(--vs-spacing-4) var(--vs-spacing-4) var(--vs-spacing-10);  
    color: var(--text-secondary);
    font-weight: var(--vs-fw-semibold);
    border: 0px solid transparent;
}

.action-bar .btn.action-bar__read-more-btn:hover{
    color: var(--text-secondary-hover);
}

.action-bar__footer-buttons{
	display: flex;
	gap: var(--vs-gutter-sm);
	margin-top: var(--vs-gutter-md);
}

.action-bar__footer-buttons div:first-child{
	margin-right: auto;
}    
/* Action bar : END */


/* Poll : START */
/* ============================================================
   poll.css
   Styles for the Poll question component.
   ============================================================ */

/* ---- Google Fonts import ---- */
@import url('https://fonts.googleapis.com/css2?family=Raleway:wght@400;500;700&display=swap');

/* ============================================================
   Design tokens
   ============================================================ */

.poll {
    --poll-font:             'Raleway', sans-serif;
    --poll-text-primary:     var(--dark);
    --poll-text-secondary:   var(--dark-50);
    --poll-btn-bg:           var(--vs-primary-tan);
    --poll-btn-bg-hover:     var(--vs-primary-grey-20);
    --poll-white:            #ffffff;
    --poll-border:           #e4e7ea;
    --poll-radius-sm:        var(--bs-border-radius);
    --poll-radius-md:        var(--bs-border-radius);
    --poll-focus-ring:       var(--vs-primary-tan-60);
    --poll-purple-bar:       var(--vs-primary-tan-60);
    --poll-purple-label:     var(--vs-primary-tan-60);
}

/* ============================================================
   Card container
   ============================================================ */

.poll {
    display: flex;
    flex-direction: column;
    gap: 10px;
    width: 100%;
    padding: 24px;
    background-color: var(--poll-white);
    border: 1px solid var(--poll-border);
    border-radius: var(--poll-radius-md);
    font-family: var(--poll-font);
    color: var(--poll-text-primary);
    box-sizing: border-box;
    backdrop-filter: blur(8px);
    overflow: clip;
}

/* ============================================================
   Question
   ============================================================ */

.poll__question {
    font-size: 18px;
    font-weight: 700;
    line-height: 1.2;
    color: var(--poll-text-primary);
    margin: 0;
}

/* ============================================================
   Multi-choice inputs
   ============================================================ */

.poll__choices {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.poll__instruction {
    font-size: 14px;
    font-weight: 400;
    line-height: 1.4;
    color: var(--poll-text-secondary);
    margin: 0;
}

.poll__options-list {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

/* ---- Individual option ---- */

.poll__option {
    display: flex;
    align-items: center;
    gap: 6px;
    width: 100%;
    min-width: 200px;
    padding: 8px;
    background-color: var(--poll-white);
    border: 1px solid var(--poll-border);
    border-radius: var(--poll-radius-md);
    box-sizing: border-box;
    cursor: pointer;
    font-family: var(--poll-font);
    font-size: 14px;
    font-weight: 400;
    line-height: 1.4;
    color: var(--poll-text-primary);
    text-align: left;
    transition: border-color 0.15s ease-in-out;
}

.poll__option:hover {
    border-color: #b8bfc4;
}

.poll__option:focus-visible {
    outline: 2px solid var(--poll-focus-ring);
    outline-offset: 2px;
}

/* Selected state */
.poll__option--selected {
    border-color: var(--poll-btn-bg);
}

/* ---- Radio indicator ---- */

.poll__radio {
    position: relative;
    flex-shrink: 0;
    width: 16px;
    height: 16px;
    border-radius: 100px;
    border: 1px solid rgba(0, 0, 0, 0.15);
    background-color: var(--poll-white);
    box-sizing: border-box;
}

.poll__option--selected .poll__radio {
    background-color: var(--poll-btn-bg);
    border-color: var(--poll-btn-bg);
}

.poll__option--selected .poll__radio::after {
    content: '';
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 8px;
    height: 8px;
    border-radius: 100px;
    background-color: var(--poll-white);
}

/* ---- Option label text ---- */

.poll__option-text {
    flex: 1;
}

/* ============================================================
   Footer row
   ============================================================ */

.poll__footer {
    display: flex;
    align-items: center;
    gap: 24px;
    width: 100%;
}

.poll__responses {
    flex: 1;
    font-size: 14px;
    font-weight: 400;
    line-height: 1.4;
    color: var(--poll-text-secondary);
    margin: 0;
}

.poll__actions {
    display: flex;
    align-items: center;
    gap: 12px;
    flex-shrink: 0;
}

/* ---- Text button ("See Results") ---- */

.poll__btn-text {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    min-height: 24px;
    min-width: 24px;
    padding: 6px;
    background: none;
    border: none;
    border-radius: var(--poll-radius-sm);
    font-family: var(--poll-font);
    font-size: 14px;
    font-weight: 500;
    line-height: 16px;
    color: var(--poll-text-primary);
    white-space: nowrap;
    cursor: pointer;
    transition: color 0.15s ease-in-out;
}

.poll__btn-text:hover {
    color: var(--poll-text-secondary);
}

.poll__btn-text:focus-visible {
    outline: 2px solid var(--poll-focus-ring);
    outline-offset: 2px;
}

/* ---- Primary button ("Next") ---- */

.poll__btn-primary {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    min-height: 24px;
    min-width: 24px;
    padding: 6px 8px;
    background-color: var(--poll-btn-bg);
    color: var(--poll-white);
    border: none;
    border-radius: var(--poll-radius-sm);
    font-family: var(--poll-font);
    font-size: 14px;
    font-weight: 500;
    line-height: 16px;
    white-space: nowrap;
    cursor: pointer;
    transition: background-color 0.15s ease-in-out;
}

.poll__btn-primary:hover {
    background-color: var(--poll-btn-bg-hover);
}

.poll__btn-primary:focus-visible {
    outline: 2px solid var(--poll-focus-ring);
    outline-offset: 2px;
}

/* ============================================================
   Results — horizontal bar chart
   ============================================================ */

/* ---- Results list (replaces options-list) ---- */

.poll__results-list {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

/* ---- Individual result row ---- */

.poll__result {
    display: flex;
    align-items: flex-start;
    gap: 8px;
    width: 100%;
}

/* ---- Percentage ---- */

.poll__result-pct {
    flex-shrink: 0;
    width: 52px;
    font-size: 20px;
    font-weight: 400;
    line-height: 1.4;
    color: var(--poll-text-primary);
    margin: 0;
}

/* ---- Bar + labels column ---- */

.poll__result-data {
    display: flex;
    flex-direction: column;
    flex: 1;
    min-width: 0;
    gap: 2px;
    justify-content: center;
}

/* ---- Bar track ---- */

.poll__result-bar {
    width: 100%;
    border: 1px solid var(--poll-border);
    box-sizing: border-box;
}

/* ---- Bar fill ---- */

.poll__result-bar-fill {
    height: 28px;
    background-color: var(--poll-purple-bar);
}

/* ---- Labels row (option text + count) ---- */

.poll__result-meta {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    width: 100%;
}

.poll__result-label {
    font-size: 12px;
    font-weight: 400;
    line-height: 1.4;
    color: var(--poll-text-primary);
    margin: 0;
    white-space: nowrap;
}

.poll__result-count {
    font-size: 12px;
    font-weight: 400;
    line-height: 1.4;
    color: var(--poll-text-primary);
    margin: 0;
    white-space: nowrap;
    flex-shrink: 0;
}

/* ---- Winner modifier ---- */

.poll__result--winner .poll__result-label {
    font-weight: 700;
    color: var(--poll-purple-label);
}
/* Poll : END */

/* Survey : START */
/* ============================================================
   conexiant-survey.css
   Shared styles for the Test Your Knowledge quiz component
   and the Results page component.
   ============================================================ */

/* ---- Google Fonts import ---- */
@import url('https://fonts.googleapis.com/css2?family=Raleway:wght@400;500;700&display=swap');

/* ============================================================
   Preview scaffold — remove when embedding in article template
   ============================================================ */



/* ============================================================
   Design tokens
   ============================================================ */

.post__copy.survey {
    --survey-font:              'Raleway', sans-serif;
    --survey-text-primary:      var(--dark);
    --survey-text-secondary:    var(--dark);
    --survey-text-tertiary:     var(--dark);;
    --survey-red:               var(--vs-utility-red-100);   /* wrong answer text + feedback */
    --survey-red-radio:         var(--vs-utility-red-90);   /* wrong answer radio fill */
    --survey-green-label:       var(--vs-utility-green-100);   /* correct answer text */
    --survey-green-radio:       var(--vs-utility-green-80);   /* correct answer radio fill */
    --survey-purple-progress:   var(--vs-primary-blue-100);   /* progress bar fill */
    --survey-grey-track:        #e4e7ea;   /* progress track + option borders + dividers */
    --survey-card-bg:           #f7fafd;   /* rationale card bg */
    --survey-btn-bg:            var(--primary-clr-1);   /* Continue button */
    --survey-white:             #ffffff;
    --survey-radius-sm:         var(--survey-radius-sm);
    --survey-radius-md:         var(--survey-radius-sm);
    display: flex;
    flex-direction: column;
    gap: 24px;
    width: 100%;
    max-width: 620px;
    font-family: var(--survey-font);
    color: var(--survey-text-primary);
    box-sizing: border-box;
    margin:auto;
}

/* ============================================================
   Test Your Knowledge — quiz component
   ============================================================ */

/* ---- Header row (title + progress bar) ---- */

.post__copy .survey__header {
    display: flex;
    align-items: flex-end;
    gap: 24px;
    width: 100%;
}

.post__copy .survey__title {
    flex: 1;
    font-size: 18px;
    font-weight: 700;
    line-height: 1.2;
    color: var(--survey-text-primary);
    margin: 0;
    padding-top: 16px;
}

.post__copy .survey__progress {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    flex-shrink: 0;
    width: 133px;
}

.post__copy .survey__progress-label {
    font-size: 12px;
    font-weight: 400;
    line-height: 1.4;
    color: var(--survey-text-primary);
    white-space: nowrap;
}

.post__copy .survey__progress-bar {
    position: relative;
    width: 100%;
    height: 16px;
}

.post__copy .survey__progress-track {
    position: absolute;
    top: 6px;
    left: 0;
    right: 0;
    height: 4px;
    background-color: var(--survey-grey-track);
    border-radius: 2px;
}

.post__copy .survey__progress-fill {
    position: absolute;
    top: 6px;
    left: 0;
    height: 4px;
    background-color: var(--survey-purple-progress);
    border-radius: 2px;
}

/* ---- Quiz body ---- */

.post__copy .survey__body {
    display: flex;
    flex-direction: column;
    gap: 16px;
    width: 100%;
}

/* ---- Question text ---- */

.post__copy .survey__question {
    font-size: 16px;
    font-weight: 400;
    line-height: 1.4;
    color: var(--survey-text-primary);
    margin: 0;
}

/* ---- Continue button ---- */

.post__copy .survey__footer {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 24px;
    width: 100%;
}

.post__copy .survey__btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    background-color: var(--survey-btn-bg);
    color: var(--survey-white);
    border: none;
    border-radius: 2.5rem;
    padding: 6px 8px;
    min-height: 24px;
    font-family: var(--survey-font);
    font-size: 14px;
    font-weight: 500;
    line-height: 16px;
    white-space: nowrap;
    cursor: pointer;
    transition: background-color 0.15s ease-in-out;
}

.post__copy .survey__btn:hover {
    background-color: #0f3a4d;
}

.post__copy .survey__btn:focus-visible {
    outline: 2px solid var(--survey-purple-progress);
    outline-offset: 2px;
}

/* ============================================================
   Shared options — used by both quiz and results
   ============================================================ */

/* ---- Options section wrapper ---- */
.post__copy .survey__options-section {
    display: flex;
    flex-direction: column;
    gap: 12px;
    padding-left: 28px;
    width: 100%;
    box-sizing: border-box;
}

/* ---- Feedback line ---- */

.post__copy .survey__feedback {
    font-size: 14px;
    font-weight: 400;
    line-height: 1.4;
    margin: 0;
}

.post__copy .survey__feedback--wrong {
    color: var(--survey-red);
}

.post__copy .survey__feedback--right {
    color: var(--survey-green-label);
}

/* ---- Options list ---- */

.post__copy .survey__options-list {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

/* ---- Individual option ---- */

.post__copy .survey__option {
    display: flex;
    align-items: center;
    gap: 6px;
    width: 100%;
    background-color: var(--survey-white);
    border: 1px solid var(--survey-grey-track);
    border-radius: var(--survey-radius-md);
    padding: 8px;
    box-sizing: border-box;
    min-width: 200px;
    height: 36px;
}

/* ---- Radio button ---- */

.post__copy .survey__radio {
    position: relative;
    flex-shrink: 0;
    width: 16px;
    height: 16px;
    border-radius: 100px;
    border: 1px solid rgba(0, 0, 0, 0.15);
    background-color: var(--survey-white);
    box-sizing: border-box;
}

/* Correct / valid selected state */
.post__copy .survey__option--correct .survey__radio {
    background-color: var(--survey-green-radio);
    border-color: var(--survey-green-radio);
}

.post__copy .survey__option--correct .survey__radio::after {
    content: '';
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 8px;
    height: 8px;
    border-radius: 100px;
    background-color: var(--survey-white);
}

/* Invalid / wrong selected state */
.post__copy .survey__option--invalid .survey__radio {
    background-color: var(--survey-red-radio);
    border-color: var(--survey-red-radio);
}

.post__copy .survey__option--invalid .survey__radio::after {
    content: '';
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 8px;
    height: 8px;
    border-radius: 100px;
    background-color: var(--survey-white);
}

/* ---- Option label text ---- */

.post__copy .survey__option-text {
    flex: 1;
    font-size: 14px;
    font-weight: 400;
    line-height: 1.4;
    color: var(--survey-text-primary);
}

.post__copy .survey__option--correct .survey__option-text {
    color: var(--survey-green-label);
}

.post__copy .survey__option--invalid .survey__option-text {
    color: var(--survey-red);
}

/* ---- State icon (check or X circle) ---- */

.post__copy .survey__state-icon {
    flex-shrink: 0;
    width: 16px;
    height: 16px;
    display: flex;
    align-items: center;
    justify-content: center;
}

/* ---- Rationale card ---- */

.post__copy .survey__rationale-section {
    padding-left: 28px;
    width: 100%;
    box-sizing: border-box;
}

.post__copy .survey__rationale-card {
    background-color: var(--survey-card-bg);
    border-radius: var(--survey-radius-md);
    padding: 12px;
    width: 100%;
    box-sizing: border-box;
}

.post__copy .survey__rationale-text {
    font-size: 14px;
    font-weight: 400;
    line-height: 1.4;
    color: var(--survey-text-secondary);
    margin: 0;
}

.post__copy .survey__rationale-text + .post__copy .survey__rationale-text {
    margin-top: 8px;
}

.post__copy .survey__rationale-text strong {
    font-weight: 700;
    color: var(--survey-text-secondary);
}

/* ============================================================
   Results page — summary overview
   ============================================================ */

.post__copy .survey__summary-overview {
    display: flex;
    gap: 24px;
    align-items: flex-start;
    width: 100%;
}

.post__copy .survey__summary {
    display: flex;
    flex-direction: column;
    gap: 16px;
    align-items: flex-start;
    flex-shrink: 0;
}

/* ---- Grade heading ("Great job!") ---- */

.post__copy .survey__grade-heading {
    font-size: 20px;
    font-weight: 700;
    line-height: 1.2;
    color: var(--survey-text-primary);
    margin: 0;
}

/* ---- Score card + action links row ---- */

.post__copy .survey__score-links {
    display: flex;
    gap: 16px;
    align-items: flex-start;
}

/* Score card */

.post__copy .survey__score-card {
    display: flex;
    flex-direction: column;
    align-items: center;
    flex-shrink: 0;
    width: 120px;
    padding: 12px;
    border-radius: var(--vs-radius-md);
    box-shadow: 0 0 6px 0 rgba(23, 52, 64, 0.04);
    box-sizing: border-box;
    overflow: hidden;
    /* Radial gradient: white top-left → light blue bottom */
    background: var(--vs-primary-tan-40);
}

.post__copy .survey__score-label {
    font-size: 16px;
    font-weight: 400;
    line-height: 1.4;
    color: var(--survey-text-primary);
    margin: 0;
    text-align: center;
    width: 80px;
}

.post__copy .survey__score-value {
    font-size: 48px;
    font-weight: 400;
    line-height: 1.2;
    color: var(--survey-text-primary);
    margin: 0;
    text-align: center;
    width: 96px;
}

/* Action links */

.post__copy .survey__action-links {
    display: flex;
    flex-direction: column;
    gap: 10px;
    align-items: flex-start;
    justify-content: center;
    flex-shrink: 0;
}

.post__copy .survey__action-link {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 4px 2px;
    min-height: 24px;
    font-family: var(--survey-font);
    font-size: 14px;
    font-weight: 500;
    line-height: 16px;
    color: var(--survey-text-tertiary);
    text-decoration: none;
    white-space: nowrap;
    cursor: pointer;
    background: none;
    border: none;
}

.post__copy .survey__action-link:hover {
    color: var(--survey-text-primary);
}

.post__copy .survey__action-icon {
    flex-shrink: 0;
    width: 12px;
    height: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
}

/* ---- Helpful row ---- */

.post__copy .survey__helpful {
    display: flex;
    gap: 16px;
    align-items: center;
}

.post__copy .survey__helpful-label {
    font-size: 14px;
    font-weight: 400;
    line-height: 1.4;
    color: var(--survey-text-primary);
    white-space: nowrap;
}

.post__copy .survey__helpful-btns {
    display: flex;
    gap: 6px;
    align-items: center;
}

.post__copy .survey__helpful-btn {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 4px 2px;
    min-height: 24px;
    font-family: var(--survey-font);
    font-size: 14px;
    font-weight: 500;
    line-height: 16px;
    color: var(--survey-text-tertiary);
    background: none;
    border: none;
    cursor: pointer;
    white-space: nowrap;
}

.post__copy .survey__helpful-btn:hover {
    color: var(--survey-text-primary);
}

/* ============================================================
   Results page — divider
   ============================================================ */

.post__copy .survey__divider {
    width: 100%;
    border: none;
    border-top: 1px solid var(--survey-grey-track);
    margin: 8px 0;
}

.post__copy .survey__divider--thick {
    border-top-width: 3px;
}

/* ============================================================
   Results page — Your Results section
   ============================================================ */

.post__copy .survey__results {
    display: flex;
    flex-direction: column;
    gap: 32px;
    width: 100%;
    background: var(--survey-white);
}

.post__copy .survey__results-heading {
    font-size: 20px;
    font-weight: 700;
    line-height: 1.2;
    color: var(--survey-text-primary);
    margin: 0;
}

/* Q&A list */

.post__copy .survey__qa-list {
    display: flex;
    flex-direction: column;
    gap: 64px;
    width: 100%;
}

/* Collapsed state: clip height + fade overlay */

.post__copy .survey__results-body {
    position: relative;
}

.post__copy .survey__results-body--collapsed {
    max-height: 323px;
    overflow: hidden;
}

.post__copy .survey__results-body--collapsed::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    height: 101px;
    background: linear-gradient(to bottom, rgba(255, 255, 255, 0) 0%, #ffffff 50%);
    pointer-events: none;
}

/* Individual Q&A block */

.post__copy .survey__qa-block {
    display: flex;
    flex-direction: column;
    gap: 16px;
    width: 100%;
}

.post__copy .survey__qa-question {
    font-size: 16px;
    font-weight: 400;
    line-height: 1.4;
    color: var(--survey-text-primary);
    margin: 0;
}

/* ============================================================
   Results page — expand / collapse toggle
   ============================================================ */

.post__copy .survey__toggle-wrap {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 100%;
    gap: 4px;
}

.post__copy .survey__toggle-row {
    display: flex;
    align-items: center;
    gap: 5px;
    width: 100%;
}

.post__copy .survey__toggle-line {
    flex: 1;
    height: 1px;
    background-color: var(--survey-grey-track);
    min-width: 0;
}

.post__copy .survey__toggle-btn {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    width: 24px;
    height: 24px;
    padding: 6px;
    border: 1px solid #d0d4d7;
    border-radius: var(--survey-radius-sm);
    background: var(--survey-white);
    cursor: pointer;
    box-sizing: border-box;
    transition: background-color 0.15s;
}

.post__copy .survey__toggle-btn:hover {
    background-color: #f0f2f4;
}

.post__copy .survey__toggle-btn svg {
    transition: transform 0.2s ease;
}

.post__copy .survey__toggle-btn.is-expanded svg {
    transform: rotate(180deg);
}

.post__copy .survey__toggle-label {
    font-size: 10px;
    font-weight: 400;
    line-height: 1.4;
    color: var(--survey-text-primary);
    text-align: center;
    white-space: nowrap;
}

/* Survey : END */



/* AI Derivative - Top Topic : START */
#topic .topic-commentaries__intro,
#top_commentaries .topic-commentaries__intro {
	max-width: 62ch;
	margin-bottom: var(--vs-spacing-8);
}

#topic .topic-commentaries__list,
#top_commentaries .topic-commentaries__list {
	display: grid;
	gap: 1.5rem;
	padding: 0;
	margin: 0;
	list-style: none;
}

#topic .topic-commentary,
#top_commentaries .topic-commentary {
	display: grid;
	grid-template-columns: auto 1fr;
	gap: 1.5rem;
	padding-top: 0;
	border-top: 0;
}

#topic .topic-commentary:first-child,
#top_commentaries .topic-commentary:first-child {
	padding-top: 1.5rem;
	border-top: 1px solid var(--border-regular);
}

#topic .topic-commentary__avatar,
#top_commentaries .topic-commentary__avatar {
	width: 40px;
	height: 40px;
	margin-top: var(--vs-spacing-1);
	overflow: hidden;
	border-radius: 50%;
}

#topic .topic-commentary__body,
#top_commentaries .topic-commentary__body {
	min-width: 0;
}

#topic .topic-commentary__name,
#top_commentaries .topic-commentary__name {
	margin: 0 0 var(--vs-spacing-1);
	font-weight: var(--vs-font-weight-semibold);
}

#topic .topic-commentary__meta,
#top_commentaries .topic-commentary__meta {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
	margin-bottom: 0.5rem;
	color: var(--text-secondary);
}

#topic .topic-commentary__meta p,
#top_commentaries .topic-commentary__meta p {
	margin: 0;
}

#topic .topic-commentary__dot,
#top_commentaries .topic-commentary__dot {
	color: var(--text-tertiary);
}

#topic .topic-commentary__quote,
#top_commentaries .topic-commentary__quote {
	position: relative;
	margin: 0 0 var(--vs-spacing-3);
	padding-left: var(--vs-spacing-4);
	border-left: 0;
}

#topic .topic-commentary__quote::before,
#topic .topic-commentary__quote::after,
#top_commentaries .topic-commentary__quote::before,
#top_commentaries .topic-commentary__quote::after {
	position: absolute;
	color: var(--text-secondary);
	font-size: 1.25em;
	line-height: 1;
}

#topic .topic-commentary__quote::before,
#top_commentaries .topic-commentary__quote::before {
	content: "\201C";
	left: 0;
	top: 0.1em;
}

#topic .topic-commentary__quote::after,
#top_commentaries .topic-commentary__quote::after {
	content: "\201D";
	position: static;
	margin-left: 0.1em;
}

#topic .topic-commentary__quote p,
#top_commentaries .topic-commentary__quote p {
	margin: 0;
	display: inline;
}

#topic .topic-commentary__source,
#top_commentaries .topic-commentary__source {
	display: inline-flex;
	align-items: center;
	gap: 0.35rem;
	font-size: 0.875rem;
	font-weight: var(--vs-font-weight-medium);
	color: var(--vs-primary-grey-80);
	text-decoration: none;
}

#topic .topic-commentary__source svg,
#top_commentaries .topic-commentary__source svg {
	flex: 0 0 auto;
}

@media (max-width: 575px) {
	#topic .topic-commentary,
	#top_commentaries .topic-commentary {
		grid-template-columns: 1fr;
		gap: var(--vs-spacing-3);
	}
}


/* Popover Styles ---------------- */
/* ------------------------------ */
/* ----------------------------- */
/* ---------------------- (°_°) */

.popover{
    /* display revert is for overriding BS */
    display: revert;
    margin: 0;
    max-width: max-content;
    position: absolute;
    inset: auto;
    border: 0;
    padding: var(--vs-spacing-3) 0;
    border-radius: var(--vs-radius-md);
    background: white;
    justify-items: flex-start;
    box-shadow: var(--vs-shadow-xs), var(--vs-shadow-sm);
    overflow: visible;
}

[popover]:-internal-popover-in-top-layer::backdrop {
    background-color: rgba(0,0,0,0.05);
}

.popover:popover-open{
    display: grid;
}

.popover .btn{
    padding: var(--vs-spacing-4) var(--vs-spacing-5);
    text-align: left;
}

/* === AI Footer Popovers === */


.popover--source,
.popover--attribution {
    bottom: calc(anchor(top) + 4px);
    padding: var(--vs-spacing-6);
    max-width: min(420px, 90vw);
    font-family: var(--vs-body-font);
    background: var(--background-primary);
    border: 1px solid var(--border-regular);
    box-shadow: var(--vs-shadow-sm);
    color: var(--text-secondary);
    overflow-wrap: break-word;
    word-break: break-word;
}

.popover--source {
    left: anchor(left);
}

.popover--attribution {
    right: anchor(right);
}

.action-bar__footer-buttons > .popover-wrapper:only-child .popover--attribution {
    left: anchor(left);
    right: auto;
}

#source-popover.popover--source p {
    margin-bottom: var(--vs-spacing-3);
    line-height: 1.45;
}

#source-popover.popover--source *:last-child,
#attribution-popover.popover--attribution *:last-child {
    margin-bottom: 0;
}

.popover--source, .popover--attribution {
    bottom: calc(anchor(top) + 4px);
    padding: var(--vs-spacing-6);
    max-width: min(420px, 90vw);
    font-family: var(--vs-body-font);
    background: var(--background-primary);
    border: 1px solid var(--border-regular);
    box-shadow: var(--vs-shadow-sm);
    color: var(--text-secondary);
    overflow-wrap: break-word;
    word-break: break-word;
}
/* AI Derivative - Top Topic : END */

/* AI DERIVATIVES : END */