.content {  /* These are technically the same, but use both */
  overflow-wrap: normal;
  word-wrap: normal;

  -ms-word-break: keep-all;
  /* This is the dangerous one in WebKit, as it breaks things wherever */
  word-break: keep-all;
  /* Instead use this non-standard one: */
  word-break: keep-all;

  /* Adds a hyphen where the word breaks, if supported (No Blink) */
  -ms-hyphens: manual;
  -moz-hyphens: manual;
  -webkit-hyphens: manual;
  hyphens: manual;}

h2 {clear:both; border-bottom:1px solid rgba(0,0,0,0.1); padding-bottom:20px; margin-top:30px; font-size:30px; font-family:'Muli', Arial, Helvetica, sans-serif; line-height: 125%; margin-bottom:15px; font-weight:500;}
.pagecontent h2 {clear:initial;}

.content h3 {font-size:25px; font-family:'Muli', Arial, Helvetica, sans-serif; line-height: 125%; margin:30px 0 10px 0; font-weight:normal; text-transform:none;}
.content h4 {font-size:20px; font-family:'Muli', Arial, Helvetica, sans-serif; line-height: 125%; margin:30px 0 10px 0; font-weight:normal;}
.content h5 {font-size:16px; font-family:'Muli', Arial, Helvetica, sans-serif; line-height: 125%; margin:20px 0 10px 0; font-weight:normal; text-transform:uppercase;}

.card h5 {text-transform: none;}

.content p {font-size:20px; margin-bottom:20px; color:#333; line-height: 1.55; letter-spacing: 0.01em;}
.content .ckeditor-html5-audio {margin-bottom:20px;}
.content hr {margin:30px 0;}

.content iframe {width:100%;}
@media ( min-width: 1200px ){
  .content iframe {height:392px;}
}
@media ( max-width: 622px ){
  .content iframe {height:51vw;}
}

.content ul {margin-bottom:30px; list-style:square; margin-left:40px;}
.content ul li {font-size:18px;}

.content p.author {font-family:'Muli', Arial, Helvetica, sans-serif; font-size:18px; color:#999;}
.content p.author a {color:#999; text-decoration: none;}
.content p.author span {opacity:0.3; margin:auto 10px;}
.content p.author em {text-transform:uppercase; font-style: normal;}

.content sup { vertical-align: middle; top:0; font-size: 0.6em; }

/*
.content .articleabstract {font-style: italic; font-size:18px;}
*/
.content .articleabstract {padding-top:5px; font-style:normal; font-size:20px; border-bottom:1px solid #eee; padding-bottom:20px; line-height:1.5em; font-family:'Muli', Arial, Helvetica, sans-serif;}
/* Amiri font has backwards exclamation points in italics */
.content em .bang {transform:scaleX(-1) translateX(1px); display: inline-block;}
.content .articlecontext {font-style: normal; font-size:18px; font-family:'Muli', Arial, Helvetica, sans-serif;}
.content .articleissue {font-style: normal; font-size:18px; font-family:'Muli', Arial, Helvetica, sans-serif; color:#999;}
.content .articletail {border-top:1px solid #eee; padding-top:20px; font-family:'Muli', Arial, Helvetica, sans-serif; font-size:15px; color:#666;}

.content blockquote {margin:20px 0 20px 20px; border-left:5px solid #ccc; padding:10px 20px;}
.content blockquote p {font-style: italic;}
.content blockquote p:first-child {margin-top:0;}
.content blockquote p:last-child {margin-bottom:0;}

@media (max-width: 700px) {

h2 {font-size:22px;}
.content p {font-size:16px;}
.content .articleabstract {font-size:18px; margin-top:30px;}
.content .articlecontext {font-size:14px;}
.content p.author {font-size:14px;}
.content ul li {font-size:16px;}
.articleleftsidebar .socialheading {display:none;}
.articleleftsidebar .socialshare {display:none;}

}