html, body {height:100%}
			.bg-login{ 
				background:url(../img/bg-login.jpg);
				background-repeat: no-repeat;
				background-position: center;
				background-size: cover;
				height:100%;}
			.logo{ color: #f8f8f8; font-size:2rem; padding-top:3rem; padding-bottom:4rem;}
			.row{ padding-top:3.3%; position: relative; left: -1rem;}
			.login{ background-color: #ffffff; width:90%; float: right;}
			.login h1{ font-size:1.5rem; color: #00a6ff; padding:1rem 1rem 0.5rem 1rem;}
			.selectBox,.infoBox,.err,.btn{ padding: 1rem 1rem 0rem 1rem;}
			.selectBox,.infoBox,.err,.btn1{ padding: 1rem 1rem 0rem 1rem;}
			.infoBox input,.selectBox select{ padding:0.5rem; width: 100%; font-size: 1rem; border:1px #C0C0C0 solid; padding-left: 2rem;}
			.selectBox select{ background: -webkit-linear-gradient(#fdfefe, #bcdeff); /* Safari 5.1 - 6.0 */
			                   background: -o-linear-gradient(#fdfefe, #bcdeff); /* Opera 11.1 - 12.0 */
                               background: -moz-linear-gradient(#fdfefe, #bcdeff); /* Firefox 3.6 - 15 */
                               background: linear-gradient(#fdfefe, #bcdeff); /* 标准的语法 */
			                  }
			.btn button{ background-color: #00a6ff; font-size:1rem; color: #ffffff; width:100%; padding: 0.5rem; border:1px #00A6FF solid;}
			.btn1 button{ background-color: #00a6ff; font-size:1rem; color: #ffffff; width:100%; padding: 0.5rem; border:1px #00A6FF solid;}
			.r{ padding-bottom:2rem;}
			#username{ background:url(../img/login-userid.png) no-repeat 0.9% 45%;}
			#password{background:url(../img/login-password.png) no-repeat 0.9% 45%;}
			
			/* 上面是登录页的css代码，下面的是不同分辨率的适配框架代码*/
html {
	font-family: sans-serif;
	font-size: 100%;
	line-height: 1;
	-ms-text-size-adjust: 100%;
	-webkit-text-size-adjust: 100%;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	box-sizing: border-box
}

*,:before,:after {
	box-sizing: inherit
}

body,header,footer,main,section,div,h1,h2,h3,h4,h5,h6,p,span,a,blockquote,q,pre,code,ol,ul,li,form,label,input,textarea,button,table,tr,th,td,dl,dt,dd,hr {
	margin: 0;
	padding: 0;
	border: 0;
	font: inherit;
	font-size: 100%;
	line-height: inherit;
	vertical-align: baseline;
	background: 0 0
}

article,aside,details,figcaption,figure,footer,header,main,menu,nav,section,summary {
	display: block
}

ol,ul {
	list-style: none
}

hr {
	border-bottom: 1px solid #000
}

img {
	max-width: 100%;
	height: auto;
	vertical-align: middle;
	border-style: none
}

a,a:hover {
	color: #000;
	text-decoration: none
}

blockquote,q {
	quotes: none
}

blockquote:before,blockquote:after,q:before,q:after {
	content: '';
	content: none
}[type=color],[type=date],[type=datetime-local],[type=email],[type=month],[type=number],[type=password],[type=search],[type=tel],[type=text],[type=time],[type=url],[type=week],textarea {
	display: block;
	width: 100%;
	max-width: 100%;
	border: 1px solid #000;
	border-radius: 0;
	-webkit-appearance: none;
	-moz-appearance: none
}

::-webkit-input-placeholder {
	color: #777
}

:-moz-placeholder {
	color: #777
}

::-moz-placeholder {
	color: #777;
	opacity: 1
}

:-ms-input-placeholder {
	color: #777
}[type=reset],[type=submit],[type=button],button {
	border: 1px solid #000;
	border-radius: 0;
	-webkit-appearance: none;
	-moz-appearance: none;
	cursor: pointer
}

:focus {
	outline: none
}

table {
	width: 100%
}

table,tr,th,td {
	border: 1px solid #000;
	border-collapse: collapse;
	border-spacing: 0
}

.row {
	margin: 0 auto
}

.row:before,.row:after {
	content: '';
	display: table
}

.row:after {
	clear: both
}

.xs {
	max-width: 32rem
}

.sm {
	max-width: 48rem
}

.md {
	max-width: 64rem
}

.lg {
	max-width: 80rem
}

.xl {
	max-width: 96rem
}

.col {
	float: left
}

.xs-0 {
	display: none
}

.xs-1,.xs-2,.xs-3,.xs-4,.xs-5,.xs-6,.xs-7,.xs-8,.xs-9,.xs-10,.xs-11,.xs-12 {
	display: inline-block
}

.xs-1 {
	width: 8.3333%
}

.xs-2 {
	width: 16.6667%
}

.xs-3 {
	width: 25%
}

.xs-4 {
	width: 33.3333%
}

.xs-5 {
	width: 41.6667%
}

.xs-6 {
	width: 50%
}

.xs-7 {
	width: 58.3333%
}

.xs-8 {
	width: 66.6667%
}

.xs-9 {
	width: 75%
}

.xs-10 {
	width: 83.3333%
}

.xs-11 {
	width: 91.6667%
}

.xs-12 {
	width: 100%
}

@media screen and (min-width:32em) {
	.sm-0 {
		display: none
	}

	.sm-1,.sm-2,.sm-3,.sm-4,.sm-5,.sm-6,.sm-7,.sm-8,.sm-9,.sm-10,.sm-11,.sm-12 {
		display: inline-block
	}

	.sm-1 {
		width: 8.3333%
	}

	.sm-2 {
		width: 16.6667%
	}

	.sm-3 {
		width: 25%
	}

	.sm-4 {
		width: 33.3333%
	}

	.sm-5 {
		width: 41.6667%
	}

	.sm-6 {
		width: 50%
	}

	.sm-7 {
		width: 58.3333%
	}

	.sm-8 {
		width: 66.6667%
	}

	.sm-9 {
		width: 75%
	}

	.sm-10 {
		width: 83.3333%
	}

	.sm-11 {
		width: 91.6667%
	}

	.sm-12 {
		width: 100%
	}
}

@media screen and (min-width:48em) {
	.md-0 {
		display: none
	}

	.md-1,.md-2,.md-3,.md-4,.md-5,.md-6,.md-7,.md-8,.md-9,.md-10,.md-11,.md-12 {
		display: inline-block
	}

	.md-1 {
		width: 8.3333%
	}

	.md-2 {
		width: 16.6667%
	}

	.md-3 {
		width: 25%
	}

	.md-4 {
		width: 33.3333%
	}

	.md-5 {
		width: 41.6667%
	}

	.md-6 {
		width: 50%
	}

	.md-7 {
		width: 58.3333%
	}

	.md-8 {
		width: 66.6667%
	}

	.md-9 {
		width: 75%
	}

	.md-10 {
		width: 83.3333%
	}

	.md-11 {
		width: 91.6667%
	}

	.md-12 {
		width: 100%
	}
}

@media screen and (min-width:64em) {
	.lg-0 {
		display: none
	}

	.lg-1,.lg-2,.lg-3,.lg-4,.lg-5,.lg-6,.lg-7,.lg-8,.lg-9,.lg-10,.lg-11,.lg-12 {
		display: inline-block
	}

	.lg-1 {
		width: 8.3333%
	}

	.lg-2 {
		width: 16.6667%
	}

	.lg-3 {
		width: 25%
	}

	.lg-4 {
		width: 33.3333%
	}

	.lg-5 {
		width: 41.6667%
	}

	.lg-6 {
		width: 50%
	}

	.lg-7 {
		width: 58.3333%
	}

	.lg-8 {
		width: 66.6667%
	}

	.lg-9 {
		width: 75%
	}

	.lg-10 {
		width: 83.3333%
	}

	.lg-11 {
		width: 91.6667%
	}

	.lg-12 {
		width: 100%
	}
}

@media screen and (min-width:80em) {
	.xl-0 {
		display: none
	}

	.xl-1,.xl-2,.xl-3,.xl-4,.xl-5,.xl-6,.xl-7,.xl-8,.xl-9,.xl-10,.xl-11,.xl-12 {
		display: inline-block
	}

	.xl-1 {
		width: 8.3333%
	}

	.xl-2 {
		width: 16.6667%
	}

	.xl-3 {
		width: 25%
	}

	.xl-4 {
		width: 33.3333%
	}

	.xl-5 {
		width: 41.6667%
	}

	.xl-6 {
		width: 50%
	}

	.xl-7 {
		width: 58.3333%
	}

	.xl-8 {
		width: 66.6667%
	}

	.xl-9 {
		width: 75%
	}

	.xl-10 {
		width: 83.3333%
	}

	.xl-11 {
		width: 91.6667%
	}

	.xl-12 {
		width: 100%
	}
}