/* MOBILE STYLING */

@media screen and (max-width: 991px) {

/*header*/
.mobile-row-gap{
   row-gap: 1rem !important;
}

hr {
    margin: 0 0 0.5rem 0 !important;
}


/*table styling */


figure.wp-block-table, table, table * {
    max-width: 100% !important;
 }

 .entry-content table{
    table-layout:fixed !important;
    width:100% !important;
    overflow-x:scroll !important;
 }


 td, th {
    white-space: normal !important;
    word-wrap: break-word !important;
}



/*page headers */

#page-wrapper {
    padding-top: calc(4*var(--spacer)) !important;
}

h3.tag-name,
h3.tag-name * {
    font-size: 2.1875rem !important;
}

.tag-container img {
    padding-bottom: 1rem !important;
}



/* template-part: post-meta.php */
   
    p.meta-mobile,
    p.meta-mobile *,
    .meta-mobile {
        font-size:0.75rem !important;
    }


div.page-description-header{
    margin-bottom: 4rem !important;
}

/* hide the styling on series page for listed posts*/
.category-name, .border-bottom-dotted{
    display:none;
}

/*sources card*/

.sources-post {
    max-width: 100%;
    grid-column: span 12 !important;
}


h3.post-title,
h3.post-title *{
    font-size: 2.1875rem !important;
    line-height: 2.1rem !important;
}


 /* longform/shortform block*/
    .max-height-90 {
        max-height: 75vh;
    }

    div.column-fade-footer{
        width:100vw;
    }

    .longform-shortform-block h3 {
    font-size: 2.1875rem !important;
    line-height: 2.1rem !important;
    }

/* featured-post-block*/
  .featured-post-block .featured-image {
      order: -1;
  }

  .featured-image{
      padding-bottom: 65% !important;
  }

 

/*newsletter-signup form */
.newsletter-signup{
    padding:1rem;
}

div.newsletter-signup div{
    display:block;
}


 /*single*/

 .single-featured-image img{
    max-width: 90vw;
    height: auto;
 }

 #further-reading-popup-id {
    display: none !important;
 }
  
 .further-reading-container .mobile-flex{
     grid-row-gap: calc(2*var(--spacer));
 }

.further-reading-title.mobile-flex,
.further-reading-title.mobile-flex *{
    display: inline !important;
}


.further-reading-series .icon {
    padding-bottom: 0 !important;
}

.further-reading-container.further-reading-series {
    margin-bottom: calc(4*var(--spacer)) !important;
}




/*single footnotes*/

div.footnotes hr {
    color: var(--black);
    margin: calc(2*var(--spacer)) 0 0 0;
}

#footnote-box{
    display:none !important;
}

div.footnotes ol li {
    margin-bottom: var(--spacer) !important;
}

/*single tags*/

.post-tags.mobile-flex{
    display:inline-block !important;
}

.post-tags li {
    margin: 0 !important;
}




/*footer styling*/

#footer li *,
#footer li {
    font-size: 1rem !important;
 
}

#footer .top-half {
    order:1;
}

#footer .footer-logo{
    order:3;
}

#footer .footer-subscribe-form{
    order:2;
}

#footer ul#footer-menu-list li{
    padding-bottom: 0.5rem !important;
    
}

img.footer-logo{
    height: 6rem !important;
    width: auto !important;
}






