*{
       margin: 0;
       padding: 0;
   }
   html{
       width: 100%;
       height: 100%;
   }
   body{
       width: 100%;
       height: 100%;
       background-color: #5878A5;
   }
   .login-container{
       position: absolute;
       top: 50%;
       left: 50%;
       width: 360px;
       height: 400px;
       transform: translateX(-50%) translateY(-50%);
       -webkit-transform: translateX(-50%) translateY(-50%);
       -moz-transform: translateX(-50%) translateY(-50%);
       -ms-transform: translateX(-50%) translateY(-50%);
   }
   .left-login{
       width: 100%;
       height: 40%;
       padding: 4px 72px;
       box-sizing: border-box;
       background: url(../public/images/login/left-login.png) no-repeat 0 0 /100% 100% rgba(255,255,255,.7);
       background-origin: content-box;
   }
   .right-login{
       width: 100%;
       height: 60%;
       background: rgba(255,255,255,.55);
   }
   .title-login{
       position: absolute;
       top: -112px;
       width: 100%;
       padding-top: 4px;
       font-size: 24px;
       text-align: center;
       color: #154b7e;
       line-height: 30px;
   }
    .title-login p{
    	font-size: 12px;
    }
   .right-login > .form-container{
       position: relative;
       width: 80%;
       margin-left: 10%;
   }
   .form-container > form > label,
   .form-container > form > input{
       display: block;
       margin-top: 16px;

   }
   .form-container > form > label{
       position: relative;
   }
   .form-container > form > label img:first-child{
       position: absolute;
       left: 4px;
       top: 8px;
       width: 24px;
   }
   .form-container > form > label img:last-child{
       position: absolute;
       right: 4px;
       top: 8px;
       width: 24px;
       cursor: pointer;
   }
   .form-control {
       display: block;
       width: 100%;
       height: 40px;
       padding: 6px 46px;
       border: 1px solid #ccc;
       border-radius: 4px;
       box-sizing: border-box;
       font-size: 14px;
       line-height: 1.4;
       color: #585858;
       background-color: #fff;
   }
   .form-control:focus {
       background-color: #fff;
       outline: 0;
       -webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.055), 0 0 5px rgba(47, 64, 86, .2);
       box-shadow: inset 0 1px 1px rgba(0,0,0,.055), 0 0 5px rgba(47, 64, 86, .2);
   }
   input[type=button]{
       border: 1px solid rgba(6, 127, 228, 1);
       font-size: 18px;
       color: #fff;
       background: rgba(6, 127, 228, 0.71);
       cursor: pointer;
   }
   input[type=button]:hover{
	     -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);
   }
    input[type=button]:focus,input[type=button]:active{
	    border: 1px solid rgb(6, 127, 228);
	    color:  #fff;
	    background-color: rgba(6, 127, 228, 0.71);
   }
   #login-y,#psd-y{
      border: 1px solid rgba(145,145,145,0.1);
   	  background-color: rgba(145,145,145,.15);
   }
   .alert.alert-add{
		height: 12px;
		padding: 2px;
		padding-top: 10px;
		border-radius: 4px;
		line-height: 12px;
	    font-size: 12px;
		background-color: transparent;
		margin-bottom: 0;
		border-color: transparent;
   }
   .tips{
	   margin-top: 16px;
	   line-height: 12px;
	   font-size: 12px;
   }
   .fr{
  	 	float: right;
   }
 	@media only screen and (min-width: 992px){
      body{
      }
      .login-container{
         width: 1000px;
         height: 360px;
      }
      .left-login{
          float: left;
          width: 50%;
          height: 100%;
          padding: 20px;
      }
      .right-login{
          float: left;
          width: 50%;
          height: 100%;
      }
      .title-login{
     	   position: static;
          margin: 40px 0;
          color: #256b9e;
      }
    body  .alert.alert-add{
    margin-top: -30px;
    padding: 2px;
    }
  }