@charset "utf-8";
/* CSS Document */
/* Mask Start */
.x-mask-msg {
    border-width: 0px;
    border-color: transparent;
    background: transparent;
}
.x-mask-msg-text {
    background-image: url(/ext-js/images/common/grid/loading.gif?v=241116013456);
}
.x-mask-msg-inner {
    border-width: 0px;
    background-color: #ffffff;
    color: #000000;
    font: normal 11px Century Gothic,tahoma,arial,verdana,sans-serif;
}
/* Mask End */
body,html{
	background:#f2f2f2;
	width:100%;
	height:100%;
	font-family: Century Gothic,AppleGothic,sans-serif;
}
.bluebk{
	background-repeat:no-repeat;
	width:194px;
	height:145px;
	position:fixed;
	z-index:0;
	left:50%;
	top:343px;
	margin-left:-254px;
}
.backgroundbox{
	width:3000px;
	height:3000px;
	position:fixed;
	background:#dfe5e8;
	z-index:1;
	top:50px;
	left:50%;
	margin-left:-600px;
	transform: rotate(38deg);
	-webkit-transform: rotate(38deg); /* Safari */
	box-shadow: -3px 2px 3px rgba(160,160,160,0.3); 
	-webkit-box-shadow: -3px 2px 3px rgba(160,160,160,0.3); 
	-moz-box-shadow: -3px 2px 3px rgba(160,160,160,0.3); 
}
.container{ z-index:2!important; 
	position:relative;
    margin: 0 auto;
    text-align: center;}

.container:before {
    content: "";
    height: 100%;
    display: inline-block;
    vertical-align: middle;
}
.cardbox{
	/*display:none;*/
	width:70%;
	height:100%;
	background:#FFFFFF;
	border:1px solid #f2f2f2;
	position:relative;
	margin:0;
	margin-top:120px;
	box-shadow: 0px 2px 3px rgba(160,160,160,0.5); 
	-webkit-box-shadow: 0px 2px 3px rgba(160,160,160,0.5); 
	-moz-box-shadow: 0px 2px 3px rgba(160,160,160,0.5); 
	padding:10px 0;
    margin: 0 auto;
    display: inline-block;
    vertical-align: middle;
}

.img-left img { float:left;}

