@import url('https://fonts.googleapis.com/css2?family=Nunito:wght@200;300;900&display=swap');	*
	{
	  margin: 0;
	  padding: 0;
	  box-sizing: border-box;
	  font-family: 'Nunito', sans-serif;
	}
	body{background-color:#000}
	header
	{
	  position: absolute;
	  top: 80px;
	  right: 94px;
	  z-index: 1000;
	  display: flex;
	  justify-content: space-between;
	  align-items: center;
	}
	header .logo
	{
	  color: #fff;
	  text-transform: uppercase;
	  cursor: pointer;
	  background: url('logo_stacks88.png')no-repeat;
	  background-size: contain;
	  width: 260px;
	  height: 70px;
	}
	.toggle
	{
	  position: relative;
	  width: 60px;
	  height: 60px;
	  background: url(https://i.ibb.co/HrfVRcx/menu.png);
	  background-repeat: no-repeat;
	  background-size: 30px;
	  background-position: center;
	  cursor: pointer;
	}
	.toggle.active
	{
	  background: url(https://i.ibb.co/rt3HybH/close.png);
	  background-repeat: no-repeat;
	  background-size: 25px;
	  background-position: center;
	  cursor: pointer;
	}
	.showcase
	{
	  position: absolute;
	  right: 0;
	  width: 100%;
	  min-height: 100vh;
	  padding: 100px;
	  display: flex;
	  justify-content: space-between;
	  align-items: center;
	  background: #111;
	  transition: 0.5s;
	  z-index: 2;
	}
	.showcase.active
	{
	  right: 300px;
	}

	.showcase video
	{
	  position: absolute;
	  top: 0;
	  left: 0;
	  width: 100%;
	  height: 100%;
	  object-fit: cover;
	  opacity: 0.8;
	}
	.overlay
	{
	  position: absolute;
	  top: 0;
	  left: 0;
	  width: 100%;
	  height: 100%;
	  background: radial-gradient(ellipse at center, rgba(48,52,54,0) 0%, rgb(9 9 9 / 90%) 100%);
	}
	.text
	{
	  position: relative;
	  z-index: 10;
	}
	.text h2, .text h3, .text p{text-shadow: 3px 3px 7px #333;}
	.text h2
	{
	  font-size: 5em;
	  font-weight: 800;
	  color: #fff;
	  line-height: 1em;
	  z-index: 2;
	  position: relative;
	}
	.text h3
	{
	  font-size: 3em;
	  font-weight: 700;
	  color: #fff;
	  line-height: 1.25em;
	  text-transform: uppercase;
	  position: relative;
	  z-index: 2;
	  border-bottom: 1px solid #999;
	}
	.text p
	{
	  font-size: 2em;
	  color: #fff;
	  font-weight: 100;
	  max-width: 700px;
	  position: relative;
	  z-index: 2;
	}
	.text a
	{
	  display: inline-block;
	  font-size: 1em;
	  background: #fff;
	  padding: 10px 30px;
	  text-transform: uppercase;
	  text-decoration: none;
	  font-weight: 500;
	  margin-top: 10px;
	  color: #111;
	  letter-spacing: 2px;
	  transition: 0.2s;
	}
	.text a:hover
	{
	  letter-spacing: 6px;
	}
	.social
	{
	  position: absolute;
	  z-index: 10;
	  bottom: 20px;
	  right: 7em;
	  display: flex;
	  /* justify-content: center; */
	  /* align-items: center; */
	}
	.social li
	{
	  list-style: none;
	  color: #797574;
	  font-size: 12px;
	  text-shadow: 1px 1px 3px #000;
	}
	.social li a
	{
	  display: inline-block;
	  margin-right: 20px;
	  filter: invert(1);
	  transform: scale(0.5);
	  transition: 0.5s;
	}
	.social li a:hover
	{
	  transform: scale(0.5) translateY(-15px);
	}
	.menu
	{
	  position: absolute;
	  top: 0;
	  right: 0;
	  width: 300px;
	  height: 100%;
	  display: flex;
	  justify-content: center;
	  align-items: center;
	}
	.menu ul
	{
	  position: relative;
	}
	.menu ul li
	{
	  list-style: none;
	}
	.menu ul li a
	{
	  text-decoration: none;
	  font-size: 24px;
	  color: #111;
	}
	.menu ul li a:hover
	{
	  color: #03a9f4; 
	}
	.mlogin{
		position:absolute;
		top: 9em;
		right: 80px;
		border-radius: 7px;
		z-index: 1;
		height: 195px;
		box-shadow: 0 15px 95px 20px #000;
	}
	.mlogin:after {
		display: none;
		content: 'Secure Access';
		color: #0b1f26;
		position: absolute;
		top: -18px;
		left: 0;
		text-transform: uppercase;
		letter-spacing: .35px;
		font-size: 12px;
		background: #888276;
		font-weight: bold;
		padding: 1px 20px 1px 10px;
		border-radius: 10px 50px 0 0;
		text-shadow: 2px 2px 1px rgb(255 255 255 / 25%);
	}
	.mlogin span {
		color: #fff;
		font-weight: bold;
		font-size: 14px;
		text-transform: uppercase;
		letter-spacing: 5px;
	}
	.lgnsdhw {border: 1px solid #a58e62;background: linear-gradient(to bottom, rgb(48 43 41) 0%, rgba(87,77,71,1) 35%,  rgba(48 43 41) 100%);border-radius: 10px;}
	.logintxt, .logintxt2 {
		height: 40px;
		width: 80%;
		padding: 0 !important;
		background: #2b2724;
		outline:0;
		color: #fff;
		text-transform: uppercase;
		letter-spacing: 1.5px;
		text-align: center;
		font-size: 1.1em;
		border-width: 0;
		margin-bottom: 10px;
		border-radius: 7px;
		border: 1px solid hsl(25deg 10% 45% / 50%);
		box-shadow: inset 0 2px 3px 0px hsl(0deg 0% 0% / 55%);
	}
	.lgnsout{
    box-shadow: inset 0 0 50px 5px hsl(0deg 0% 0% / 75%);
    width: 295px;
    height: 195px;
    border-radius: 10px;
    text-align: center;
    position: relative;
    padding-top: 1.7em;
}

	.btn01 {
		background: #006501;
		font-size: 1.1em;
		color: #ccc;
		text-transform: uppercase;
		letter-spacing: 1.75px;
		border-radius: 7px;
		font-weight: bold;
		line-height: 2em;
		border: 1px solid #00d00c;
		border-right: 1px solid #1f7908;
		border-left: 1px solid #1f7908;
		border-bottom: 1px solid #125410;
		box-shadow: 0 3px 5px 1px hsl(0deg 0% 4% / 50%);
		padding: 0 15px;
		width: 80%;
		margin-top: 0;
		}
	.btn01:hover{background: #00a702;color: #fff;text-shadow:0 1px 3px #000}
	.btn01:focus, .btn01:active{box-shadow:0 0 15px 1px hsl(120deg 100% 50% / 50%);color: yellow;border: 2px solid #000;}
	.errortxt {
	  z-index: 9999;
	  font-size: 14px;
	  color: red !important;
	  text-transform: uppercase;
	  position: relative;
	  left: 0;
	  font-weight: 700;
	  width: 100%;
	  text-align: center;
	  top: 30px;
	  height: 20px;
	}
	.errortxt span{color:red !Important;letter-spacing:1px;}
	input::-webkit-input-placeholder {
	-webkit-transition: opacity .3s linear;
	color: #a9a9a9
	}
	input:focus::-webkit-input-placeholder {
	  opacity: .35;
	  color: #a9a9a9
	}
	.prom-img1, .prom-img2{position: absolute;z-index: 1;}
	.prom-img1{		
		width: 315px;
		height: 389px;
		top: -170px;		
		right: 0;
	}
	.prom-img2{
    width: 80px;
    top: -100px;
    right: 0;
}
	.responsive {
	  width: 100%;
	  height: auto;
	}
	.pcolor{color: lime;}
	@media (max-width: 991px)
	{
	  .showcase,
	  .showcase header
	  {
		/* padding: 40px; */
		}
	  .text h2
	  {
		font-size: 3em;
	  }
	  .text h3
	  {
		font-size: 2em;
	  }
	}