/*

                                                dddddddd            dddddddd                                             
                                                 d::::::d            d::::::d  iiii                                       
                                                 d::::::d            d::::::d i::::i                                      
                                                 d::::::d            d::::::d  iiii                                       
                                                 d:::::d             d:::::d                                              
ppppp   ppppppppp     aaaaaaaaaaaaa      ddddddddd:::::d     ddddddddd:::::d iiiiiiinnnn  nnnnnnnn       ggggggggg   ggggg
p::::ppp:::::::::p    a::::::::::::a   dd::::::::::::::d   dd::::::::::::::d i:::::in:::nn::::::::nn    g:::::::::ggg::::g
p:::::::::::::::::p   aaaaaaaaa:::::a d::::::::::::::::d  d::::::::::::::::d  i::::in::::::::::::::nn  g:::::::::::::::::g
pp::::::ppppp::::::p           a::::ad:::::::ddddd:::::d d:::::::ddddd:::::d  i::::inn:::::::::::::::ng::::::ggggg::::::gg
 p:::::p     p:::::p    aaaaaaa:::::ad::::::d    d:::::d d::::::d    d:::::d  i::::i  n:::::nnnn:::::ng:::::g     g:::::g 
 p:::::p     p:::::p  aa::::::::::::ad:::::d     d:::::d d:::::d     d:::::d  i::::i  n::::n    n::::ng:::::g     g:::::g 
 p:::::p     p:::::p a::::aaaa::::::ad:::::d     d:::::d d:::::d     d:::::d  i::::i  n::::n    n::::ng:::::g     g:::::g 
 p:::::p    p::::::pa::::a    a:::::ad:::::d     d:::::d d:::::d     d:::::d  i::::i  n::::n    n::::ng::::::g    g:::::g 
 p:::::ppppp:::::::pa::::a    a:::::ad::::::ddddd::::::ddd::::::ddddd::::::ddi::::::i n::::n    n::::ng:::::::ggggg:::::g 
 p::::::::::::::::p a:::::aaaa::::::a d:::::::::::::::::d d:::::::::::::::::di::::::i n::::n    n::::n g::::::::::::::::g 
 p::::::::::::::pp   a::::::::::aa:::a d:::::::::ddd::::d  d:::::::::ddd::::di::::::i n::::n    n::::n  gg::::::::::::::g 
 p::::::pppppppp      aaaaaaaaaa  aaaa  ddddddddd   ddddd   ddddddddd   dddddiiiiiiii nnnnnn    nnnnnn    gggggggg::::::g 
 p:::::p                                                                                                          g:::::g 
 p:::::p                                                                                              gggggg      g:::::g 
p:::::::p                                                                                             g:::::gg   gg:::::g 
p:::::::p                                                                                              g::::::ggg:::::::g 
p:::::::p                                                                                               gg:::::::::::::g  
ppppppppp                                                                                                 ggg::::::ggg    
                                                                                                             gggggg       

Padding

*/




/*UTILITY*/

.px-2{
    padding-left: 1rem;
    padding-right: 1rem;
}

.pr-2{
    padding-right:1rem;
}

.pl-2{
    padding-left:1rem;
}

.pt-2 {
    padding-top: 1rem;
}

.pb-2 {
    padding-bottom: 1rem;
}

.py-2 {
    padding-top: 1rem;
    padding-bottom: 1rem;
}



.pr-4{
    padding-right:1rem;
}

.pl-4{
    padding-left: 1rem;
}

.pt-4 {
    padding-top: 1rem;
}

.pb-4 {
    padding-bottom: 1rem;
}

.py-4 {
    padding-top: 1rem;
    padding-bottom: 1rem;
}


/*

                                                                                   iiii                                    
                                                                                  i::::i                                   
                                                                                   iiii                                    
                                                                                                                           
   mmmmmmm    mmmmmmm     aaaaaaaaaaaaa  rrrrr   rrrrrrrrr      ggggggggg   gggggiiiiiiinnnn  nnnnnnnn        ssssssssss   
 mm:::::::m  m:::::::mm   a::::::::::::a r::::rrr:::::::::r    g:::::::::ggg::::gi:::::in:::nn::::::::nn    ss::::::::::s  
m::::::::::mm::::::::::m  aaaaaaaaa:::::ar:::::::::::::::::r  g:::::::::::::::::g i::::in::::::::::::::nn ss:::::::::::::s 
m::::::::::::::::::::::m           a::::arr::::::rrrrr::::::rg::::::ggggg::::::gg i::::inn:::::::::::::::ns::::::ssss:::::s
m:::::mmm::::::mmm:::::m    aaaaaaa:::::a r:::::r     r:::::rg:::::g     g:::::g  i::::i  n:::::nnnn:::::n s:::::s  ssssss 
m::::m   m::::m   m::::m  aa::::::::::::a r:::::r     rrrrrrrg:::::g     g:::::g  i::::i  n::::n    n::::n   s::::::s      
m::::m   m::::m   m::::m a::::aaaa::::::a r:::::r            g:::::g     g:::::g  i::::i  n::::n    n::::n      s::::::s   
m::::m   m::::m   m::::ma::::a    a:::::a r:::::r            g::::::g    g:::::g  i::::i  n::::n    n::::nssssss   s:::::s 
m::::m   m::::m   m::::ma::::a    a:::::a r:::::r            g:::::::ggggg:::::g i::::::i n::::n    n::::ns:::::ssss::::::s
m::::m   m::::m   m::::ma:::::aaaa::::::a r:::::r             g::::::::::::::::g i::::::i n::::n    n::::ns::::::::::::::s 
m::::m   m::::m   m::::m a::::::::::aa:::ar:::::r              gg::::::::::::::g i::::::i n::::n    n::::n s:::::::::::ss  
mmmmmm   mmmmmm   mmmmmm  aaaaaaaaaa  aaaarrrrrrr                gggggggg::::::g iiiiiiii nnnnnn    nnnnnn  sssssssssss    
                                                                         g:::::g                                           
                                                             gggggg      g:::::g                                           
                                                             g:::::gg   gg:::::g                                           
                                                              g::::::ggg:::::::g                                           
                                                               gg:::::::::::::g                                            
                                                                 ggg::::::ggg                                              
                                                                    gggggg                                                 

Margins

*/

