@import url("universal.css");

body{
    height:100%;
    overflow:hidden;
}


.background-vid{
  width:100vw;
  height:100vh;
  z-index:-20;
  position:absolute;
  margin:-8px;
  filter:brightness(30%);
      object-fit:cover;
}

.lander-container{
  width:100vw;
  margin:-8px;
  height:calc(100vh - 70px);
  display:flex;
  align-items:center;
    z-index:-2;
}
.lander-left-section{
  padding:0px;
  transform: translate(100px, 0px);
  display:flex;
  justify-content:left;
  align-items:center;
  text-align:left;
  flex-direction:row;
}
.left-section-p{
  display:flex;
  justify-content:left;
  text-align:left;
  flex-direction:column;
}
.name{
   font-size:70px;
  font-weight:bold;
  margin:-10px 0px;
  color:#1e70ff;
  letter-spacing: 2px;
  
}
.job{
    font-size:30px;
  font-weight:bold;
  color:white;
  margin:30px 0px;
  margin-top:20px;
  display:flex;
  align-items:center;
}
.fa-gamepad{
  margin:0px 10px;
}
.btn-14 {
  border: 2px solid #000;
  z-index: 1;
  background:transparent;
  border:2px solid white;
  border-radius:10px;
  width:130px;
  height:50px;
  font-size:15px;
  color:white;
  font-weight:bold;
    transition:.3s;
  display:flex;
  justify-content:center;
  flex-direction:row;
  align-items:center;
  text-align:center;
     letter-spacing: 2px;
}
.btn-14:after {
  position: absolute;
  content: "";
  height:50px;
  right: 0;
  left: 0;
  width: 0px;
  z-index: -1;
  background: white;
    border-radius:10px;
  transition: all 0.3s ease;
    border:0px solid white;
  
}
.btn-14:hover {
  color: #1e70ff;
  
}
.btn-14:hover:after {
  left: 0;
  width: 130px;
  border:2px solid white;
}


.left-section-button-container{
  display:flex;
  justify-content:left;
  align-items:center;
  width:auto;
    transition:0.3s;
}
@media only screen and (max-width: 1000px) {

 .lander-container{
   display:flex;
  justify-content:center;
  align-items:center;
}
 .left-section-p{
  display:flex;
  justify-content:center;
  text-align:center;
  flex-direction:column;
}

.lander-left-section{
  padding:0px;
  transform: translate(0px, 0px);
  display:flex;
  justify-content:center;
  align-items:center;
  text-align:center;
  flex-direction:row;
}
.left-section-button-container{
  display:flex;
  justify-content:center;
  align-items:center;
  width:100%;
}


}