/********************************** 

BHCC Magazine 2026

***********************************/
#magazine-menu-open-link { 
  cursor:pointer; 
  font-size:2em; 
  color:#004; 
  transition: all .2s ease-in-out;  
  
}

#magazine-menu-open-link.open {
    transform: rotate(270deg);
    transition: all .2s ease-in-out;
    color:#b60000;
}


ul.multilevel-linkul-0 {
    display: block !important;
    font-weight: 400;
    list-style-type: disclosure-closed;
}
ul.multilevel-linkul-0 li::marker {
    color: #aaa;
}

/******. MAGAZINE ARTICLE *****************/


.magazine-text { 
    border-bottom:1px solid #000;
    border-top:1px solid #000;
    padding:0 1em;
    background-color:#fff;
}
.magazine-text h1 { margin:15px; }

.momentum .article-tagline, .momentum-tagline {
    font-weight:800;
    font-size:1.1em;
    text-decoration:underline;
    text-decoration-thickness: 8px;
    text-underline-offset: 8px;
    text-decoration-color: orangered; 
    margin-bottom:1em;
}

.magazine-article {
   padding: 3%;  
   clear:both;
   background-color:#ffffff;
}


.magazine-article-reduced-header { font-size: 0.7em; }

.magazine-article.momentum h1 { line-height:1.2em;}
.magazine-article.momentum  h2 { line-height:1.2em; color:#000;}



.magazine-article.the-hub  h1 {
   border-top:3px solid #000;
   border-bottom:1px solid #000;  
    font-family: "Yeseva One", serif;
    font-weight: 400;  
    line-height:1.2em;
}

.magazine-article.the-hub  h1 span {
     font-family: "Yeseva One", serif;
     font-weight: 400; 
     line-height:1.2em;
}


.magazine-article.the-hub  h2 {
    color:#004;
    font-size:1.5em;
    font-family: "Yeseva One", serif;
    font-weight: 400;
    line-height:1.2em;
  
}




/**** IMAGE MENU *****/
.mag-image-menu-item-container {
    display:flex;
    flex-wrap:wrap;
    justify-content:center;
    background:#fff;
    padding:2em;
}

.mag-image-menu-item-inner.horizontal {
      display:flex;   
}

.mag-image-menu-item.vertical .mag-image-menu-image { width:100%;}
.mag-image-menu-item.horizontal .mag-image-menu-image { width:60%;}
.mag-image-menu-item.horizontal .mag-image-menu-text-container { width:40%;}

.mag-image-menu-title {
      padding:10px 20px;
      line-height:2em;
      text-align:center;
      border-top:2px solid #000;
      border-bottom:2px solid #000;  
}

.mag-image-menu-text h1  {     
     font-size: 1.8em;
     line-height: 1.1em; 
}

.mag-image-menu-title h2 { font-size:2.5em; letter-spacing:1px; font-weight:600; }


.mag-image-menu-item {
    width:50%;
    padding:2em;
}
.mag-image-menu-image img { 
    width:100% !important;  
    max-width:100% !important;
    height:auto !important;

}
a.mag-image-menu-item-link {
    text-decoration: none;
    color:#000;
}
.vertical .mag-image-menu-text-container { padding:1em 0;  }
.horizontal .mag-image-menu-text-container { padding: 0 1em;  }

.the-hub .mag-image-menu-text { color: #000; text-decoration: none; border-top:3px solid #000; border-bottom:1px solid #000;}
.the-hub .mag-image-menu-text h2 { text-transform:uppercase; text-decoration: none; }

.the-hub .mag-image-menu-text h3 { 
    text-decoration: none;
    margin-top: 0;
    font-family: "Yeseva One", serif;
    font-weight: 400;
    font-style: normal;
    font-size: 1.7em;
    line-height:1.2em;

}



/**** SIDE MENU *****/
#magazine-menu-shell { 
   position:absolute;
   display:block;
   right:15px;
   top:115px;
   width:400px;
   max-width:25%;
   border:2px solid #000;
   box-shadow:3px 3px 3px #888;
   background:#fff;
   z-index:1;
}

#magazine-menu-shell { 
     display:none;
}
.magazine-menu-shell-inner {
    position: relative;
}

#magazine-menu-list { 
    list-style-type: none;
    padding: 0;
    margin: 0;
}
.magazine-menu-shell-text {
    border-bottom:1px solid #aaa; 
    padding:2px;
    text-align:center;
    font-weight:500;  
}

