*{
  margin: 0;
  padding: 0;
font-family: 'Josefin Sans',sans-serif;
}
header{
  width: 100%;
    height: 100vh;
    background-image: linear-gradient(rgba(0, 0, 0, 0.3),rgba(0, 0, 0, 0.5)),url(k.jpg);
    background-position: center;
    background-size: cover;
}
.yash{
  width: 100%;
  height: 14vh;
  background: rgba(0,0,0,0.30);
  color: #fff;
  display: flex;
  justify-content: space-between;
align-items: center;
text-transform: capitalize;
}
.yash .logo{
  width: 25%;
  text-align: center;
}
.yash .menu{
  width: 44%;
  text-align: center;
  display: flex;
  justify-content: space-between;
  padding-right:  15px;
  text-decoration: none;

}
.yash .menu a{
  text-decoration: none;
  color: white;
  cursor: pointer;
   font-weight: bold;
}
.main{
  width: 100%;
  height: 50vh;
  margin-top: 160px;
    align-items: center;
  text-align: center;
color: white;
}

.main h3{
  font-size: 35px;
  font-weight: 200;
  letter-spacing: 3px;
  text-shadow: 1px 1px 2px black;
}
.main h1{
  font-size: 55px;
  margin: 30px 0 20px 0;
  font-weight: 700;
  text-shadow: 2px 1px 5px black;
  text-transform: uppercase;
}
.main P{
  font-size: 25px;
  word-spacing: 2px;
  text-shadow: 1px 1px 1px black;
  margin-bottom: 20px;
}
.main a{
  text-decoration: none;
  color: black;
  font-size: 15px;
  font-weight: 500;
  letter-spacing: 1px;
  padding: 12px 30px;
  border-radius: 5px;
  text-transform: uppercase;

}
.menu a{
  position: relative;
  text-decoration: none;
  color: black;

}
.menu a::after{
  content: "";
  height: 5px;
  width: 0;
  background-color: red;
  position: absolute;
  left: 0;
  bottom: -10px;
  transition: 0.5s;
}
.menu a:hover::after{
  width: 100%;
}
.menu a:first-child{
  color: #00b894;
}
.main .one{
  background-color: #fff;
  color: #000;
}
.main .two{
  background-color: #00b894;
  color: #000;
}
.main .three{
  background-color: #fff;
  color: #000;
}
.change_content:after{
  content: "";
  animation: changetext 10s infinite linear;
  color: #00b894;
}

@keyframes changetext {
  0%{
    content: "Bihar";
  }
  20%{content: "Agra";}
  20%{content: "Jaipur";}
  30%{content: "Goa";}
  40%{content: "Kolkata";}
  50%{content: "Mumbai";}
  60%{content: "Kerala";}
  70%{content: "Assam";}
  80%{content: "Ayodhya";}
  90%{content: "Gujarat";}
  95%{content: "Manali";}
  100%{content: "J & K";}
}
.one:hover{
  background-color: #00b894;
  color: #000;
}
.two:hover{
  background-color: #fff;
  color: #000;
}
.menu a{

}