.mr-lg-4,
.ml-lg-4{
    margin-right:0 !important;
    margin-left:0 !important;
}


.ml-2 {
    margin-left: 1rem !important;
}

.mr-2 {
    margin-right: 1rem !important;
}

.mx-2 {
    margin-left: 1rem !important;
    margin-right: 1rem !important;
}

.mt-2 {
    margin-top: 1rem !important;
}

.mb-2 {
    margin-bottom: 1rem !important;
}

.my-2 {
    margin-top: 1rem !important;
    margin-bottom: 1rem !important;
}

.ml-2 {
    margin-left: 1rem !important;
}



.ml-3 {
    margin-left: 1rem !important;
}

.mr-3 {
    margin-right: 1rem !important;
}

.mx-3 {
    margin-left: 1rem !important;
    margin-right: 1rem !important;
}

.mt-3 {
    margin-top: 1rem !important;
}

.mb-3 {
    margin-bottom: 1rem !important;
}

.my-3 {
    margin-top: 1rem !important;
    margin-bottom: 1rem !important;
}


.mr-4 {
    margin-right: 2rem !important;
}

.mx-4 {
    margin-left: 2rem !important;
    margin-right: 2rem !important;
}

.mt-4 {
    margin-top: 2rem !important;
}

.mb-4 {
    margin-bottom: 2rem !important;
}

.my-4 {
    margin-top: 2rem !important;
    margin-bottom: 2rem !important;
}

.mb-10 {
    margin-bottom: 4rem !important;
}

.mx-n2 {
    margin-right: -1rem !important;
    margin-left: -1rem !important;
}


/*flexbox width replicating 12-column grid widths*/

.col-1, .col-2, .col-3, .col-4, .col-5, .col-6, .col-7, .col-8, .col-9, .col-10, .col-11, .col-12{
    width: 100% !important;
}


.mobile-flex{
    display: grid;
}

.standard-post {
    grid-column: span 12 !important;
}

.grid-gap {
    grid-row-gap: calc(2*var(--spacer));
}


.mobile-spacer{
    margin-bottom: var(--spacer);
}

.mobile-double-spacer{
    margin-bottom: calc(2*var(--spacer));
}


 }



 
