@charset "utf-8";
header,footer,section,aside,nav,article{display:block}
@font-face {
font-family: 'Segoe Script';
src: url('segoe_script.woff2') format('woff2'), url('segoe_script.woff') format('woff'), url('segoe_script.ttf')  format('truetype');
}

/* Content */
#p_content h2{margin:.2em auto 1px 5%;font-size:19px;}
#p_content h3, #p_content .ch3{margin:12px auto 9px 20px;font-size:18px;letter-spacing:1px;text-decoration:underline;text-align:left}
#p_content h4{margin:1em auto 7px 10%;font-size:17px;text-decoration:underline;text-align:left}
#p_content h5{margin:.2em auto;text-align:center}

/*pages lists with content */
#p_content .article {margin:10px 0 16px 0;font-size:17px;padding:2px 1px 1px calc(4px + .2%);}
#p_content .article h3, #p_content .article h4{margin:5px auto 12px 32px;font-size:18px;letter-spacing:1px;text-decoration:none;}
#p_content .article h3 a, #p_content .article h4 a{border-bottom:2px solid #333;margin-left:-2px;padding:0 calc(28px + .2%) 0 11px;text-decoration:none;}
#p_content .article h4.islnk{
display:inline-block;
border-bottom:2px solid #333;
margin-left:30px;
padding:0 calc(28px + .2%) 0 11px;
}
#p_content .article div {padding:0 0 0 8px; font-style:oblique;}
#p_content .article:nth-child(odd) {background:#f3f4f9;}
#p_content .article:after {content:'';border-bottom:1px solid #333;display:block;height:8px;width:88%;}
#p_content .article:not(.p_txt) h3:before, #p_content .article:not(.p_txt) h4:before {content: '\272B';color:#0ba900; left:28px; margin:0; position:absolute; }
#p_content .article:hover{background:#ecfded;}
#p_content .p_txt {
background:#eff0fd;
border-radius:8px;
margin:12px .2%;
padding:1px 2px;
text-indent:25px;
}
/* end */

#p_content p{margin:7px 1px 4px 1px;}
#p_content ol{margin:2px auto 1em 20px;padding:1px 1px 1px 1.6em;line-height:115%;}
#p_content ol a{font-weight:600}
#p_content ul{margin:2px auto 2px 35px;padding:0;text-align:left;font-size:16px}
#p_content .ule, #p_content .ptul, #p_content ul.menu_pgl{list-style-type:none}
#p_content a:hover{background:yellow;text-decoration:none;font-style:italic;color:green}
#p_content #link_pn{position:relative;width:95%;margin:28px auto 10px auto;background-color:#d2d3fe;font-size:18px;font-weight:700;text-align:center;padding:3px;border-radius:.6em}
#p_content #link_pn a{background-color:#fbfcfe;padding:1px 3px;border-radius:.5em}
#p_content #link_pn a:hover{background-color:yellow;font-style:normal}
#p_content .imgs{margin-left:15%;cursor:pointer; max-width:85%;}
#p_content .imgbox{margin:1px auto 1px 11em;background-color:#fefeff;text-align:center;padding:.14em;cursor:pointer;}
#p_content .cnt { text-align:center;}
#p_content .pgs_description_list {
font-size:17px;
font-weight:700;
margin:15px 1px 5px calc(30px + 3%);
}
#p_content .pgs_description_list div {
font-style:italic;
font-weight:400;
}
#p_content .syntax{margin:8px 5px 9px calc(2% + 10px);background-color:#f0fef1;font-size:16px;font-weight:700;overflow:auto;word-wrap:break-word}
#p_content .ptxt{margin:7px auto 8px 8px;text-indent:20px;}
#p_content .note{margin:8px auto 8px 15px;border:1px solid #08fe08;background:#efeffe;padding:2px 3px;font-size:15px;text-indent:15px;font-style:oblique}
#p_content .code{max-height:500px;min-width:320px;margin:20px 5px 22px calc(2% + 10px);background:#fefee9;border:1px solid #bbb;font-size:15px;padding:2px 3px 6px 3px;color:#0101ff;overflow:auto;word-wrap:break-word}
#p_content .apare{margin:5px .5px 15px calc(3% + 13px);background:#fbfbcb;border:1px solid #bbbbfe;padding:5px 6px;color:#111}
#p_content pre.apare{overflow:auto;font-size:15px;}

/* All flex-box */
#p_content .flex_box{
clear:both;
display:flex;
align-items:center;
flex-wrap:wrap;
justify-content:space-around;
text-align:center;
}
#p_content .flex_box .flex_item{
margin:8px 3px;
}
#p_content .flex_box_col{
display:flex;
align-items:center;
flex-direction:column;
flex-wrap:wrap;
justify-content:space-around;
}
#p_content .flex_box_col .flex_item{
margin:8px auto;
}