.model_title{margin: 0 auto;float: none; word-break: break-all;}
.model_title_break_word{margin: 0 auto;float: none; word-wrap:break-word;}
.languagetag{}
.languagetag div{ color:#898989;}
.loginSubtitle{}
.loginSubtitle p{ margin:0; padding:0;}
.col-lg-username-input{ }
.col-lg-username-input input{ width:40%; border:none; border-bottom:1px solid #ccc; border-radius:0px; margin: 0 0 0 10px;}
.col-lg-username-input input.margin-right-13{ margin-right:-24px;}
.col-lg-username-input input.margin-right-12{ margin-right:-12px;}
.col-lg-login-user-input{ }
.col-lg-login-user-input input{ width:38%;}
/*.col-lg-username-input input.error{width:45%; border:none; border-bottom:1px solid #ff2837; border-radius:0px; margin: 0 0 0 10px;}*/
.accountInput{ }
.accountInput i,
.accountInput .tooltip div {position:relative;}
.accountInput i::before,
.accountInput .tooltip div::before {content:''; background:url("../images/user.svg?v=241116013456"); width:28px; height:28px;background-size:28px 28px; text-align:right; display:inline-block; margin-top:0px; margin-left:-35px; top: 0px; left: 0px; zoom: 0.8;
-ms-zoom: 0.8;
-webkit-zoom: 0.8;
-moz-transform:  scale(0.8,0.8);
-moz-transform-origin: left center;}
.accountInput p{width:87%;color:#666666;}
.inputbox {width:100%; color:#666666;margin:0 auto;}
.otp{visibility:hidden;}
.inputbox ul{list-style: none;}
.inputbox ul li{text-align: right; width: 80%;}
.inputbox ul li.long{width:95%;}
.inputbox ul li span.left{}
.inputbox ul li span.op{position:absolute;}
.login-customized .passwordInput input:focus,
.login-customized .accountInput input:focus{outline: none; border-bottom: 1.5px solid #00b2ff;}
.user-defined .renew{ display: table;margin:0px -30px 0 5px; float: right; cursor: pointer;}
.user-defined .renew:before{content:''; background:url("../images/renew.svg?v=241116013456");  width:20px; height:20px; background-size:20px 20px; display:table-cell; }
.passwordInput{ }
.passwordInput i,
.passwordInput .tooltip div {position:relative;}
.passwordInput i::before,
.passwordInput .tooltip div::before {content:''; background:url("../images/key.svg?v=241116013456"); width:28px; height:28px;background-size:28px 28px; text-align:right; display:inline-block; margin-top:0px; margin-left:-35px;zoom: 0.8;-ms-zoom: 0.8;-webkit-zoom: 0.8;-moz-transform:  scale(0.8,0.8);
    -moz-transform-origin: left center;}

.onetimepasswordInput p{width:92%;color:#666666; margin-right: 6px;}
.annotationFont{ width: 65%; margin: 0 auto;}
.loginButton{ border:1px solid #00b1ff; background:#FFFFFF; color:#00b1ff; font-weight:bold; height:35px; min-width:100px; font-size:16px; border-radius:0px; margin:0 15px 10px 15px; font-style: normal;}
.loginButton:hover{ background:#00b2ff; color:#fff; cursor: pointer;}
.loginButton.unclick {border: 1px solid #cccccc; color: #cccccc;}
.loginButton.unclick:hover {background:#ffffff; color: #cccccc;}
.space {margin:0 5px;}
.loginButton.long {width:196px;}
.free{display:none;}
.sslvpn{display:none;}
.login-box{}
.language-box{ display:none;}
.closeButton{ display:inline-block; display:none; cursor:pointer;}
.languageLink a{ display:block; color:#666666; line-height:40px;}
.languageLink a:hover{ color:#00b2ff;}
.col-lg-time-input{ }
.col-lg-time-input input{ width:25%; border:none; border-bottom:1px solid #ccc; border-radius:0px;color:#666666;}
.user-defined {}
.user-defined p {margin-right: 6px;}
.user-defined p a{color:#666666;}
.user-defined p a:hover{text-decoration: underline;}
.user-defined i{height: 20px;zoom:0.9;margin-left: -25px;-moz-transform: scale(0.9);text-align: left;}

.user-defined .tip {margin: 0 auto; float: right;font-size: 12px;width: 60%;}
.time-lease p{margin-right: 6px; }
.time-auth p {margin-right: 6px;}
.margin-bottom-0 {margin-bottom: 0px;}
p.title {color:#00b2ff;font-weight:bold;font-size:14px;}
.psw_title {color:#666666;float:left;}
.note_triangle_txt {width:75%; margin: 0 auto;color:#555555;}
.note_triangle_txt ul {list-style-type: none;}
.note_triangle_txt ul li{color: #464646; font-size: 12px;font-style: normal;padding-left: 23px;text-align: left;}
.note_triangle_txt ul li img {display: inline-block;width: 13px;height: 15px; margin-right: 5px;}
.note_triangle_txt ul li.note_title {
    font-weight: bold;
}
.note_triangle_txt ul li.note_txt {}
/*Login 1-1*/

/*Login 1-3*/
.mobiletag{display: none;}
.mobiletag span{ color:#898989;}
.mobiletag i{width:28px; height:28px;}
.mobiletag i img{}
.mobileSpan a{ color:#666666;}
.WalledGardenbox{
	background:#f2f2f2;
	border:1px solid #f2f2f2;
	box-shadow: 0px 2px 3px rgba(160,160,160,0.5); 
	-webkit-box-shadow: 0px 2px 3px rgba(160,160,160,0.5); 
	-moz-box-shadow: 0px 2px 3px rgba(160,160,160,0.5);
	margin:0 0 0 -36px;
	display:none;
    vertical-align: middle;
}

.WalledGardenbox ul{ margin: 0px;padding: 0px;}
.WalledGardenbox ul li {list-style-type: none; margin:10px auto; text-align: left;}
.WalledGardenbox ul li a {font-size: 14px; color:#0079ff;font-weight: bold; cursor: pointer;word-break: break-all;}
.terms_checkbox {
   padding: 0px;
   width: 90%;
   margin:0 auto;
   visibility: hidden;
}
.terms_checkbox .checkbox {
	position: relative;
	display: block;
	margin-top: 10px;
	text-align: center;
}
.terms_checkbox .hide {
	visibility: hidden;
}
.terms_checkbox .checkbox input{
    height:22px;
}
.terms_checkbox .checkbox a{
    color:#00b2ff;
}
.terms_checkbox label{
    line-height: 19px;
}
.terms_checkbox .checkbox input[type=checkbox] {
  display: none;
}
.terms_checkbox .checkbox label:before {
  content: "";
  display: inline-block;
  width: 15px;
  height: 15px;
  margin-right: 10px;
  bottom: 2px;
  background-color: transparent;
  border: 1px solid #00b2ff;
  vertical-align: text-bottom;
}
.terms_checkbox .checkbox input[type=checkbox]:checked + label:before {
    background:url("../images/check.svg?v=241116013456");
    background-size: cover;
    font-size: 19px;
    color: #00b2ff;
    text-align: center;
    line-height: 19px;
}
.tooltip {
    position: relative;
    display: inline-block;
    border-bottom: 1px dotted black;
}
.tooltip .tooltiptext{
    visibility: hidden;
    width: 78px;
    background-color: #ffffff;
    border: 1px solid #00b2ff;
    color: #00b2ff;
    text-align: center;
    border-radius: 6px;
    padding: 2px 0;
    position: absolute;
    left: -115px;
    z-index: 1;
    line-height: 16px;
    font-size: 12px;

    /* Position the tooltip */
    position: absolute;
    z-index: 1;
}
.tooltip:hover .tooltiptext {
    visibility: visible;
}
/*Login*/
.row {
  margin-right: 0;
  margin-left: 0;
}
.row-same-height {
  display: flex;
  /*display: -webkit-box;  OLD - iOS 6-, Safari 3.1-6 */
}

.col-lg-3 {
  width: 25%;
  height: 360px;
  position: relative;
  min-height: 1px;
  padding-left: 10px;
  padding-right: 10px;
  overflow-y: scroll;
}

/*change pwd*/
.x-body{
	color:#666666;font-size:14px;font-family: Century Gothic, AppleGothic,sans-serif;
}
.chgpw-box{
	padding:0px 0px 10px 0;
}
.chgpw-subtitle{
	color:#00b2ff;border-radius:0px; font-family: Century Gothic, AppleGothic,sans-serif;font-weight:bold;padding-top:10px;text-align:center;
}
.chgpw-text {
	text-align:center;padding:10px 30px 20px 30px;
}
.chgpw .x-form-text{
	color:#666666; border:none; border-bottom:1px solid #ccc; border-radius:0px;background-image:none;font-size:14px;font-family: Century Gothic, AppleGothic,sans-serif;
}
.chgpw .x-form-item-label{
	color:#666666; font: normal 14px "Century Gothic";padding-right:10px;text-align:right;
}
.chgpw input.x-form-invalid-field{
	border-bottom:1px solid #ff2837; background-image:none;
}
.chgpw .x-form-invalid-icon{
	width: 20px;
	height: 20px;
	margin: 0 1px;
	background-image: url("../images/alert.svg?v=241116013456");
	background-repeat: no-repeat;
}
.x-tip-form-invalid{
	border:none;
	background-color:transparent;
	background-image: url("../images/alert_info.svg?v=241116013456");
	background-size:cover;
	box-shadow:none;
	border-radius:0px;
	-webkit-border-radius:0px;
	padding:0;
}
/*qtip info box*/
.x-tip-body-form-invalid{
	padding:10px 10px 10px 25px;
	background-color:transparent;
	background-image:none;
	color:#666666;
	font-size:14px;
}
.x-anchor-form-item{
	margin-bottom: 15px;
	margin-left: 90px;
}
/*button style*/
.x-btn-default-large{
	background-color:#fff; background-image:none; border:1px solid #00b1ff;  border-radius:0px;font-size:16px;font-family: Century Gothic, AppleGothic,sans-serif;
}
.x-btn-default-large .x-btn-inner{
	font-weight:bold;color:#00b1ff;font-size:16px;font-family: Century Gothic,AppleGothic,sans-serif;
}
/*button style*/
/*button disabled style*/
.x-btn-default-large-disabled{
	border: 1px solid #cccccc; background-image:none;background-color:#fff;border-radius:0px;cursor:default;
}
.x-btn-default-large-disabled .x-btn-inner, .x-btn-default-large-disabled .x-btn-icon-el{
	font-weight:bold; font-size:16px;font-family: Century Gothic,AppleGothic,sans-serif;color:#cccccc;
}
/*button disabled style*/
/*button over */
.x-btn-default-large-over {
  background-image: none;
  background-color: #00b2ff;
  text-decoration:none;
  color:#fff;
  cursor: pointer;
}
.x-btn-default-large-over  .x-btn-inner{
 color:#fff;
}
/*button over */
/*change pwd*/

/*access page*/
.auto_lease_checkbox {
   padding: 0px;
   width: 90%;
   margin:0 auto;
   display: none;
}
.auto_lease_checkbox .checkbox {
	position: relative;
	display: block;
	margin-top: 10px;
	text-align: center;
	margin-bottom:10px;
}
.auto_lease_checkbox .checkbox input{
    height:22px;
}
.auto_lease_checkbox .checkbox a{
    color:#00b2ff;
}
.auto_lease_checkbox label{
    line-height: 19px;
}
.auto_lease_checkbox .checkbox input[type=checkbox] {
  display: none;
}
.auto_lease_checkbox .checkbox label:before {
  content: "";
  display: inline-block;
  width: 15px;
  height: 15px;
  margin-right: 10px;
  bottom: 2px;
  background-color: transparent;
  border: 1px solid #00b2ff;
  vertical-align: text-bottom;
}
.auto_lease_checkbox .checkbox input[type=checkbox]:checked + label:before {
    background:url("../images/check.svg?v=241116013456");
    background-size: cover;
    font-size: 19px;
    color: #00b2ff;
    text-align: center;
    line-height: 19px;
}