.magazine-menu-item a, li.magazine-menu-item span {
    height: 44px;
    line-height: 44px;  
    display:block;
    padding:0 15px;
    text-decoration:none;
}
li.magazine-menu-item span:before
{
    transform: rotate(90deg);
    transition: all .2s ease-in-out;
  
}

.magazine-menu-item a:hover {
    background:indigo;
    color:#fff;  
}
/*********************************************************************/

.magazine-header {
  padding:0;
  margin:0;
  border-bottom: 2px solid #000;

}
.magazine-header-inner {
     display:flex; 
}

.magazine-page-frame  { padding:2%;}
.magazine-page-frame-inner { padding:0; border:2px solid #000; background-color:#fff; }
.magazine-main-content { }
.magazine-main-content-inner {  padding:0; }

.magazine-header.transparent {
    position: absolute;
    top: 0;
    width: 100%;
    z-index: 11;
    background:linear-gradient(to bottom, rgba(0, 0, 0, 0.8), rgba(0, 0, 0, 0));    
    
}
.magazine-header {
    background:white;  
    color:#000;
}



#logo-container { padding:0; margin: 25px 0 0 5%; text-align:center; }
#bhcc-magazine-logo { width:360px; height:auto; }


#magazine-header-right { 
    display:flex;
    width:100%;
    padding:2em 2em;
    justify-content:center;   
}
.magazine-header-right-section {
    display:block;
    padding:0 1em;
;
}
.magazine-header-link {
   font-size:1.4em;
   font-weight:500;
   height:44px;
   padding:5px 15px;
   display:block;
   color: #000;
   text-transform:uppercase;
   text-decoration:none;
   
}



.magazine-banner-container {
   width:100%;
   position: relative;
}
.magazine-banner {
   width:100%;
   position: relative;
}
.magazine-banner img {
   width:100% !important; 
   height:auto !important; 
}


.magazine-banner-container .magazine-banner-overlay {
    background:white;
    position: absolute;
    bottom: 0;
    left: 10%;
    right: 10%;
    padding:0 15px;
    border:0;    
}

.magazine-banner-container .magazine-banner-title {
    font-size:3em; 
    font-weight:600;
    color:black; 
    margin:0; 
    line-height:1.5em;
    text-align:center;
}

.magazine-banner-container .magazine-banner-sub-headline {
   font-size:1.4em; 
   font-weight:300;  
   color:black;  
   margin:0 auto; 
   line-height:1.5em;
   text-align:center;  
}






  
/****************.  TRANSPARENT  ************************/
.magazine-banner-container.transparent .magazine-banner-overlay {
    position: absolute;
    bottom: 15%;
    left: 0;
    right: 0;  
}
.magazine-banner-container.transparent .magazine-banner-title { 
  font-size:3em; 
  font-weight:600;
  color:black; 
  text-shadow: 1px 1px 2px rgba(255, 255, 255, 0.7);
  margin:0 0 25px 0; 
  line-height:1.5em;
  text-align:center;
}
.magazine-banner-container.transparent .magazine-banner-sub-headline { 
   font-size:1.4em;
   font-weight:600;  
   color:black;  
   text-shadow: 1px 1px 2px rgba(255, 255, 255, 0.7);
   width:50%;
   margin:0 auto; 
   line-height:1.5em;
   text-align:center;  
}
.magazine-banner-container.transparent .magazine-banner-title,
.magazine-banner-container.transparent .magazine-banner-sub-headline { 
    color:#fff;  
    text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.7),-1px -1px 1px rgba(0, 0, 0, 0.7);
}
/***********************************************************/

div#footer-logo {
    display: flex;
    justify-content: space-between;
}




/****************. MEDIA QUERIES ***********************/

@media(max-width:991px) {
  
  .magazine-page-frame {
       padding: 2%;
       background-color: #ddd;
   }
  
  .mag-image-menu-item-inner.horizontal {
      flex-direction: column;  
}
  
   .mag-image-menu-item {
      margin: 20px 0;
      padding:0;
   }
  
  .mag-image-menu-item .horizontal {
        flex-direction:column;     
  }
  
  .mag-image-menu-item.horizontal .mag-image-menu-image {
        width: 100%; 
   }
  
  .mag-image-menu-item.horizontal .mag-image-menu-text-container  {
        width: 100%; 
       padding: 1em 0;
   }
  
   .mag-image-menu-item-container {
         padding: 15px;
   }
  
   .vertical .mag-image-menu-text-container {
        padding: 0;
   }
  .mag-image-menu-text h1 {
      font-size: 1.7em;
      line-height: 1.1em;
      padding: 0;
   }
  
      #magazine-menu-shell { 
         position:unset;
         width:unset;
         max-width:unset;
         height:max-content;
         border:1px solid #bbb;
         box-shadow:none;
         background:#fff;
         z-index:unset; 
         transition:1000ms;
         transition-timing-function: ease-in-out;
         font-size:1.2em; 
      }
  
    .magazine-header-inner {  padding:15px; }
    #magazine-header-right {  display: block; padding:15px; }
     #logo-container {      
          margin: 15px;
          text-align: left;
          max-width: 260px;
     }
     #bhcc-magazine-logo { max-width:100%; width:unset;}

 
  .magazine-header-right-section.page-link { display:none; }
  
  
  
    .magazine-banner-container .magazine-banner-overlay {
        background: white;
        position: unset;
    }
  .magazine-banner-container .magazine-banner-title {
        font-size:1.6em;
  }
     .MagBHCC-content-sameheight  { display:block; }
 
}