/* Youtobe */
.youtube {
margin:8px auto 5px auto;
position:relative;
padding-bottom:12%;
padding-top:100px;
height:0;
overflow: auto; 
-webkit-overflow-scrolling:touch;
text-align:center;
width:99%;
max-width:600px;
min-width:300px;
min-height:205px;
}
.youtube iframe {
border:0;
display:block;
margin:0 auto;
position:absolute;
top:0;
left:0;
width:100%;
height:100%;
max-height:420px;
min-height:200px;
}
#p_content video {
position:relative;
display:block;
margin:8px auto;
max-height:480px;
max-width:700px;
width:99%;
}

/* Audio list page */
.audio {
display:block;
margin:15px auto 9px auto;
}
.mp3_li span {
font-weight:600;
margin:0 8px 0 0;
}
.mp3_li span:hover {
background-color:#d8f0d8;
}
.mp3_li li div {
font-style:oblique;
}
/* END */

/* FOR MPGal - Image Gallery */
.mpgal {
position:relative;
text-align:center;
}
.mpgal .mp_gallery {
position:relative;
margin:3px auto;
background:#fefeda;
border:1px solid #ccc;
border-radius:.4em;
padding:1px;
}
.mpgal >img {
margin:2px;
}
.mpgal >img:hover {
opacity:.5;
}
img.mpgal, .mpgal >img, .mp_gallery img {
cursor:pointer;
}
.mp_gallery .mp_capt, #mpgal .mp_capt {
margin:0;
background:#fbfbfb;
border-radius:.4em;
padding:0 2px;
font-family:'Calibri',sans-serif;
font-size:16px;
font-weight:600;
text-align:left;
}

/* modal box */
#mpgal {
position:fixed;
z-index:9990;
top:0;
left:0;
margin:0;
width:100%;
height:100%;
text-align:center;
padding:0
}
#mpgal #mpgal_transp {
display:block;
position:absolute;
top:0;
right:0;
bottom:0;
left:0;
width:100%;
height:100%;
background-color:#111;
opacity:.80;
}
#mpgal #mpgal_show {
position:relative;
z-index:9992;
margin:0 auto;
border:1px solid silver;
border-radius:6px;
padding:.1em;
}
#mpgal #mpgal_x {
position:absolute;
top:-0.7em;
right:0;
background-color:yellow;
border:2px solid red;
padding:0 .1em;
font-family:Arial;
font-size:1em;
font-weight:700;
color:red;
z-index:9999;
border-radius:.5em;
cursor:pointer;
}
#mpgal .mp_prev, #mpgal .mp_next {
position:absolute;
top:8%;
bottom:8%;
margin:0;
width:calc(12% + 25px);
opacity:.63;
border-radius:1em;
padding:calc(30% - 50px) 0 0 0;
font-weight:800;
font-size:0;
cursor:pointer;
}
#mpgal .mp_prev {
left:0;
}
#mpgal .mp_next {
right:0;
}
#mpgal .mp_prev:hover, #mpgal .mp_next:hover {
background:#eee;
font-size:58px;
}
/* END MPGal */

/* START Tabs elms */
.tab_lnk, .chapts_lnk {
background:#fefedf;
border-radius:8px;
}
.tab_lnk span, .chapts_lnk span{
color:#0000d0;
cursor:pointer;
margin:3px 7px;
text-decoration:underline;
}
.tab_lnk span:before, .chapts_lnk span:before{
content:'\2217';
font-weight:700;
}
.tab_lnk span:hover, .chapts_lnk span:hover{
background:#f8f800;
text-decoration:none;
}
.tabloc{
display:none;
}
.tabloc.tab_show{
display:block;
}
/* END */

/* Commons */
img {border:0;}
.cl_b {color:#0001fe; }
.cl_g {color:#00ce00; }
.cl_r {color:#fe0110; }
.cb, .sb {font-weight:700;}
.ci, .si {font-style:oblique;}
.cu, .su {text-decoration:underline;}
.cbi, .sbi {font-weight:700; font-style:oblique;}
.cbu, .sbu {font-weight:700; text-decoration:underline;}
.cbiu, .sbiu {font-weight:700; font-style:oblique; text-decoration:underline;}
.islnk, .link, .cl_bpu {color:#0000eb; cursor:pointer; text-decoration:underline;}
.islnk:hover, .link:hover{background:#efef00; text-decoration:none; color:#111;}
.hr3 {width:33%;}
.hr80 {width:80%;}
#p_content .cntr { display:block;margin:8px auto;text-align:center;}
#p_content .cnt_right {text-align:right; margin-right:3%;}
.clr {clear:both;}
.disp_n, div:empty{display:none;}

.handwr{
font-family:'Segoe Script',sans-serif;
}
#p_content .size17, #p_content .size20{
margin:8px auto;
text-indent:40px;
}
#p_content .size17{
font-size:17px !important;
}
#p_content .size20{
font-size:20px !important;
}
#p_content .size28{
font-size:28px !important;
}