/* html {
  margin: 0px;
  height: 100%;
  width: 100%;
} */
@import url('https://fonts.googleapis.com/css?family=Abel');

*{
	padding: 0;
	margin: 0;
}

html{
	height: 100vh;
}
body {
  /* padding: 50px; */
  /* font: 14px "Lucida Grande", Helvetica, Arial, sans-serif;   */
  font-family: 'Abel', sans-serif;
  /* margin: 35px; */
  /* margin-bottom: 10%; */
  height: 100vh;
  overflow: hidden;
  

  /* background: 
  linear-gradient(rgba(0,0,0,.7), rgba(0,0,0,.7)),
  url("../images/bg.jpg"); */
  background-repeat: no-repeat;
  background-attachment: fixed;
  background-size: cover;
  opacity: 1;
  height: 100%;
  padding: 20px;

}


#myVideo{
	object-fit: cover;
	width: 100vw;
	height: 100vh;
	position: fixed;
	top: 0;
	left: 0;
	z-index: -1;
}

a {
  color: #00B7FF;
}

/* h1{
  color: aliceblue;
}

h3{
  color: aliceblue;
}

h5{
  color: aliceblue;
} */

/* /////-------------NEW FORM------------\\\\\ */

*,:after,:before{box-sizing:border-box}
.clearfix:after,.clearfix:before{content:'';display:table}
.clearfix:after{clear:both;display:block}
a{color:inherit;text-decoration:none}

.login-wrap{
	width:100%;
	margin:auto;
	max-width:525px;
	/* min-height:400px; */
	position:relative;
	/* background:url(https://raw.githubusercontent.com/khadkamhn/day-01-login-form/master/img/bg.jpg) no-repeat center; */
	box-shadow:0 12px 15px 0 rgba(0,0,0,.24),0 17px 50px 0 rgba(0,0,0,.19);
}

.form-container{
	max-width: 600px;
	min-height: 400px;
	padding: 3rem;
	position: relative;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
}

.form-container::after{
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-color: rgb(0, 0, 0);
	opacity: .8;
	z-index: -1;
	border-radius: 10px;
	box-shadow: 0px 0px 10px rgba(0, 148, 45, 0.521);
}


h1{
	font-size: 4rem;
	font-weight: bold;
}

h3{
	font-size: 2rem;
	color: #b9b9b9;
}

h5{
	font-size: 1rem;
	color: #b9b9b9;
}

span{
	color: orangered;
	margin-left: -10px;
}

.login-html{
	width:100%;
	height:100%;
	position:absolute;
	padding:90px 70px 50px 70px;
	/* background:rgba(40,57,101,.9); */
}
.login-html .sign-in-htm
{
	top:0;
	left:0;
	right:0;
	bottom:0;
	position:absolute;
  backface-visibility:hidden;
  margin-top: -50px;
}


.login-html .tab,
.login-form .group .label,
.login-form .group .button{
	text-transform:uppercase;
}
.login-html .tab{
	font-size:22px;
	margin-right:15px;
	padding-bottom:5px;
	margin:0 15px 10px 0;
	display:inline-block;
	border-bottom:2px solid transparent;
}

.login-form{
	min-height:345px;
	position:relative;
	perspective:1000px;
	transform-style:preserve-3d;
}
.login-form .group{
	margin-bottom:15px;
}
.login-form .group .label,
.login-form .group .input,
.login-form .group .button{
	width:100%;
	color:#fff;
	display:block;
}

.login-form .group .input,
.login-form .group .button{
	border:none;
	padding:15px 20px;
	border-radius:25px;
	background:rgba(255,255,255,.1);
}

.login-form .group .label{
	color:#aaa;
	font-size:12px;
}
.login-form .group .button{
  background:#ee8e11;
  opacity: .7;
}

.hr{
	height:2px;
	margin:60px 0 50px 0;
	background:rgba(255,255,255,.2);
}
.logo{
  position: absolute;
}


/* --------------->>>>>>>>>>>>>formend<<<<<<<<<<<<<<<<------------------ */
.myinput{
	/* opacity: .7; */
	border:none;
	border-radius:25px;
	background:rgba(255,255,255,.1);
	width:100%;
	padding:11px 16px;
	color:#fff;
	display:block;
	text-align: center;
	margin: 10px 0;
}

.mylabel{
	color:#aaa;
	font-size:12px;
}

.mybutton{
	text-transform:uppercase;
	width:100%;
	color:#fff;
	/* display:block; */
	background:#ee8e11;
	opacity: .7;
	border:none;
	padding:11px 16px;
	border-radius:25px;
}