@charset "utf-8";
/* ================================ */
/* Theme By ShopNC SystemLogin  	*/
/* Author:			Hulihutu		*/
/* Copyright:		www.shopnc.net	*/
/* Create Date:		Jun-01-2013		*/
/* Retrofit Date:	Jun-04-2013		*/
/* ================================ */

*{ word-wrap: break-word; outline:none; }
html, body { height:100%; margin:0; -webkit-text-size-adjust:none; }
body { background: #555; font-family: "Microsoft YaHei", "Lucida Grande", "Lucida Sans Unicode", Tahoma, Helvetica, Arial,  sans-serif;-webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
  width:100%;
  height:100%;}
h2, h5, h6 { margin: 0;}
input { outline:none}
ul, li {
	margin: 0;
	padding: 0;
	border: 0;
	list-style-image: none;
	list-style-type: none;
}

/* 登录页面顶部系统名称
---------------------------------------------------------------------*/
.login-layout { width: 700px; margin: -200px auto auto -340px; position: absolute; z-index: 3; top: 50%; left: 50%; }
.login-layout .top { color: #FFF; text-shadow: 1px 1px 0 rgba(0,0,0,0.25); text-align: center; width: 100%; height: 80px; margin: 0 auto 8% auto;}
.login-layout .top h5 { font-size: 13px; font-weight: 600; line-height: 20px; display: block; height: 20px;}
.login-layout .top h5 em { font-family:Tahoma; font-size: 10px; font-style: normal; margin-left: 4px;}
.login-layout .top h2 { font-size: 32px; font-weight: 600; line-height: 40px; display: block; height: 40px;}
.login-layout .top h6 { font-size: 12px; font-weight: 600; line-height: 20px; display: block; height: 20px;}

/* 登录页面登录表单部分
---------------------------------------------------------------------*/
.lock-holder { width: 100%; margin: 0 auto;}
.lock-holder .dot-left { font-size: 18px; color:#FFF; margin: 10px auto auto 20px; position: absolute;}
.lock-holder .dot-right { font-size: 18px; color:#FFF; margin: 10px auto auto 165px; position: absolute;}

.avatar { display: inline-block;}
.avatar img { width: 96px; margin: -1% auto 0 50px; border-radius: 50%; 
-moz-box-shadow: 0 0 0 3px rgba(255,255,255,0.25); 
-webkit-box-shadow: 0 0 0 3px rgba(255,255,255,0.25); 
box-shadow: 0 0 0 3px rgba(255,255,255,0.25); 
			transition: 300ms ease; 
	-webkit-transition: 300ms ease; 
	   -moz-transition: 300ms ease; 
         -o-transition: 300ms ease;}
.lock-holder .form-group { width: 250px; position: relative; z-index: 1;}
.lock-holder .form-group label { font-size: 14px; font-weight: 600; line-height: 20px; color: #FFF; display: block; height: 20px; padding-right: 10px; border-right: dotted 1px #FFF; position: absolute; z-index: 9; top: 10px; left: 10px;}

input { font-size: 14px; font-family: "Microsoft YaHei", "Lucida Grande", "Lucida Sans Unicode", Tahoma, Helvetica, Arial,  sans-serif; color: #fff;  height: 28px; padding: 5px 6px;  position: relative; z-index: 1; 
background: #2d2d2d; 
background: rgba(45,45,45,.15); 
border: 1px solid #3d3d3d; 
border: 1px solid rgba(255,255,255,.15); 
-moz-border-radius: 5px; 
-webkit-border-radius: 5px; 
border-radius: 5px; 
text-shadow: 0 1px 2px rgba(0,0,0,.1);
-moz-box-shadow: 0 2px 3px 0 rgba(0,0,0,.1) inset; 
-webkit-box-shadow: 0 2px 3px 0 rgba(0,0,0,.1) inset; 
box-shadow: 0 2px 3px 0 rgba(0,0,0,.1) inset; 
-o-transition: all .2s; 
-moz-transition: all .2s; 
-webkit-transition: all .2s; 
-ms-transition: all .2s;
			}

input:-moz-placeholder { color: #fff; }
input:-ms-input-placeholder { color: #fff; }
input::-webkit-input-placeholder { color: #fff; }
input:focus { filter:progid:DXImageTransform.Microsoft.gradient(enabled='true',startColorstr='#3F000000', endColorstr='#3F000000');background:rgba(0,0,0,0.25);
    outline: none; border-color: rgba(255,255,255,0.5);
    -moz-box-shadow:
        0 2px 3px 0 rgba(0,0,0,.1) inset,
        0 0 0 2px rgba(255,255,255,0.15);
    -webkit-box-shadow:
        0 2px 3px 0 rgba(0,0,0,.1) inset,
        0 0 0 2px rgba(255,255,255,0.15);
    box-shadow:
        0 2px 3px 0 rgba(0,0,0,.1) inset,
        0 0 0 2px rgba(255,255,255,0.15);
}
.input-text, .input-password { width: 184px; padding-left: 56px;}
.input-code { width: 88px;}

.submit { margin-top: 5%; text-align: center; font-size: 0; }
.submit .progress { width: 200px; margin: 0px auto;}
.submit span { position: relative; z-index: 1; vertical-align: top; zoom: 1;}
.submit .input-button { font-size: 15px;font-family: "Microsoft YaHei", "Lucida Grande", "Lucida Sans Unicode", Tahoma, Helvetica, Arial,  sans-serif; font-weight: 600; color: #FFF; background: #ef4300; width: 100px; height: 40px; margin: 0 0 0 10px; border: 1px solid #ff730e;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
	border-radius: 5px;   
    -moz-box-shadow:
        0 15px 30px 0 rgba(255,255,255,.25) inset,
        0 2px 7px 0 rgba(0,0,0,.2);
    -webkit-box-shadow:
        0 15px 30px 0 rgba(255,255,255,.25) inset,
        0 2px 7px 0 rgba(0,0,0,.2);
    box-shadow:
        0 15px 30px 0 rgba(255,255,255,.25) inset,
        0 2px 7px 0 rgba(0,0,0,.2);color: #fff;
    text-shadow: 0 1px 2px rgba(0,0,0,.1);
    -o-transition: all .2s;
    -moz-transition: all .2s;
    -webkit-transition: all .2s;
    -ms-transition: all .2s; cursor: pointer;}
.submit .input-button:hover {
    -moz-box-shadow:
        0 15px 30px 0 rgba(255,255,255,.15) inset,
        0 2px 7px 0 rgba(0,0,0,.2);
    -webkit-box-shadow:
        0 15px 30px 0 rgba(255,255,255,.15) inset,
        0 2px 7px 0 rgba(0,0,0,.2);
    box-shadow:
        0 15px 30px 0 rgba(255,255,255,.15) inset,
        0 2px 7px 0 rgba(0,0,0,.2);
}

.submit .input-button:active {
    -moz-box-shadow:
        0 15px 30px 0 rgba(255,255,255,.15) inset,
        0 2px 7px 0 rgba(0,0,0,.2);
    -webkit-box-shadow:
        0 15px 30px 0 rgba(255,255,255,.15) inset,
        0 2px 7px 0 rgba(0,0,0,.2);
    box-shadow:        
        0 5px 8px 0 rgba(0,0,0,.1) inset,
        0 1px 4px 0 rgba(0,0,0,.1);

    border: 0px solid #ef4300;
}


.submit2 { margin-top: 5%; text-align: center; }
.submit2 .progress { width: 200px; margin: 0px auto;}

.code { background-color: #FFFFFF; width: 114px; height: 34px; border-radius: 4px; position: absolute; z-index: 9; top: -55px; left: -10px; display: none; box-shadow: 0 2px 2px 2px rgba(0,0,0,0.25);}
.code .arrow { background:url(../images/login/login_code.gif) no-repeat 0 0; display: block; width: 14px; height: 7px; position: absolute; left: 21px; bottom: -7px;}
.code img { width: 90px; height: 26px; position: absolute; z-index: 1; top: 4px; left: 4px;}
.code .close { display: block; width: 10px; height: 10px; padding: 1px; position: absolute; z-index: 1; top: 4px; right: 4px;}
.code .close:hover, .login-layout .box span .code .change:hover { background-color: #CCC; border-radius: 5px; -webkit-border-radius: 5px/*webkit*/;}
.code .close i { background: url(../images/login/login_code.gif) no-repeat 0 -7px; display: block; width: 10px; height: 10px; opacity: 0.5;}
.code .change { display: block; width: 10px; height: 10px; padding: 1px; position: absolute; z-index: 1; bottom: 4px; right: 4px;}
.code .change i { background: url(../images/login/login_code.gif) no-repeat -10px -7px; display: block; width: 10px; height: 10px; opacity: 0.5;}
.code .close:hover i , .login-layout .box span .code .change:hover i { opacity: 1;}

.progress 
{
  height: 8px;
  margin-bottom: 20px;
  overflow: hidden;
  background-color: #000000;
  border-radius: 5px;
  -webkit-box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.1);
  box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.1);
}

.progress-bar {
  float: left;
  width: 0;
  height: 100%;
  font-size: 12px;
  line-height: 20px;
  color: #ffffff;
  text-align: center;
  background-color: #428bca;border-radius: 3px;
  -webkit-box-shadow: inset 0 -1px 0 rgba(0, 0, 0, 0.15);
          box-shadow: inset 0 -1px 0 rgba(0, 0, 0, 0.15);
  -webkit-transition: width 0.6s ease;
          transition: width 0.6s ease;
}

.progress-striped .progress-bar {
  background-image: -webkit-linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
  background-image: linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
  background-size: 40px 40px;
}

.progress.active .progress-bar {
  -webkit-animation: progress-bar-stripes 2s linear infinite;
          animation: progress-bar-stripes 2s linear infinite;
}

.progress-bar-success {
  filter:progid:DXImageTransform.Microsoft.gradient(enabled='true',startColorstr='#E5FFFFFF', endColorstr='#E5FFFFFF');background:rgba(255,255,255,0.9);
}

.progress-striped .progress-bar-success {
  background-image: -webkit-linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
  background-image: linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
}

.progress-bar-info {
  background-color: #5bc0de;
}

.progress-striped .progress-bar-info {
  background-image: -webkit-linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
  background-image: linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
}

.progress-bar-warning {
  background-color: #f0ad4e;
}

.progress-striped .progress-bar-warning {
  background-image: -webkit-linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
  background-image: linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
}

.progress-bar-danger {
  background-color: #d9534f;
}

.progress-striped .progress-bar-danger {
  background-image: -webkit-linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
  background-image: linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
}

.animated{-webkit-animation-duration:1s;animation-duration:1s;-webkit-animation-fill-mode:both;animation-fill-mode:both;}
.animated.hinge{-webkit-animation-duration:2s;animation-duration:2s;}

@-webkit-keyframes fadeOutLeft {
  0% {
    opacity: 1;
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }

  100% {
    opacity: 0;
    -webkit-transform: translateX(-20px);
    transform: translateX(-20px);
  }
}

@keyframes fadeOutLeft {
  0% {
    opacity: 1;
    -webkit-transform: translateX(0);
    -ms-transform: translateX(0);
    transform: translateX(0);
  }

  100% {
    opacity: 0;
    -webkit-transform: translateX(-20px);
    -ms-transform: translateX(-20px);
    transform: translateX(-20px);
  }
}

.fadeOutLeft {
  -webkit-animation-name: fadeOutLeft;
  animation-name: fadeOutLeft;
}
@-webkit-keyframes fadeOutRight {
  0% {
    opacity: 1;
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }

  100% {
    opacity: 0;
    -webkit-transform: translateX(20px);
    transform: translateX(20px);
  }
}

@keyframes fadeOutRight {
  0% {
    opacity: 1;
    -webkit-transform: translateX(0);
    -ms-transform: translateX(0);
    transform: translateX(0);
  }

  100% {
    opacity: 0;
    -webkit-transform: translateX(20px);
    -ms-transform: translateX(20px);
    transform: translateX(20px);
  }
}

.fadeOutRight {
  -webkit-animation-name: fadeOutRight;
  animation-name: fadeOutRight;
}






/* 登录页面底部版权信息
---------------------------------------------------------------------*/
.bottom {  font-family: Verdana, Tahoma; line-height: 16px; color: #FFF; text-shadow: 1px 1px 0 rgba(0,0,0,0.25); text-align: center; width: 600px; margin-left: -300px; position: fixed; bottom: 60px; left: 50%;}
.bottom a { color: #FFFFFF; text-decoration: none;}
.bottom a:hover { color: #FF0; text-decoration: blink;}
.bottom h5 {font-size: 12px;}
.bottom h6 { font-size: 10px;}


.avatar-top img { margin-top: -40px;
  -webkit-transition: 800ms ease;
     -moz-transition: 800ms ease;
       -o-transition: 800ms ease;
          transition: 800ms ease;
}



	#supersized-loader { position:absolute; top:50%; left:50%; z-index:0; width:60px; height:60px; margin:-30px 0 0 -30px; text-indent:-999em; background:url(../images/loading.gif) no-repeat center center;}
	
	#supersized {  display:block; position:fixed; left:0; top:0; overflow:hidden; z-index:-999; height:100%; width:100%; }
		#supersized img { width:auto; height:auto; position:relative; display:none; outline:none; border:none; }
			#supersized.speed img { -ms-interpolation-mode:nearest-neighbor; image-rendering: -moz-crisp-edges; }	/*Speed*/
			#supersized.quality img { -ms-interpolation-mode:bicubic; image-rendering: optimizeQuality; }			/*Quality*/
		
		#supersized li { display:block; list-style:none; z-index:-30; position:fixed; overflow:hidden; top:0; left:0; width:100%; height:100%; background:#111; }
		#supersized a { width:100%; height:100%; display:block; }
			#supersized li.prevslide { z-index:-20; }
			#supersized li.activeslide { z-index:-10; }
			#supersized li.image-loading { background:#111 url(../images/loading.gif) no-repeat center center; width:100%; height:100%; }
				#supersized li.image-loading img{ visibility:hidden; }
			#supersized li.prevslide img, #supersized li.activeslide img{ display:inline; }


#supersized img { max-width: none !important }


