/*
	wangli ÐÞ¸ÄÓÚ2013/3/27 11£º53 version 1.0
*/

html, body{font-family: Tahoma, NSimsun, SimSun, sans-serif;}

            .pagenumber{
                position: absolute;
                right: 20px;
                top: 10px;
                color: #aaa;
                font-size: 0.8em;
                text-align: right;
                line-height: 0.8em;
                padding: 0.5em;
                cursor: default;
            }

            

            .pagenumber.detail{
                font-size: 0.6em;
                padding: 0.9em 0;
            }

            h1.title {
                font-size: 1.9em;
                line-height: 1.3em;
                transition: all linear 0.1s;
            }

            h1 {
                font-weight: normal;
                margin: 0 0 1.2em 0;
                text-align: center;
            }

            h2 {
                font-size: 1.6em;
                font-weight: normal;
                margin: 1.5em 0 -0.3em 0;
                text-align: center;
                transition: all linear 0.1s;
            }

            h3 {
                font-size: 1.125em;
                font-weight: normal;
                text-align: center;
            }

            .page.rtl {
                direction: rtl;
            }

            .page a {
                text-decoration: none;
                color: #0070CC;
                margin: 0 6px;
            }

            .page a:hover {
                text-decoration: underline;
            }

            .page a:visited {
                color: #286CA4;
            }

            

            #article pre {
                white-space: pre-wrap;
            }

            #article img {
                /* Float images to the left, so that text will nicely flow around them. */
                margin: 0 auto;
                /* Scale down very wide images, but maintain their intrinsic aspect ratio. */
                max-width: 100%;
                height: auto;
                transition: opacity 0.2s linear;
            }
            
            

            #article img.reader-image-tiny {
                /* Don"t float very small images -- let them display where they occur in the text. */
                float: none;
                margin: 0;
            }

            #article img.reader-image-large {
                float: none;
                margin: auto;
                margin-bottom: 0.75em;
                display: block;
            }

            #article img.reader-image-right {
                float: right;
                margin: 0.3em 0 0.3em 1.2em;
                display: block;
				max-width: 40%;
            }

            #article img.reader-image-left {
                float: left;
                margin: 0.3em 1.6em 0.3em 0;
                display: block;
				max-width: 40%;
            }

            #article .leading-image {
                margin-bottom: .25em;
            }

            #article .leading-image img {
                margin: auto;
                float: none;
                display: block;
                clear: both;
            }

            #article .leading-image img.full-width {
                width: 100%;
            }

            #article .leading-image .credit {
                color: #909090;
                font-size: 0.55em;
                margin: 0;
                text-align: right;
                width: 100%;
            }

            #article .leading-image .caption {
                color: #666;
                font-size: 0.7em;
                line-height: 140%;
                margin-top: 0.4em;
                width: 100%;
            }

            #article .leading-image .credit + .caption {
                margin-top: 0.1em;
            }

            .float {
                margin: 8px 0;
                font-size: 65%;
                line-height: 1.4;
                text-align: start;
            }

            .float.left {
                float: left;
                margin-right: 20px;
            }

            .float.right {
                float: right;
                margin-left: 20px;
            }

            .float.full-width {
                float: none;
                display: block;
                font-size: 100%;
            }

            .page {
                text-align: left;
                line-height: 1.7; 
                letter-spacing: 0.05em;
                color: #333;
                background: #fff;
                border: 1px solid #c3c3c3;
                border-bottom: 1px solid  #ccc;
                border-top: 1px solid #ddd;
				margin-bottom:2px;
				width: 75%;
                max-width: 780px;
				position: relative;
				overflow: hidden;
				margin-left: auto;
				margin-right: auto;
                transition: background 0.5s ease-out, color 0.6s ease-out,border 0.6s ease-out, opacity 0.2s linear,top 0.2s ease-in-out, padding 0.2s linear;
                transition-delay: 0,0,0,0,0,0;
            }

            body.on .page{
				top: 0;
				padding: 70px 100px;
			}

            body.off .page{
                opacity:0;
                top: 70px;
                transition-delay: 0,0,0,0,0,0;
                padding: 0px 40px 150px 40px;
            }

            body.on .page.first{
                margin-top: 40px;
				min-height: 61.8%;
                border-top: 1px solid #c3c3c3;
                padding-top: 90px;
            }

            body.on .page.last{
                margin-bottom: 40px;
                padding-bottom: 70px;
                border-bottom: 1px solid #c3c3c3;
            }

            body.off .page.first{
                margin-top: 40px;
            }

            #article.small .page{
                font-size:1.05em;
            }

            #article.middle .page{
                font-size:1.3em;
            }

            #article.big .page{
                font-size:1.6em;
            }

            .page p{
                margin: 0.7em 0;
                text-indent: 2.1em;
            }

            .page:first-of-type .title {
                display: block;
            }

            .page table {
                font-size: 0.9em;
                text-align: start;
            }

            /*night mode*/

            body.night .page{
                color: #aaa;
                background: #333;
                border: 1px solid #111;
                border-top: 1px solid #191919;
                border-bottom: 1px solid #121212;
				transition: background 0.5s ease-out, color 0.6s ease-out,border 0.6s ease-out, opacity 0.2s linear,top 0.2s ease-in-out, padding 0.2s linear;
            }
            body.night .page.first{
                border-top: 1px solid #111;
            }
            body.night .page.last{
                border-bottom: 1px solid #111;
            }
            body.night #background {
                background-color: #222;
            }
            body.night #hud {
                background: #191919;
                border-left: 1px solid #111;
            }
            body.night .page a{
                color: #198AE6;
            }
            body.night .page a:visited{
                color: #336B99;
            }
            body.night #article img {
                opacity: 0.6;
            }
            body.night #article img:hover {
                opacity: 1;
            }
            body.night .end{
			    color: #555;
		    }
			body.night .endline{
			    background:#555;
		    }
		    body.night .pagenumber{
                color: #666;
            }
            /*pink mode*/
            body.pink .page{
                color: #160310;
                background: #ffe8f0;
                border: 1px solid #b8a6ac;
                border-top: 1px solid #cfbcc3;
                border-bottom: 1px solid #cfbcc3;
				transition: background 0.5s ease-out, color 0.6s ease-out,border 0.6s ease-out, opacity 0.2s linear,top 0.2s ease-in-out, padding 0.2s linear;
            }
            body.pink .page.first{
                border-top: 1px solid #b8a6ac;
            }
            body.pink .page.last{
                border-bottom: 1px solid #b8a6ac;
            }
            body.pink #background {
                background-color: #ffd3e4;
            }
            body.pink #hud {
                background: #fbc1df;
                border-left: 1px solid #dba6c1;
            }

			body.pink .end{
			    color: #cfbcc3;
		    }
			body.pink .endline{
			    background:#e5d1d9;
		    }
			/*pink mode end*/

			/*yellow mode*/
            body.yellow .page{
                color: #2b1f06;
                background: #fff2d9;
                border: 1px solid #bbb39f;
                border-top: 1px solid #d2c9b2;
                border-bottom: 1px solid #d2c9b2;
				transition: background 0.5s ease-out, color 0.6s ease-out,border 0.6s ease-out, opacity 0.2s linear,top 0.2s ease-in-out, padding 0.2s linear;
            }
            body.yellow .page.first{
                border-top: 1px solid #bbb39f;
            }
            body.yellow .page.last{
                border-bottom: 1px solid #bbb39f;
            }
            body.yellow #background {
                background-color: #f5e1ba;
            }
            body.yellow #hud {
                background: #ebd9b6;
                border-left: 1px solid #dac7ae;
            }

			body.yellow .end{
			    color: #dac7ae;
		    }
			body.yellow .endline{
			    background:#ebd8bf;
		    }
			/*yellow mode end*/

			/*blue mode*/
            body.blue .page{
                color: #041834;
                background: #ebf5ff;
                border: 1px solid #a6aeb8;
                border-top: 1px solid #bcc5d0;
                border-bottom: 1px solid #bcc5d0;
				transition: background 0.5s ease-out, color 0.6s ease-out,border 0.6s ease-out, opacity 0.2s linear,top 0.2s ease-in-out, padding 0.2s linear;
            }
            body.blue .page.first{
                border-top: 1px solid #a6aeb8;
            }
            body.blue .page.last{
                border-bottom: 1px solid #a6aeb8;
            }
            body.blue #background {
                background-color: #d2e6fa;
            }
            body.blue #hud {
                background: #c2d9f1;
                border-left: 1px solid #b7d2ea;
            }

			body.blue .end{
			    color: #a3c4e0;
		    }
			body.blue .endline{
			    background:#b4d3ee;
		    }
			/*blue mode end*/

			/*green mode*/
            body.green .page{
                color: #112705;
                background: #eafae1;
                border: 1px solid #aab8a6;
                border-top: 1px solid #c4d4bf;
                border-bottom: 1px solid #c4d4bf;
				transition: background 0.5s ease-out, color 0.6s ease-out,border 0.6s ease-out, opacity 0.2s linear,top 0.2s ease-in-out, padding 0.2s linear;
            }
            body.green .page.first{
                border-top: 1px solid #aab8a6;
            }
            body.green .page.last{
                border-bottom: 1px solid #aab8a6;
            }
            body.green #background {
                background-color: #d2efc3;
            }
            body.green #hud {
                background: #c4e6b3;
                border-left: 1px solid #b9d1b2;
            }

			body.green .end{
			    color: #b9d1b2;
		    }
			body.green .endline{
			    background:#cae4c2;
		    }
			/*green mode end*/
            
           .end{
			    color: #ccc;
			    text-align: center;
			    margin: 60px 0 -10px 0;
				font-size: 14px;
				height: 20px;
				line-height: 20px;
				position:relative;
				width: 100%;
				left:0;
				transition: color 0.6s ease-out;
		    }         
			
			.endline{
				width: 15%;
				height: 1px;
				background:#dedede;
				position: absolute;
				top:0;
				margin-top: 10px;
				transition: background 0.6s ease-out;
			}
			.endline.left{
				left: 35%;
				margin-left: -50px;
			}
			.endline.right{
				right: 35%;
				margin-right: -50px;
			}
			

		    .image-wrapper {text-align:center;}
