﻿* {
	margin:0px;
	padding:0px;
}
html, body {
	height:100%;
	width:100%;
	background-color:#ffffff;
	color:#fff;
	font-weight:normal;
	font-family:"Segoe UI", "Segoe", "SegoeUI-Regular-final", Tahoma, Helvetica, Arial, sans-serif;
	-ms-overflow-style:-ms-autohiding-scrollbar;
}
body {
	font-size:0.9em;
}
#noScript {
	margin:16px;
	color:Black;
}
:lang(en-GB) {
	quotes:'\2018' '\2019' '\201C' '\201D';
}
:lang(zh) {
	font-family:微软雅黑;
}
 @-ms-viewport {
width: device-width;
}
@-moz-viewport {
width: device-width;
}
@-o-viewport {
width: device-width;
}
@-webkit-viewport {
width: device-width;
}
@viewport {
width: device-width;
}
/* Theme layout styles */

#fullPage, #brandingWrapper {
	width:100%;
	height:100%;
	background-color:inherit;
}
#brandingWrapper {
	background-color:#4488dd;
}
#branding {
	/* A background image will be added to the #branding element at run-time once the illustration image is configured in the theme. 
       Recommended image dimensions: 1420x1200 pixels, JPG or PNG, 200 kB average, 500 kB maximum. */
    height:100%;
	/*margin-right:500px; 
	margin-left:0px;*/
	background-color:inherit;
	background-repeat: no-repeat;
	background-size:cover;
	-webkit-background-size:cover;
	-moz-background-size:cover;
	-o-background-size:cover;
}
#contentWrapper {
	 width:calc(40% - 40px);
	/*position:relative;*/   
	/*height:100%;
	overflow:auto;*/
	background-color:rgba(255,255,255,0);
	margin-left:-40%;
	margin-right:0px;
	padding:20px;
	/*position:absolute; right: 0; margin: auto;bottom: 0;*/
}
@media(max-width:767px){#contentWrapper {width: calc(100% - 40px);margin: 0;}}
#content {
	min-height:100%;
	height: auto !important;
	/*margin:0 auto -55px auto;
	padding:0px 150px 0px 50px;*/
}
#header {
	font-size:2em;
	font-weight:lighter;
	font-family:"Segoe UI Light", "Segoe", "SegoeUI-Light-final", Tahoma, Helvetica, Arial, sans-serif;
	/*padding-top: 90px;
	margin-bottom:60px;
	min-height:100px;
	overflow:hidden;*/
	position:absolute; top:20px; left:20px;
}
#header img {
	display: none !important;
}
#workArea, #header {
	word-wrap:break-word;
	/*width:350px;*/
}
#workArea {margin: auto;position: absolute;top: 0;bottom: 0;height: 270px;}
#footerPlaceholder {
	height:40px;
}
#footer {
	height:40px;
padding: 10px 30px 0px 30px;
position: absolute;
color: #fff;
font-size: 0.78em;
text-align: right;
bottom: 0;
right: 30px;
}
#footerLinks {
	float:none;
	padding-top:10px;
}
#copyright {
	color:#fff;
}
.pageLink {
	color:#000000;
	padding-left:16px;
}
/* Common content styles */

.clear {
	clear:both;
}
.float {
	float:left;
}
.floatReverse {
	float:right;
}
.indent {
	margin-left:16px;
}
.indentNonCollapsible {
	padding-left:16px;
}
.hidden {
	display:none;
}
.notHidden {
	display:inherit;
}
.error {
	color:#c85305;
}
.actionLink {
	margin-bottom:8px;
	display:block;
}
a {
	color:#2672ec;
	text-decoration:none;
	background-color:transparent;
}
ul {
	list-style-type: disc;
}
ul, ol, dd {
	padding: 0 0 0 16px;
}
h1, h2, h3, h4, h5, label {
	margin-bottom: 8px;
}
.submitMargin {
	margin-top:20px;
	margin-bottom:30px;
}
.topFieldMargin {
	margin-top:8px;
}
.fieldMargin {
	margin-bottom:8px;
}
.groupMargin {
	margin-bottom:30px;
}
.sectionMargin {
	margin-bottom:64px;
}
.block {
	display: block;
}
.autoWidth {
	width:auto;
}
/*.fullWidth {
	width:342px;
}*/
.fullWidthIndent {
	width:326px;
}
.smallTopSpacing {
	margin-top:15px;
}
.mediumTopSpacing {
	margin-top:25px;
}
.largeTopSpacing {
	margin-top:35px;
}
.smallBottomSpacing {
	margin-bottom:5px;
}
.mediumBottomSpacing {
	margin-bottom:15px;
}
.largeBottomSpacing {
	margin-bottom:25px;
}
input {
	max-width:100%;
	font-family:inherit;
	margin-bottom:15px;
}
input[type="radio"], input[type="checkbox"] {
	vertical-align:middle;
	margin-bottom: 0px;
}
span.submit, input[type="submit"] {
	border:none;
	background-color:rgb(38, 114, 236);
	min-width:80px;
	width:auto;
	height:30px;
	padding:4px 20px 6px 20px;
	border-style:solid;
	border-width:1px;
	transition:background 0s;
	color:rgb(255, 255, 255);
	cursor:pointer;
	margin-bottom:8px;
	-ms-user-select:none;
	-moz-transition:background 0s;
	-webkit-transition:background 0s;
	-o-transition:background 0s;
	-webkit-touch-callout:none;
	-webkit-user-select:none;
	-khtml-user-select:none;
	-moz-user-select: none;
	-o-user-select: none;
	user-select:none;
}
/*input[type="submit"]:hover, span.submit:hover {
	background: rgb(212, 227, 251);
}
input.text {
	height:28px;
	padding:0px 3px 0px 3px;
	border:solid 1px #BABABA;
	font-size:1.0em;
}
input.text:focus {
	border: 1px solid #6B6B6B;
}*/


 #loginMessage{ font-size:32px; line-height:36px; width: 100%;
    text-align: center; min-width:300px; font-weight: 100;}

