html,
body {
  width: 100%;
  height: 100%;
  min-width: 100%;
  min-height: 100%;
  font-size: 14px;
  font-family: Arial, Helvetica, sans-serif;
  padding: 0;
  margin: 0;
  overflow: hidden;
}

.page {
  position: relative;
  width: 100%;
  height: 100%;
  background-size: cover;
  overflow: auto;
}

.container-content-warp {
  background: url(../Images/bg.jpg) center center;
  width: 100%;
  height: 100%;
  background-size: 100%  100%;
}



.container-content {
  display: flex;
  justify-content: space-between;
  width: 1000px;
  position: absolute;
  top: 55%;
  left: 50%;
  margin-top: -220px;
  margin-left: -500px;
}

.container-content .container-content-left  {
 display: flex;
 justify-content: space-between;
 color: #fff;
}
.container-content .container-content-left .imgwarp {
  background: url(../Images/LOGO.png) no-repeat center;
  width: 145px;
  height: 145px;
  position: relative;
}
.container-content .container-content-left .imgwarp img:nth-child(1) {
  width: 80px;
  height: 80px;
  margin:30px 30px;
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
margin: auto;
}

.container-content-left .title1{
  font-size: 46px;
font-weight: bold;
margin-left: 30px;
margin-top: 15px;
margin-bottom: 0px;
}
.container-content-left .title2{
  font-size: 26px;
margin-left: 30px;
margin-top: 5px;
}


.container-content-right{
  position: relative;
}
.container-content-right-main {
  height: calc(100% - 65px);
  margin: 0px 34px 0px 40px;
}
.iconwarp{
  position: relative;
}
.iconwarp img {
  position: absolute;
  left: 5px;
  top: 3px;
  width: 24px;
  height: 24px;
}
.iconwarp:nth-child(2) img{
  width: 28px;
  height: 28px; top: 2px; left: 4px;
}
.form-inline .form-group {
  margin-top: 20px;
}

.code {
  display: inline-block;
  width: 90px;
  height: 30px;
  margin-left: 17px;
  background-color: #fff;
  border-radius: 3px;
  cursor: pointer;
}

.remember-pass {
  color: #000;
}


.has-feedback .form-control::placeholder {
  color: #fff;
}

.has-feedback .form-control {
  padding-left: 32.5px;
  padding-right: 0 !important;
  font-size: 14px;
  line-height: 30px;
  color: #fff;
  width: 185px;
  background: rgba(196, 193, 196, 0.2);
  border: none;
  border-radius:5px ;
  outline: none;
}
.datumKeywarp{
  display: flex;
  justify-content: space-between;
}
.datumKey{
  background: rgba(196, 193, 196, 0.2);
  border: none;
  border-radius:5px ;
  outline: none;
  height: 29px;
  color:white;
  padding-left: 5px;
}
.datumKey::placeholder {
  color: #fff;
}
.has-feedback .form-control:focus {
  border-color: #66afe9;
}

.form-group>.btn-login {
  font-size: 14px;
  color: #2f2f2f;
  border-radius: 5px;
  border: none;
  width: 100%;
  height: 30px;
}

.form-group>.btn-login:hover {
  background-color: #006cff;
}

.form-control-feedback {
  left: 0;
  color: #fff;
}

.remember,
.forgot {
  display: inline-block;
  width: 105px;
  color: #fff;
}

.remember {
  text-align: left;
}

.remember>label {
  cursor: pointer;
}

.remember>label {
  margin-bottom: 0;
  font-weight: 500;
  vertical-align: middle;
}

.forgot {
  text-align: right;
}

.forgot>a {
  color: #9E9E9E;
}




.page>img {
  margin: 20px;
  position: absolute;
}



.footer p {
  padding-left: 42%;
  font-size: 12px;
}

.footer div {
  width: 100%;
}

.footer {
  height: 56px;
  padding-top: 5px;
  color: #dedede;
  line-height: 10px;
  border-top: 1px solid #dedede;
  position: fixed;
  width: 100%;
  bottom: -1px;
  z-index: 5;
}
.line{
  position: absolute;
    width: 1px;
    height: 85%;
    left: 0;
    top:5px;
    background: #9e9e9e;
}