@charset "utf-8";
/*****公共样式*****/
a,article,dd,div,form,h1,h2,h3,h4,h5,h6,html,img,ul,li,p,table,tbody,td,textarea,tfoot,th,tr {
	margin:0;
	padding:0;
	list-style-type: none;
}
body {font-size: 12px;font-family:"Microsoft Yahei";color:#333;padding:0;margin:0;background-color:#f6f7f9;}
img {border: 0 none;vertical-align: middle;}
a {text-decoration: none;outline:none;color:#666;}
a:link {text-decoration: none;}
a:hover {text-decoration: none;color:#4ea9de;}
a img {border:none;}

.Fillet {
    /*容器圆角*/
	border-radius: 5px;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
}
.Effect  {
    /*容器圆角*/
	border-radius: 4px;
	-moz-border-radius: 4px;
	-webkit-border-radius: 4px;
}

.header {width:100%; height:55px; margin-top:28px;}
.header .head-wrap {width:90%;margin:0 auto;}
.head-wrap .logo { height:25px; float:left; width:83px; margin: 0px 10px 0px 0px; border-right:1px solid #a8a8a8;}
.head-wrap .text { height:25px; line-height:25px; float:left; margin:-1px 30px 0px 0px; font-size:20px; color:#505050;}

.content {width:100%; height:468px; background:url(/images/bg/afternoon.jpg); background-size:cover; margin-top:0px; }

.left-main .pic { width:100%; margin:0px auto; }
.left-main span { line-height:30px; display:inline-block; font-size:16px; color:#FFF; margin-top:20px;}
.right-main .bt {font-size: 18px;margin:20px 0 16px 30px;}
.right-main .user {height:38px;width:252px;margin-left:28px;margin-bottom:15px;border:solid 1px #dfdfdf;}
.right-main .password {height:38px;width:252px;margin-left:28px;margin-bottom:15px;border:solid 1px #dfdfdf;}
.right-main .validate {height:38px;width:155px;margin-left:28px;border:solid 1px #dfdfdf;float:left;}
.login-icon {
	height: 28px;
	width: 26px;
	float: left;
	background-color: #eee;
	padding-top: 12px;
	padding-left: 12px;
	border-radius: 4px 0 0 4px;
}
.login-input {
	float: left;
	height: 38px;
	width: 212px;
	border-left:solid 1px #dfdfdf;	
}
.login-input02 {
	float: left;
	height: 38px;
	width: 116px;
	border-left:solid 1px #dfdfdf;	
}
.login01 {
	font-family: "Microsoft Yahei";
	line-height: 35px;
	height: 36px;
	width: 205px;
	border:none;
	padding-left: 8px;
	color: #666;
	font-size: 14px;
	background-color:transparent;
}
.login02 {
	font-family: "Microsoft Yahei";
	line-height: 35px;
	height: 36px;
	width: 108px;
	border:none;
	padding-left: 8px;
	color: #666;
	font-size: 14px;
	background-color:transparent;
}
.right-main .yzm {
	float: left;
	margin: 4px 0px 0px 15px;
	cursor:pointer;
}
.right-main .note {
	text-align: center;
	padding-top: 25px;
	color:#F00;
	line-height: 20px;
	height: 20px;
}
.right-main .login-for {
	height: 90px;
	background-color: #f9f9f9;
	border-radius: 0 0 5px 5px;
	border-top:solid 1px #dfdfdf;
	border-bottom:solid 4px #ececec;
}
.login-for .btn {
	line-height: 30px;
	height: 30px;
	width: 85px;
	color: #FFF;
	float: left;
	text-align: center;
	margin-top: 25px;
	margin-left: 30px;
	background-color: #409d28;
	border: 1px solid #24950f;
}
.login-for .btn a {display:block;color:#fff;}
.login-for .wrap {
	float: left;
	height: 32px;
	margin-top: 25px;
	margin-left: 20px;
}
.login03 {
	width: 14px;
	height: 14px;
}
.footer { clear:both; width:100%; margin:68px 0px 0px 0px; color:#999999; font-size:13px; text-align:center;}
.footer span { height:20px; padding-right:30px; margin-right:30px; border-right:1px solid #dddddd;}

.loading-mask, 
.loading-mask .loading-icon,
.loading-mask .loading-mask-body {
	height: 50%;
	width: 100%;
	position: absolute;
	left: 0;
	top: 0;
}
.loading-mask .loading-icon {
	background: url(../images/ajax-loader.gif) no-repeat center center;
	z-index: 600;
}
.loading-mask .loading-mask-body {
	background-color: #fff;
	z-index: 500;
	opacity: .8;
	filter: alpha(opacity=80);
}
.main .right-main { 
	position: relative;
}
.loading-mask {
	display:none;
}


.compatible-contianer {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  min-width: 800px;
  height: 30px;
  line-height: 30px;
  z-index: 999999;
  background: #FFFAE2;
}

.cpt-ct {
  color: #363636;
  font-size: 12px;
  text-align: center;
  height: 30px;
  line-height: 30px;
}
.cpt-ct i {
	margin:0px;
	padding:0px;
  display: inline-block;
  width: 12px;
  height: 14px;
  vertical-align: -2px;
  *vertical-align:2px;
  margin-right: 5px;
  background: url(../images/iefixed-sprite.png) no-repeat 0 0;
}
.cpt-ct a {
  color: #39b94e;
}
.cpt-ct a:hover {
  text-decoration: underline;
}
.cpt-handle {
  position: absolute;
  right: 20px;
  top: 0;
  font-size: 12px;
  line-height: 27px;
}
.cpt-handle a {
  display: inline-block;
  vertical-align: middle;
}
.cpt-handle .cpt-agin {
  color: #656e73;
  margin-right: 5px;
}
.cpt-handle .cpt-agin:hover {
  color: #363d40;
}
.cpt-close {
  width: 16px;
  height: 16px;
  text-align: center;
  line-height: 16px;
  border-radius: 50%;
  transition: 0.3s;
}
.cpt-close:hover {
  background-color: #fc8800;
}
.cpt-close i {
  display: inline-block;
  height: 8px;
  width: 8px;
  *vertical-align:middle;
  background: url(../images/iefixed-sprite.png) no-repeat 0 -24px;
}
.cpt-close:hover i {
  background-position: 0 -42px;
}
.img-rounded {
  border-radius: 6px;
}
#cnv {
	width:300px;
  	height:300px;
}
.my-alert {
    padding: 15px;
    margin-bottom: 20px;
    border: 1px solid transparent;
    border-radius: 4px;
}
.my-alert-danger {
    color: #a94442;
    background-color: #f2dede;
    border-color: #ebccd1;
}
.my-alert a {
    color: #337ab7;
    text-decoration: none;
}
.my-alert a:hover {
    color: #23527c;
    text-decoration: underlin;
}


.entry-cover img {
	display: block;
	width: 100%;
	height: auto;
	border-radius: 3px 3px 0 0;
	background: #fff ;
	-webkit-transition: all .3s;
	-moz-transition: all .3s;
	transition: all .3s;
	position: relative;
	display: block;
	overflow: hidden;
	-webkit-box-shadow:0 0 10px #ccc; 
	-moz-box-shadow:0 0 10px #ccc;
	box-shadow:0 0 10px #ccc;
}
.entry-cover:hover img {
	-webkit-transform: scale(1.1);
	-moz-transform: scale(1.1);
	transform: scale(1.1);
}
.entry-cover:hover:before {
	visibility: visible;
	opacity: .8;
	-ms-filter: "alpha(opacity=80)";
	filter: alpha(opacity=80);
}
.entry-cover:after {
	position: absolute;
	top: 50%;
	left: 0;
	z-index: 3;
	visibility: hidden;
	margin-top: -.5em;
	width: 100%;
	color: #fff;
	content: '+';
	text-align: center;
	font-size: 120px;
	font-family: arial;
	line-height: 1;
	opacity: 0;
	-ms-filter: "alpha(opacity=0)";
	filter: alpha(opacity=0);
	-webkit-transition: all .4s;
	-moz-transition: all .4s;
	-ms-transition: all .4s;
	transition: all .4s;
}
.entry-cover:before {
	position: absolute;
	top: 0;
	left: 0;
	z-index: 2;
	visibility: hidden;
	width: 100%;
	height: 100%;
	background: #4ea9de;
	content: '';
	opacity: 0;
	-ms-filter: "alpha(opacity=0)";
	filter: alpha(opacity=0);
	-webkit-transition: all .4s;
	-moz-transition: all .4s;
	-ms-transition: all .4s;
	transition: all .4s;
}
.entry-cover:hover:after {
	visibility: visible;
	opacity: 1;
	-ms-filter: "alpha(opacity=100)";
	filter: alpha(opacity=100);
}
/**设置遮挡块的布局**/
.entry-cover {
	position: relative;
	display: block;
	overflow: hidden;
}
.img{
	height: 200px;
	width: 400px;
}
/**可要可不要**/
a {
	color: #666;
	text-decoration: none;
	transition: color .2s;
}

#web_bg { display:none;}
/**
#web_bg {
    position:absolute;
    width:100%;
    height:100%;
    z-index:-1;
}
#web_bg img {
    width:100%;
    height:100%;
}
**/

/*
Stacks CSS ----------------------------------------------------------------------------------------------------------- */

/* Layout */
.stack { float: left; margin: 0 4% 4% 0; position: relative; z-index: 10; }

/* Image styles */
.stack img { max-width: 100%; height: auto; vertical-align: bottom; border: 10px solid #fff; border-radius: 3px;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	-webkit-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.4);
	-moz-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.4);
	box-shadow: 0 1px 4px rgba(0, 0, 0, 0.4);
}
.stack:last-of-type { margin-right: 0; }

/* Stacks creted by the use of generated content */
.stack:before, .stack:after { content: ""; border-radius: 3px; width: 100%; height: 100%; position: absolute; border: 10px solid #fff; left: 0;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	-webkit-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.4);
	-moz-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.4);
	box-shadow: 0 1px 4px rgba(0, 0, 0, 0.4);
	-webkit-transition: 0.3s all ease-out;
	-moz-transition: 0.3s all ease-out;
	transition: 0.3s all ease-out;
}
.stack:before { top: 4px; z-index: -10; } /* 1st element in stack (behind image) */
.stack:after { top: 8px; z-index: -20; } /* 2nd element in stack (behind image) */

/* Second stack example (rotated to the right from the bottom left) */
.stack.rotated:before {
	-webkit-transform-origin: bottom left;
	-moz-transform-origin: bottom left;
	transform-origin: bottom left;
	-webkit-transform: rotate(2deg);
	-moz-transform: rotate(2deg);
	transform: rotate(2deg);
}
.stack.rotated:after {
	-webkit-transform-origin: bottom left;
	-moz-transform-origin: bottom left;
	transform-origin: bottom left;
	-webkit-transform: rotate(4deg);
	-moz-transform: rotate(4deg);
	transform: rotate(4deg);
}

/* Third stack example (One stack element rotated in the opposite direction) */
.stack.twisted:before {
	-webkit-transform: rotate(4deg);
	-moz-transform: rotate(4deg);
	transform: rotate(4deg);
}
.stack.twisted:after {
	-webkit-transform: rotate(-4deg);
	-moz-transform: rotate(-4deg);
	transform: rotate(-4deg);
}

/* Fourth stack example (Similar to the second but rotated left) */
.stack.rotated-left:before {
	-webkit-transform-origin: bottom left;
	-moz-transform-origin: bottom left;
	transform-origin: bottom left;
	-webkit-transform: rotate(-3deg);
	-moz-transform: rotate(-3deg);
	transform: rotate(-3deg);
}
.stack.rotated-left:after {
	-webkit-transform-origin: bottom left;
	-moz-transform-origin: bottom left;
	transform-origin: bottom left;
	-webkit-transform: rotate(-6deg);
	-moz-transform: rotate(-6deg);
	transform: rotate(-6deg);
}

/* Reset all rotations on hover */
.stack:hover:before, .stack:hover:after {
	-webkit-transform: rotate(0deg);
	-moz-transform: rotate(0deg);
	transform: rotate(0deg);
}

canvas#canvas {
	background: #000;
	opacity: 0.15;
	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=15)";
	-webkit-filter: alpha(opacity=15);
	-moz-filter: alpha(opacity=15);
	filter: alpha(opacity=15);
}