<style>
/*display when printing, but not on screen - used for accordion group headings*/
h2.screen-hide {display: block;}
.screen-hide {display: none;}

/*reduces heading size as a result of new VI*/
#examples h3 {
font-size: 22px;
margin-top: 0 !important;
}

#examples h4 {
font-size: 20px;
margin-top: 0 !important;
}

#examples h5 {
font-size: 18px;
margin-top: 0 !important;
}

/*adds border to examples so that indents are more obvious*/

.apa-indent div.gu8, .indent div.gu8, .leading-indent div.gu8 {
  margin-bottom: 12px;
  padding-left: 12px;
  border-left: 3px solid #d4d4d4;
}


/*removes standard grey shading on tab box*/
main div.tab.primary {background-color: transparent;}
    
/*removes standard padding on tab box*/
main div.tab.open {padding:0px;}

/*turns standard vertical tab navigation into button style*/
main .slab nav.local > ul li a, nav.tabs:not(.local) > ul > li > a {
-webkit-appearance: none;
    -webkit-font-smoothing: subpixel-antialiased;
    color: inherit;
    background-color: hsla(0, 68%, 100%, 1);
    text-decoration: none;
    padding: 7px 10px;
    display: block;
    -webkit-border-radius: 2px;
    -moz-border-radius: 2px;
    border-radius: 2px;
    margin: 0 0 0.5em 0;
    font-size: 15px;
    font-weight: 300;
    letter-spacing: 0.01em;
    box-sizing: border-box;
    border: 1px solid;
    border-color: inherit;
    line-height: 1.5;
    -webkit-transition: all 300ms ease-out;
    -moz-transition: all 300ms ease-out;
    -ms-transition: all 300ms ease-out;
    -o-transition: all 300ms ease-out;
    transition: all 300ms ease-out;
    overflow: hidden;
}

/*turns current button red*/
main .slab nav.local > ul li.current > a, nav.tabs:not(.local) > ul > li > a.active {
    background-color: /*hsla(0, 68%, 45%, 1)*/ hsla(355, 79%, 51%, 1.0);
    border-color: /*hsla(0, 68%, 45%, 1)*/ hsla(355, 79%, 51%, 1.0);
    color: hsla(0, 100%, 100%, 1);
    -webkit-box-shadow: 1px 1px 3px hsla(198, 0%, 20%, 0.3);
    box-shadow: 1px 1px 3px hsla(198, 0%, 20%, 0.3);
    font-weight:500;
}


main p.btn.tertiary a {
    border-color: hsla(0, 0%, 28%, 1);
    color: hsla(0, 0%, 28%, 1);
}

.accordion-button.active > p.btn.tertiary a {
        font-weight:500;
}

/*modifies accordion styles for transcripts to use plus and minus*/
div.transcript p.btn.expand a:after {content: "\f055";}
div.transcript p.btn.contract a:after {content: "\f056";}
div.transcript p.btn a, div.transcript p.btn a:hover, div.transcript p.btn a:active {
    border: none; 
    box-shadow: none; 
    background-color: transparent; 
    color: hsla(0, 0%, 0%, 1); 
    text-align:left;}
    
div.transcript p.btn a:hover {    
     color: /*hsla(0, 68%, 45%, 1)*/ hsla(355, 79%, 51%, 1.0);
}

/*adds the > symbol after the content type buttons*/
main .slab nav.local > ul li.current > a:after {
    font-family: "FontAwesome";
    font-weight: 900;
    content: "\f054";
    font-size: 0.95em;
    margin-left: 5px;
    vertical-align: middle;
    line-height: 1;
}

.slab.pageinfo h1 { 

    display: none;

}

main .banner__anchor-links ul {
    margin:0;
}

main .banner__anchor-links li {
    background-color: #fff;
    font-weight: bold;
    margin-bottom: 2px;
    padding:0;
}
main .banner__anchor-links li::before {
    content"";
    display:none;
}

main .banner__anchor-links li a {
    width: 100%;
    height: 100%;
    display: block;
   padding: 10px; 
}

    
main .banner__anchor-links li:hover {
    background-color: #e51f30;
}

