@charset "utf-8";
body{ font-family:Arial,'Microsoft JhengHei', Helvetica, sans-serif;font-size:13px;}
#masthead a{color:#360;}
#masthead a:hover{color:#000;}
#masthead{position:relative;top:0px;left:0;z-index:4;right:0;height:1em; font-size:2em; line-height:1em;
background: #ffffff;
background: -moz-linear-gradient(top, #ffffff 0%, #f3f3f3 50%, #ededed 51%, #ffffff 100%);
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#ffffff), color-stop(50%,#f3f3f3), color-stop(51%,#ededed), color-stop(100%,#ffffff));
background: -webkit-linear-gradient(top, #ffffff 0%,#f3f3f3 50%,#ededed 51%,#ffffff 100%);
background: -o-linear-gradient(top, #ffffff 0%,#f3f3f3 50%,#ededed 51%,#ffffff 100%);
background: -ms-linear-gradient(top, #ffffff 0%,#f3f3f3 50%,#ededed 51%,#ffffff 100%);
background: linear-gradient(to bottom, #ffffff 0%,#f3f3f3 50%,#ededed 51%,#ffffff 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#ffffff',GradientType=0 );}
#masthead .logo{display:block;width:17%;float:left;margin:0;line-height:1em;}
#masthead .logo img{width:4.1em;height:1em;}
#masthead .logo svg{ width:4.1em;height:1em;}
#masthead .logo canvas{ width:4.1em;height:1em;}

#masthead .masthead_r{float:right;}
#masthead .fb_chan{float:left;
    background:url(../images/fb_chan.png);
	opacity:0.8;
    display:block; 
	font-size:0.9em;
	margin:0.05em 0.05em 0 ;
    width: 1em;
    height: 1em;
    border-radius: 0.2em;
    text-indent: -9999px;
	background-size:1em auto;}
#masthead .fb_chan:hover{opacity:1;}
#masthead #sharebar{float:left;}
#masthead .sharebar{
	opacity:0.3;
    display:block; float:left;
	font-size:0.9em;
	margin:0.05em 0.1em 0 ;
    width: 1em;
    height: 1em;
    background: #000 url(../images/topbar.png);
    border-radius: 0.2em;
    text-indent: -9999px;
	background-size:1em auto;background-position:0 -1em;}
#masthead .sharebar:hover{opacity:0.5;}

#masthead .navbar{position:absolute; top:1.1em; right:0.05em; background:rgba(0,0,0,0.4);border-radius:0.2em; padding:0 0 0.08em; width:1em; overflow:hidden;}
#masthead .navbar li{ font-size:0.8em; margin:0.1em 0.1em 0 0.1em;}
#masthead .navbar li a{ display:block;background:url(../images/shareicon.png);background-size:1.01em auto; font-size:1em; width:1em; height:1em;border-radius:0.2em;text-indent:-9999px;}
#masthead .navbar li a:hover{}

#masthead .navbar .fb a{background-position:0 0;}
#masthead .navbar .t a{background-position:0 -1.02em;}
#masthead .navbar .p a{background-position:0 -2.03em;}
#masthead .navbar .w a{background-position:0 -3.04em;}
#masthead .navbar .g a{background-position:0 -4.05em;}

#footer{font-size:0.8em;width:100%; background: #e9e5dc; line-height:1.2em; position:relative; overflow:hidden;z-index:3; border-top:0.2em solid #ccc; padding:0.3em 0;}

#footer a{color:#360;}
#footer a:hover{color:#000;}

#footer .right{ float:right; margin-right:0.5em;}
#footer .left{ float:left; white-space:nowrap; margin-left:0.5em;}
#footer .p{white-space:nowrap; margin-left:0.5em;}
@media screen and (orientation: landscape){
#footer{font-size:0.4em;}
}