#userNameArea input, #passwordArea input{border-radius: 15px;
-webkit-border-radius: 15px;
-moz-border-radius: 15px;
border: none;
padding: 8px 12px;
width: calc(100% - 24px);
font-size: 16px;
color: #333;
background: rgba(255,255,255,0.8);
line-height: 20px;
position: relative;}

#userNameArea input:before{content:''; height:12px; width:12px;display:b; border:4px solid #333; border-bottom:none; border-radius:50px 50px 0 0;-webkit-border-radius:50px 50px 0 0;-moz-border-radius:50px 50px 0 0; position:absolute; top:-16px; left:-1px;}

#userNameArea input:after{content:''; width:6px; height:6px; background:#333; border-radius:2px;-webkit-border-radius:2px;-moz-border-radius:2px; border:4px; position:absolute; top:6px; left:6px; }

#submitButton{border: none;
background: rgba(3,73,22,0.8);
font-size: 16px;
padding: 6px 12px;
width: calc(100% - 24px);
border-radius: 15px;
-webkit-border-radius: 15px;
-moz-border-radius: 15px;
display: block;
text-align: center;}
#submitButton:hover{ background:#009cff}
select {
	height:28px;
	min-width:60px;
	max-width:100%;
	margin-bottom:8px;
	white-space:nowrap;
	overflow:hidden;
	box-shadow:none;
	padding:2px;
	font-family:inherit;
}
h1, .giantText {
	font-size:2.0em;
	font-weight:lighter;
}
h2, .bigText {
	font-size:1.33em;
	font-weight:lighter;
}
h3, .normalText {
	font-size:1.0em;
	font-weight:normal;
}
h4, .smallText {
	font-size:0.9em;
	font-weight:normal;
}
h5, .tinyText {
	font-size:0.8em;
	font-weight:normal;
}
.hint {
	color:#999999;
}
.emphasis {
	font-weight:700;
	color:#2F2F2F;
}
.smallIcon {
	height:20px;
	padding-right:12px;
	vertical-align:middle;
}
.largeIcon {
	height:48px;
	/* width:48px; */
    vertical-align:middle;
}
.largeTextNoWrap {
	height:48px;
	display:table-cell; /* needed when in float*/
	vertical-align:middle;
	white-space:nowrap;
	font-size:1.2em;
}
.idp {
	height:48px;
	clear:both;
	padding:8px;
	overflow:hidden;
}
.idp:hover {
	background-color:#cccccc;
}
.idpDescription {
	width:80%;
}

/* Form factor: intermediate height layout. Reduce space of the header. */
/*@media only screen and (max-height: 820px) {
#header {
	padding-top: 40px;
	min-height:0px;
	overflow: hidden;
}
#workArea {
	margin-bottom:60px;
}
}*/

/* Form factor: intermediate height layout. Reduce space of the header. */
/*@media only screen and (max-height: 500px) {
#header {
	padding-top: 30px;
	margin-bottom: 30px;
}
#workArea {
	margin-bottom:40px;
}
}*/

/* Form factor: intermediate layout (WAB in non-snapped view falls in here) */
/*@media only screen and (max-width: 600px) {
html, body {
	min-width: 260px;
}
#brandingWrapper {
	display: none;
}
#contentWrapper {
	float: none;
	width: 100%;
	margin: 0px auto;
}
#content, #footer, #header {
	width: 400px;
	padding-left: 0px;
	padding-right: 0px;
	margin-left: auto;
	margin-right: auto;
}
#workArea {
	width: 100%;
}
.fullWidth {
	width: 392px;
}
.fullWidthIndent {
	width: 376px;
}
}
 @media only screen and (max-width: 450px) {
body {
	font-size: 0.8em;
}
#content, #footer {
	width:auto;
	margin-right:33px;
	margin-left:25px;
}
#header {
	width: auto;
}
span.submit, input[type="submit"] {
	font-size: 0.9em;
}
.fullWidth {
	width:100%;
	margin-left:auto;
	margin-right:auto;
}
.fullWidthIndent {
	width: 85%;
}
.idpDescription {
	width:70%;
}
}*/

/* Form factor: snapped WAB (for WAB to work in snapped view, the content wrapper width has to be set to 260px) */
/*@media only screen and (max-width:280px) {
#contentWrapper {
	width:260px;
}
.idpDescription {
	max-width:160px;
	min-width:100px;
}
}
#workArea {
	border: 10px solid #556670;
	border-radius: 10px;
	background: #fff;
	color:#000;
	padding: 20px;
	position: absolute;
	bottom: 40px;
	right:15px;
}
#header {
	position: absolute;
	left: 20px;
	top: 20px;
}*/