@media(max-width:767px) {
   
  
    .magazine-article img {  
       float:none !important;
       margin:15px auto !important;
    }
  
}




/****************. END OF MEDIA QUERIES ***********************/








/***********************************************************
      Past Issues 
*************************************************************/

.MagBHCC-section-header { 
    padding: 10px 0;
    line-height: 2em;
    text-align: center;
    border-top: 2px solid #000;
    border-bottom: 2px solid #000;
}

.MagBHCC-section-header h2 {
    font-size:2.5em;
    font-weight:700;
    letter-spacing:1px;
}

.MagBHCC-content-sameheight { display:flex; flex-wrap:wrap; }


.MagBHCC-pastIssues-content {
	width: 33.33333%; 
	margin-top: 0;
	padding:30px;
}
.MagBHCC-pastIssues-content img {	width: 100% !important; height:auto !important; }
.MagBHCC-pastIssues-content a   { text-decoration: none;	color: #000; }
.MagBHCC-pastIssues-content a:hover, .MagBHCC-pastIssues-content a:focus { 
   text-decoration:underline; 
   text-underline-offset:6px; 
   text-decoration-color: #008FAC;
   text-decoration-thickness: 1px;
}
.MagBHCC-pastIssues-content img:hover {
    filter: brightness(1.1);
}
.pastIssues-content { padding: 5px; }
.pastIssues-content h3, .pastIssues-content h2, .pastIssues-content div  {
	margin: 0 auto;
    text-align:center;
	padding-bottom: 10px;
	padding-top: 10px;
    font-size:1.7em;
    color:#000;
}
.pastIssues-content    {}
.pastIssues-content span {	color: #A80000;	font-weight:500; }
.pastIssues-content p   {
   margin-bottom: 10px;
   line-height: 1.5em;
   text-overflow: ellipsis;
   white-space: nowrap;
}

/****************  PAST ARTICLES ******************/

.MagBHCC-Featured-content {
    width: 33%;
    padding: 2em;
}

.MagBHCC-Featured-content-inner a { text-decoration:none; color:#000; }

.MagBHCC-Featured-content-inner img {
   max-width: 100% !important;
   height:auto !important;  
}

.MagBHCC-Featured-content-description {
    color: #000;
    text-decoration: none;
}

@media(max-width:991px) {
    .MagBHCC-pastIssues-content  {
       width:100%; 
    }
   .pastIssues-content {
        text-align: center;
    }
  
}



/****************  Content ******************/
.magazine-content-item { padding:10px;margin:5px 0;}
.magazine-content-item h2 { font-size:2em; }




/***********************************************************
      PullQuote and Call Out
*************************************************************/
.pullQuote-container{
    display: table;
    table-layout: fixed; /*Optional*/
    border-spacing: 10px; /*Optional*/
    position: relative;
    padding: 0 10%;
	margin: 10px 0;
  	width:100%;
}

.pullQuote-left {
    display: table-cell;
    width: 3%;
    font-weight: bold;
    font-size:400%;
    font-family: 'Georgia';
    position: absolute;
    top: 22px;
}

.pullQuote-center {    
  display: table-cell;    
  text-align: left;    
  width: 94%; 
  font-size:1.3em;
}
.magArticle-pullQuote__credit {
    color: #444;
    letter-spacing: 1px;
    text-align: left;
    font-weight: 600;
    font-size:1em;
    margin-top:15px;
}

@media (max-width: 767px) {
	.pullQuote-container      { padding: 0;	}
    .pullQuote-left           { font-size: 300%; left: 0;}
    .pullQuote-center         { width: 95%}
	.pullQuote-right          { top: 90%;}  
}