mark { background-color: yellow; padding-left: 0px; padding-right: 0px; font-size: inherit;}
mark.bluemark { background-color: #51faff;}
mark.greenmark { background-color: #87fe6e;}
mark.redmark { background-color: #ffa0a0;}
textarea { white-space: nowrap;}

/*************************************************************************************************************/
/*************************************************************************************************************/

/*div.section { background-color: white; padding: 20px; border-radius: 3px; margin-top: 20px;  border-bottom: 1px solid #efefef; border-top: 1px solid #efefef;}*/
div.form-group { margin-bottom: 30px;}
.red { color: red}
.green { color: #04ce55}
.blue { color: #00a1ff}

dialog
{
    padding: 20px;
    border: 0;
    border-radius: 10px;
    top: 50%;
    left: 50%;
    translate: -50% -50%;
}

dialog::backdrop {
  background: rgba(0, 0, 0, 0.6);
}

.scrollable-content {scrollbar-width: none; overflow-y: scroll;}
.scrollable-content::-webkit-scrollbar {display: none;}
.stickyendofpage { position: fixed; bottom: 20px; z-index: 99999; margin: 0; text-align: center; width: 100%;}

/*************************************************************************************************************/
/*************************************************************************************************************/

div.content { padding-bottom: 20px; padding-top: 1px; margin-bottom: 20px; background-color: white; margin-left: -20px; margin-right: -20px; padding-left: 20px; padding-right: 20px; }
div.content img {max-width: 100%;}
div.content > img {width: 100%;}
div.content > div {border: 1px solid transparent; }

div.content h1 { margin-top: 15px;}
div.content h2 { margin-top: 20px;}
div.content h3 { margin-top: 10px;}
div.content h4 { margin-top: 10px;}
div.content h5 { margin-top: 10px;}
div.content h6 { margin-top: 10px;}
div.content img { margin-top: 10px;}
div.content div { margin-top: 10px;}
div.content ul { margin-top: 10px;}

div.content ul {margin-left: 15px;}
div.content ol {margin-left: 15px;}

div.content ul.toplevel { list-style-type: none; margin-left: 0px; }
div.content ul.toplevel > li { border: 1px solid transparent; }

div.content div.info { clear: both; padding: 20px; padding-top: 12px; background-color: #d5eef7; border-radius: 3px; border-left: 10px solid #507dbe;}
div.content div.tip { clear: both; padding: 20px; padding-top: 12px; background-color: #f7f7d5; border-radius: 3px; border-left: 10px solid #ffbc00}
div.content div.warning { clear: both; padding: 20px; padding-top: 12px; background-color: #feecec; border-radius: 3px; border-left: 10px solid red}
div.content div.gray { clear: both; padding: 20px; padding-top: 12px; background-color: #efefef; border-radius: 3px; border-left: 10px solid #666}
div.content div.info mark, div.content div.tip mark, div.content div.warning mark, div.content div.gray mark { background-color: #fefefe;}

div.content blockqoute { margin-left: 50px !important; margin-right: 50px !important; display: block;  margin-top: 40px; margin-bottom: 40px; }
div.content blockqoute span { font-weight: normal; font-family: 'Serif' !important; font-size: 1.8rem; color: #1a2f4d; font-style: italic;}
div.content blockqoute span::before { content: "“"; font-size: 4rem; font-family: sans-serif; vertical-align: -20px; display: inline; padding-right: 5px; line-height: 1rem;}
div.content blockqoute span::after { content: "”"; font-size: 4rem; font-family: sans-serif; vertical-align: -20px; display: inline; padding-left: 5px;}

div.content table th { font-weight: bold; background-color:  #1a2f4d; color: white;}
div.content div#toc { padding: 20px; background-color: #eaf1f5;}
div.content div#toc ol {margin-left: 20px; margin-bottom: 0;}
div.content div#toc a { color: #333; text-decoration: underline;}

div.content ul.nobullets { list-style-type: none; margin-left: 0px;}
div.content ul.nobullets li { margin-bottom: 40px;}

div.content ul img { border: 0; }

div.content ul.smalllist {list-style-type: none; margin-left: 0px;}
div.content ul.smalllist > li {overflow: hidden; margin-bottom: 50px; overflow-x: visible;}
div.content ul.smalllist > li:last-child {overflow: hidden; margin-bottom: 0px; overflow-x: visible;}
div.content ul.smalllist > li > img {border-bottom: 10px solid white; margin-bottom: 0;}
div.content ul.smalllist > li > p {clear: right;}

div.content a {text-decoration: underline;}

/*************************************************************************************/
/*************************************************************************************/
/*************************************************************************************/

div.content div.sharepost {border-top: 1px solid #ccc; padding-top: 10px; margin-top: 20px;}
div.content div.sharepost span.sharebutton {display: inline-block; background-color: #0065ff; padding: 3px; border-radius: 5px; padding-left: 6px; padding-right: 12px; cursor: pointer;}
div.content div.sharepost span.earn { font-size: 14px; display: inline-block;  text-align: right; float: right; margin-top: -5px;}
div.content div.sharepost span.earn a { font-size: 14px; }
div.content div.sharepost span.earn img { height: 20px;margin-left: 5px; vertical-align: -6px; }
div.content div.sharepost span.monetizationenabled {  font-size: 12px; display: inline-block; text-align: right; font-weigsht: bold; float: right;}
div.content div.sharepost span.monetizationenabled img { height: 16px; vertical-align: -2px;}
div.content div.sharepost a { font-size: 12px; display: inline-block; font-weight: bold; text-underline-offset: 3px;}

/*************************************************************************************/
/*************************************************************************************/
/*************************************************************************************/

figcaption { font-style: italic; color: #666; font-size: 0.9rem;}

mark.light {-webkit-box-decoration-break: clone; -o-box-decoration-break: clone; box-decoration-break: clone; background-color: rgba(255,255,255,1); font-size: 1.4rem; line-height: 200%; font-weight: bold; } 
mark.dark {-webkit-box-decoration-break: clone; -o-box-decoration-break: clone; box-decoration-break: clone; background-color: rgba(0,0,0,1); font-size: 1.4rem; line-height: 200%; font-weight: bold; color: white; } 

.center { text-align: center; }
.right { text-align: right; }
.clear { clear: both !important; }
.shadowed {box-shadow: 0px 0px 30px #999 !important; margin-top: 30px !important; margin-bottom: 30px !important; }

div.adsense { padding-top: 10px; padding-bottom: 10px; background-color: transparent;}

.postblock { background-color: white; padding: 20px; margin-bottom: 50px;} 
body.posts { background-color: #999;}

/*************************************************************************************************************/
/*************************************************************************************************************/

div.__score div {text-align: center;}
div.__score div:first-child { font-size: 20px; font-weight: bold;}
div.__score div:nth-child(2) { font-size: 100px; background-color: #fffb7c;}
div.__score div:last-child { color: maroon;}

/*************************************************************************************************************/
/*************************************************************************************************************/

div#leftside {width: 100%; margin-bottom: 20px;   }
div#rightside {width: 100%; margin-bottom: 20px;  }

.pages select { display: inline-block; padding: 4px; margin-bottom: 5px; border: 1px solid #ccc; font-size: 11px; font-weight: bold; max-width: 170px;}
.pages select option { font-size: 12px; font-weight: bold;}

.scrollTrigger {background-color: #ddd; height: 5px; }

img.inverted {filter: invert(1);}
.specialbutton {border-radius: 30px; padding-left: 30px; padding-right: 30px; }


@media (min-width: 1000px) 
{ 	
		div#leftside {position: fixed; left: calc(50% - 490px); top: 50px; bottom: 50px; height: auto; width: 200px; margin-left: 0; margin-right: 0; margin-bottom: 0px; }
		div#rightside {position: fixed; right: calc(50% - 490px); top: 50px; bottom: 50px; height: auto; width: 200px; margin-left: 0; margin-right: 0; margin-bottom: 0px;}
}