/* mobile dev. */
@media screen and (max-width: 640px){

html {margin:0;}
body {margin:0; padding-left:26px;}
@keyframes slide_top {
0% { margin-top:100px; }
100% { margin-top:0; }
}

/* Header */
#header{
background-color:#ececfd;
background-image:none;
border:none;
border-bottom:1px solid #dfdffe;
box-shadow:none;
border-radius:.2em;
height:0; /* 42px */
margin:1px -3px 0 -25px;
max-width:none;
position:relative;
width:auto;
}
h1 {
position:absolute;
top:100px; /*150px*/
left:28px;
right:0;
margin:0 auto;
font-size:17px;
}
#title_ctg {
display:none;
}
/* End Header */

/* Menu Top */
#menu_top {
background-image: -ms-linear-gradient(top, #fbfbfe, #e2e3fe);
background-image:-moz-linear-gradient(top, #fbfbfe, #e2e3fe);
background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0, #fbfbfe), color-stop(1, #e2e3fe));
background-image: -o-linear-gradient(top, #fbfbfe, #e2e3fe);
background: linear-gradient(top, #fbfbfe, #e2e3fe);
font-size:14px;
line-height:175%;
height:100%;
left:0;
margin:-2px auto -1px auto;
padding:0;
right:0;
text-align:center;
top:0;
}
#menu_top a { margin:2px;padding:0 2px;text-decoration:none;color:#fff;}
#menu_top a:hover { background:yellow;text-decoration:underline;color:#0408fe; }
/* End */

/* Side Menu */
#menu_side {
border-radius:5px;
left:0;
top:1px; /* 1px */
background:#bedacf;
padding:3px;
position:fixed;
z-index:8888;
width:auto;
max-width:245px;
}
#menu_side .menu_s{
height:auto;
margin-bottom:0;
overflow-y:auto;
}
#menu_side .menu_s:after{
display:none;
}
#menu_side #tlmenu  {
background-color:transparent;
box-shadow:none;
background:none;
font-size:21px;
line-height:85%;
width:22px;
margin:0;
padding:2ppx 0 1px 0;
}
#menu_side #menu_lists {
margin-top:100px;
min-width:150px;
max-width:280px;
}
#menu_side ul {
background:none;
}
#menu_side ul li {
margin:2px auto;
background:#e0e0fb;
padding-bottom:1px;
padding-left:1px;
}
#menu_side.visible #menu_lists{display:block;margin-top:0;}
#menu_side:not(.visible):hover #menu_lists {
display:block;
margin-top:0;
top:0;
animation-name:slide_top;
animation-duration:3.1s;
animation-timing-function:ease-in-out;
animation-delay:0s;
animation-fill-mode:forwards;
}
#menu_side #menu_lists, #menu_side #cls_menu_s, #menu_side .lnk_adv, #menu_side.visible #tlmenu, #menu_side.visible h4 { display:none;}
#menu_side.visible #menu_lists, #menu_side.visible #cls_menu_s { display:block;}
#menu_side #cls_menu_s{
background:#ebeb00;
border-bottom-right-radius:14px;
border-top-right-radius:14px;
color:#e00000;
cursor:pointer;
font-weight:800;
font-size:17px;
margin:0 auto;
padding:0 1px 0 0;
position:absolute;
right:-17px;
top:30px;
width:18px;
z-index:9999;
}
#menu_side #cls_menu_s:hover{
background:transparent;
color:transparent;
}
/* End */

/* Search form */
#src_form {
position:absolute;
bottom:-180px; /*-160px*/
left:0;
top:auto;
background: url('../../imgs/search.png');
width:24px;
height:25px;
}
#src_form:hover{
background:transparent;
height:80px;
height:auto;
width:auto;
}
#src_form:hover  #search, #search:hover{
display:block;
}
#search{
bottom:auto;
display:none;
position:relative;
width:70%;
z-index:8888;
}
#search #inpsrc {
margin:0;
padding:0 16px 1px 1px;
width:calc(99% - 18px);
}
#search #inpsrc:focus {
width:80%;
width:calc(99% - 18px);
}
#search .submit {
position:relative;
margin:0 0 0 -15px;
padding:0;
}
/* END */

/* Content */
#p_content {
position:relative;
margin:110px 0 auto 0;
padding:30px 2px 4px 2px;
}
#p_content .bf_subt{
display:none;
}
#p_content h2{margin:3px auto 1px auto;font-size:.95em;text-align:center;}
#p_content h3{margin:4px auto 3px 15px;font-size:.9em;}
#p_content ul, #p_content ol{margin:2px auto 2px 1%;}
#p_content .code {max-height:400px;min-width:290px;margin:15px 0; padding:2px 2px 5px 2px !important;}
#p_content .imgs{margin-left:3%; max-width:97%;}
#p_content .imgbox{margin:1px auto 1px 1em;}
#pgs_content_list li a {
margin:-8px 1px 5px 0;
}
#p_content #link_pn {
font-size:16px;
margin:10px auto;
line-height:155%;
}
/* END */

/* Pagination links */
.linkspg {
margin:13px 3px;
padding:3px 1px;
font-size:19px;
}
.linkspg a {
padding:1px 2px;
font-size:17px;
}
.linkspg a:hover { background-color:#f7f808; }

/* Social Share-Like */
#share_like {
background:#eeee00;
border-top-right-radius:35%;
border-bottom-right-radius:35%;
line-height:110%;
left:0;
right:auto;
top:225px;
height:auto;
width:auto;
min-width:19px;
}
#share_like h4 {display:block;font-size:17px;margin:0;padding:1px 2px;width:19px;}
#share_like img {border:0; margin-bottom:5px; width:30px; height:30px;}
#share_like a {display:block; margin:1px auto;}
#share_like .fb-like {margin:0 auto .6em auto}
#share_like #sl_div {display:none;margin-top:100px;}
#share_like:hover h4 {display:none;}
#share_like:hover {
border-top-left-radius:0;
border-bottom-left-radius:0;
}
#share_like:hover #sl_div {
display:block;
border-top-left-radius:0;
border-bottom-left-radius:0;
line-height:150%;
right:0;
animation-name:slide_top;
animation-duration: 1s;
animation-timing-function: ease-in-out;
animation-delay: 0s;
animation-fill-mode: forwards;
}
/* End */

/* For Scroll top */
#scrtop {
position:fixed;
bottom:15px;
left:0;
top:auto;
right:auto;
width:22px;
height:23px;
background: url("top.png") no-repeat scroll center center #0001da;
cursor:pointer;
border-radius:.5em;
z-index:5555;
}
#scrtop:hover {
border-color: #00be01;
border-radius:50%;
}
/* END */

/* Site access data */
#siteacc {
margin:18px 0 0 0;
}
#pgalast, #pgatop, #pgatop_m {
width:98%;
margin:-.1em .2% .2em .2%;
}
/* Mini-Traffic */
#siteacc #show_mt {
margin:.5em auto;
}
#traff {
margin:1em .1em .5em .3em;
}
#traff #trafstat  {
margin:0 -2px .3em -1.8%;
}
#traff .dvcells {
width:47.7%;
margin:.1em .2%;
padding:.1em;
}
#traff .dvcells:nth-child(4) {width:47.7%;}
#traff #yip {
margin:.25em .2em auto .1em;
}
/* End */

/* Footer */
#footer {
width:99%;
margin:2px auto;
text-align:center;
}
#footer #menu_footer {
box-shadow:none;
margin:0 1px;
text-align:center;
}
/* End */

}