.pagecontent body{ /*should same as parent body!*/
font-family: sans-serif, Arial, Verdana, "Trebuchet MS";
font-size: 13px;
color: #000;
}
.cke_editable{
font-size: 13px;
line-height: 1.6;
}
.pagecontent {
position:relative;
text-align: justify;
padding:20px;
-webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box; /*fix extra padding-width*/   
width:100%;
line-height:25px;
overflow:hidden;
}
.pagecontent ul{
margin-left:15px;
}
.pagecontent ul li{
position:relative;
padding:10px 0 10px 25px;	
}
.pagecontent ul li:before{
content:'\f35a';
font-family:"Font Awesome 5 Free";
position:absolute;
left:0px;
}
.pagecontent ol{
margin-left:15px;
list-style:none;
counter-reset: counter;
}
.pagecontent ol li{
counter-increment: counter;
position:relative;
padding:10px 0 10px 25px;	
}
.pagecontent ol li:before{
content: counter(counter);
position:absolute;
font-size:80%;
border:1px solid #AAA;
border-radius:50%;
width:2ch;height:2ch;
left:0;top:14px;
padding:0px;
line-height:2ch;
text-align:center;
}
.pagecontent blockquote{
font-style: italic;
font-family: Georgia, Times, "Times New Roman", serif;
padding: 2px 0;
border-style: solid;
border-color: #ccc;
border-width: 0;
padding-left: 20px;
padding-right: 8px;
border-left-width: 5px;
}
.pagecontent h1,.pagecontent h2,.pagecontent h3,.pagecontent h4,.pagecontent h5,.pagecontent h6{
font-weight: normal;
line-height: 1.2;
}
.pagecontent hr{
border: 0px;
border-top: 1px solid #ccc;
}
.pagecontent img.right{
border: 1px solid #ccc;
float: right;
margin-left: 15px;
padding: 5px;
}
.pagecontent img.left{
border: 1px solid #ccc;
float: left;
margin-right: 15px;
padding: 5px;
}
.pagecontent pre{
white-space: pre-wrap; /* CSS 2.1 */
word-wrap: break-word; /* IE7 */
-moz-tab-size: 4;
-o-tab-size: 4;
-webkit-tab-size: 4;
tab-size: 4;
}
.pagecontent .marker{
background-color: Yellow;
}
.pagecontent span[lang]{
font-style: italic;
}
.pagecontent figure{
text-align: center;
border: solid 1px #ccc;
border-radius: 2px;
background: rgba(0,0,0,0.05);
padding: 10px;
margin: 10px 20px;
display: inline-block;
}
.pagecontent figure > figcaption{
text-align: center;
display: block; /* For IE8 */
}
.pagecontent a > img {
padding: 1px;
margin: 1px;
border: none;
outline: 1px solid #0782C1;
}
.pagecontent a.download{
display:inline-block;
text-align:left;
background:url(imgs/download.png) no-repeat left 3px;
padding-left:15px;
}
.pagecontent .info-box-small{
float:right;
width:150px;
background:#EEE;
padding:10px;
margin:10px;
border:1px solid #CCC;
}
.pagecontent .info-box-large{
float:right;
width:225px;
background:#EEE;
padding:10px;
margin:10px;
border:1px solid #CCC;
}
.pagecontent .lined-list li{
padding:10px 0px;
margin:10px 0px;
border-bottom:1px dotted #AAA;
}
.pagecontent h2 {
}
.pagecontent h3 {
}
.pagecontent h4 {
}
.pageconent .boxGreyBlock{
display:block;
padding: '5px 10px';
background: '#eee';
border: '1px solid #ccc';
}
.pagecontent table,.pagecontent tbody{
border-color:#EDEDED;
}
.pagecontent td{
padding:10px;
border-color:#BBB;
text-align:left;
}
.pagecontent img.right
{
border: 1px solid #ccc;
float: right;
margin-left: 15px;
padding: 5px;
}
.pagecontent img.left
{
border: 1px solid #ccc;
float: left;
margin-right: 15px;
padding: 5px;
}
.pagecontent pre
{
white-space: pre-wrap; /* CSS 2.1 */
word-wrap: break-word; /* IE7 */
-moz-tab-size: 4;
-o-tab-size: 4;
-webkit-tab-size: 4;
tab-size: 4;
}
.pagecontent .marker
{
background-color: Yellow;
}
.pagecontent span[lang]{
font-style: italic;
}
.pagecontent figure{
text-align: center;
border: solid 1px #ccc;
border-radius: 2px;
background: rgba(0,0,0,0.05);
padding: 10px;
margin: 10px 20px;
display: inline-block;
}
.pagecontent figure > figcaption{
text-align: center;
display: block; /* For IE8 */
}
.pagecontent a > img {
padding: 1px;
margin: 1px;
border: none;
outline: 1px solid #CCC;
}
.pagecontent table.fluid{
width:100%;
}
.pagecontent table.fluid tr td{
vertical-align:top;
padding:10px;
}
.pagecontent .updated-date{
display:block;
width:250px;
margin-top:20px;
padding-top:20px;
border-top:1px solid #EEE;
}
#content-more{
padding:5px 0;
}
#content-more>div{
background:#EFEFEF;
padding:10px;
}
#content-more ul{
display:flex;
flex-wrap:wrap;
justify-content:center;
}
#content-more li{
flex-basis:25%;
padding:2vmax;
margin:1vmax;
background:#FFF;
}
#content-more li img{
max-height:15vmax;
height:auto;
width:100%;
object-fit:cover;
}
#content-more li b{
display:block;
}
#content-more li span{
font-size:80%;
}
#content-more a{
display:block;
color:#555;
}
#content-more a:hover{
color:#000;
}
#content-more .more{
text-align:right;
}
#content-more li:before{
display:none;
content:'';
}

@media screen and (max-device-width:650px){ /* phone */
.pagecontent {
padding:10px;
}
.pagecontent ol,.pagecontent ul,.pagecontent dl{
padding: 0 15px;
}
.pagecontent ul{
margin-left:10px;
}
.pagecontent .overflow{
position:static;overflow:auto;
}
.pagecontent .overflow .signal{
position:absolute;z-index:9555;right:0;background:url(imgs/more_arrow.gif) no-repeat;width:25px;height:25px;
}
.pagecontent table.fluid tr,
.pagecontent table.fluid tr td,
.pagecontent table.fluid tr td{
display:block;
}
#content-more ul{
flex-direction:column;
margin:0;
padding:0;
}
}