/*
                                                                    
                                                       dddddddd     
  iiii  PPPPPPPPPPPPPPPPP                              d::::::d     
 i::::i P::::::::::::::::P                             d::::::d     
  iiii  P::::::PPPPPP:::::P                            d::::::d     
        PP:::::P     P:::::P                           d:::::d      
iiiiiii   P::::P     P:::::Paaaaaaaaaaaaa      ddddddddd:::::d      
i:::::i   P::::P     P:::::Pa::::::::::::a   dd::::::::::::::d      
 i::::i   P::::PPPPPP:::::P aaaaaaaaa:::::a d::::::::::::::::d      
 i::::i   P:::::::::::::PP           a::::ad:::::::ddddd:::::d      
 i::::i   P::::PPPPPPPPP      aaaaaaa:::::ad::::::d    d:::::d      
 i::::i   P::::P            aa::::::::::::ad:::::d     d:::::d      
 i::::i   P::::P           a::::aaaa::::::ad:::::d     d:::::d      
 i::::i   P::::P          a::::a    a:::::ad:::::d     d:::::d      
i::::::iPP::::::PP        a::::a    a:::::ad::::::ddddd::::::dd     
i::::::iP::::::::P        a:::::aaaa::::::a d:::::::::::::::::d     
i::::::iP::::::::P         a::::::::::aa:::a d:::::::::ddd::::d     
iiiiiiiiPPPPPPPPPP          aaaaaaaaaa  aaaa  ddddddddd   ddddd     
                                                                    
                                                                    
                                                                    
                                                                    
                                                                    
                                                                    
                                                                    /*

/* ----------- iPad Pro ----------- */
/* Portrait and Landscape */
/* Portrait*/
@media only screen and (device-width: 1024px) and (device-height: 1366px) {

    /*utility*/
    .mr-lg-4 {
        margin-right: var(--spacer) !important;
    }

    .ml-lg-4 {
        margin-left: var(--spacer) !important;
    }

    /*header*/

    #site-header #primary-menu-list.active{
        margin-right: 12vw !important;
    }


    /*longform shortform */
    .longform-shortform-block h3 {
        font-size: 2.75rem !important;
        }

    .longform-shortform-block > .d-flex.flex-row.mobile-flex{
        width: 100%;
     justify-content: space-between;
    }

    .longform-shortform-block .column-fade-container.col-5{

        width: 50% !important;
    }
 
    
    /*single*/

    .single-featured-image img{
        max-width: 94vw;
        height: auto;
     }
      
    .entry-content{
        width: calc((100% / 12)*10) !important;
    }

    /*sources*/
    .sources-post {
        grid-column: span 6 !important;
    }

    div.page-description-header{
        justify-content: space-between;
        margin: 0 !important;
        margin-right: 0 !important;
        width: 100%;
    }

    div.page-description-header > .col-7{
        margin-right:0 !important;
    }

    /* hide the styling on series page for listed posts*/
    .category-name, .border-bottom-dotted, .count-articles{
    display:none !important;
    }

  

    .listed-articles{
     flex-grow: 1;
    margin-right: 0 !important;
    }

    /*footer*/

    #footer div.flex-column{
        column-gap:1rem;
    }

}

@media only screen and (device-width: 768px) and (device-height: 1024px) {

    /*iPad rescale header icons */

    div.site-logo a, div.site-logo a * {
        font-size: 2rem !important;
        
    }

    .search-field{
    background-size: 12px 12px !important;
    padding: 0 0 0 12px !important;
    margin: 0.5rem 0.5rem 0 0 !important;
    }

    input::placeholder {
        font-size: 1rem !important;
    }

      /*utility*/
      .mr-lg-4 {
        margin-right: calc(2*var(--spacer)) !important;
    }

    .ml-lg-4 {
        margin-left: calc(2*var(--spacer)) !important;
    }

     /*longform shortform */
     .longform-shortform-block h3 {
        font-size: 2.1875rem !important;
        }

    .longform-shortform-block > .d-flex.flex-row.mobile-flex{
        width: 100%;
     justify-content: space-between;
    }

    .longform-shortform-block .column-fade-container.col-5{

        width: 50% !important;
    }
 
    
    /*single*/

    .single-featured-image img{
        max-width: 94vw;
        height: auto;
     }
      
    .entry-content{
        width: calc((100% / 12)*10) !important;
    }

    /*sources*/
    .sources-post {
        grid-column: span 6 !important;
    }

    h3.post-title,
    h3.post-title *,
    h3.page-title,
    h3.page-title *{
    font-size: 2.1875rem !important;
    line-height: 2.1rem !important;
}

    div.page-description-header{
        justify-content: space-between;
        margin: 0 !important;
        margin-right: 0 !important;
        width: 100%;
    }

    div.page-description-header > .col-7{
        margin-right:0 !important;
    }

     /* hide the styling on series page for listed posts*/
     .category-name, .border-bottom-dotted, .count-articles{
        display:none !important;
        }

    .listed-articles{
     flex-grow: 1;
    margin-right: 0 !important;
    }

    /*footer*/

    #footer div.flex-column{
        column-gap:1rem;
    }



/*footer styling*/

#footer li *,
#footer li {
    font-size: 1rem !important;
 
}

#footer .top-half {
    order:1;
}

#footer .footer-logo{
    order:3;
}

#footer .footer-subscribe-form{
    order:2;
}

#footer ul#footer-menu-list li{
    padding-bottom: 0.5rem !important;
    
}

#footer .flex-row-lg {
    flex-direction: column !important;
}

#footer .top-half{
    width: 50% !important;
}

#footer div.site-logo {
    margin: 2rem 0 !important;
}




}