body{
  margin:0;
  font-family:sans-serif;
  background:#0a0a0a;
  color:white;
}

/* NAV */
.navbar{
  display:flex;
  justify-content:space-between;
  padding:15px;
  position:fixed;
  width:100%;
  background:rgba(255,255,255,0.05);
  backdrop-filter:blur(10px);
}

.logo{
  height:40px;
}

/* HERO */
.hero{
  height:100vh;
  position:relative;
  display:flex;
  align-items:center;
  justify-content:center;
}

.overlay{
  position:absolute;
  width:100%;
  height:100%;
  background:rgba(0,0,0,0.6);
}

.slider img{
  position:absolute;
  width:100%;
  height:100%;
  object-fit:cover;
  opacity:0;
  transition:1s;
}

.slider img:first-child{
  opacity:1;
}

.hero-content{
  position:relative;
  text-align:center;
}

.btn-primary{
  background:#00c896;
  padding:10px 20px;
  color:white;
  text-decoration:none;
  border:none;
  margin:5px;
}

.btn-outline{
  border:1px solid #00c896;
  padding:10px 20px;
  color:#00c896;
  text-decoration:none;
  margin:5px;
}

/* CARD */
.card{
  background:#111;
  padding:20px;
  margin:20px;
  border-radius:10px;
}

input{
  display:block;
  width:100%;
  padding:10px;
  margin:10px 0;
}