main .banner__anchor-links ul li a::before {
    /*content: "\f054";*/
    content: "\f078";
    color: #e51f30;
    font-size: 0.8em;
    margin-left: 0.5em;
    margin-right: 0.5em;
    font-family: "FontAwesome";
    text-decoration:none !important;
}

main .banner__anchor-links li:hover a::before, main .banner__anchor-links li:hover a  {
    color: #fff;
}

.banner__anchor-links a {
    text-decoration:none;
    border:0;
    font-size:0.9em;
}

/*styling for tooltips NOT IN USE

a.tooltip {
    font-weight: 300;
    border:none;
}

a.tooltip:hover {
    cursor: pointer;
    font-weight: 400;
    color: hsla(0, 0%, 0%, 1);
}

a.tooltip.green:hover {
   background-color: #ccefe9;
}

a.tooltip.yellow:hover {
   background-color: #fff3cf;
}

a.tooltip.purple:hover {
   background-color: #d6ccf2;
}

a.tooltip.peach:hover {
   background-color: #ffe7db;
}

a.tooltip.pink:hover {
   background-color: #f8d3d8;
}

a.tooltip.blue:hover {
   background-color: #ccdbf5;
}
*/

/*improves URL overflow in Chrome*/
p {
  word-wrap: break-word;
}

figcaption {
font-weight: bold!important;
    font-size:smaller;
}

/*removes excess padding between images and figcaptions*/
.accordion-button img {margin-bottom:0;}

/*decreases standard table puff from 20 to 10px*/
main table.puff th {padding: 10px;}
main table.puff td {padding: 10px;}   

/*removes paragraph spacing for Chicago Notes & Bibliography*/
.condense p, p.condense {
margin-bottom: 0;
}

/*creates hanging indent for Chicago styles*/
.indent p, p.indent {
padding-left: 25px;
text-indent: -25px;
}

/*creates hanging indent and double spacing for APA style*/
.apa-indent p, p.apa-indent {
padding-left: 25px;
text-indent: -25px;
line-height: 3em;
margin-bottom: 0;
position:relative;
bottom:1em;
}

/*
.apa-indent h3, .apa-indent h4 {
line-height: 2.5em!important;
}
*/

/*creates double spacing for APA style*/
.dblspace p, p.dblspace {
margin-bottom: 0;
line-height: 3em;
}

/*creates leading indent for Chicago Notes & Bibliography style*/
.leading-indent p, p.leading-indent {
text-indent: 20px;
} 

/*inserts square brackets for IEEE style examples*/
.brackets ol {
  list-style:none;
  counter-reset: section;
}
.brackets ol li {
  counter-increment: section;
}

.brackets ol li:before {
  content: "[" counter(section) "]   ";
}

/*inserts hash in brackets for IEEE style format*/
.hash ol {
  list-style:none;
}

.hash ol li:before {
  content: "[#] ";
}

/*inserts hash with fullstop for Vancouver style format*/
.hashdot ol {
  list-style:none;
}

.hashdot ol li:before {
  content: "#. ";
}

/*apa long quote style blockquote*/
blockquote.apa {
    color: inherit!important;
    padding: 0 0.25em;
    font-family: inherit;
    font-weight: inherit;
    letter-spacing: inherit;
    font-size: inherit;
    line-height: inherit;
}

/*show Hotjar poll on screen*/
._hj-widget-container {display:block;}

@media print {
    /*display all tabs when printing the page*/
    main div.tab:not(.open) {visibility: visible; opacity:1; left:0; overflow:visible; max-height:none;} 
    main div.tab.open {padding: 0; margin-bottom: 0;} 
    /*display when printing, but not on screen - used for accordion group headings*/
    .screen-hide {display: block;}
    /*.p-hide should be used for hiding elements that don't make sense to print e.g. videos and quizzes*/
    /*prevents slabs from being split over a page*/
    .slab {break-inside:avoid;}
    /*hide Hotjar poll when printing*/
    ._hj-widget-container {display:none;}
}
</style>