Visit Nepal 2020
Welcome to Nepal
Lifetime Experience & Visit
Nepal One time is not enough
Learn More
Sign Up
*{
margin: 0;
padding: 0;
box-sizing: border-box;
font-family: 'Josefin Sans', sans-serif;
}
header{
width: 100%;
height: 100vh;
background-image: url('bg.jpg');
background-size: 100% 100%;
}
nav{
width: 100%;
height: 10vh;
background-color:rgba(0,0,0,0.2);
color: blanchedalmond;
display: flex;
justify-content: space-between;
align-items: center;
text-transform: uppercase;
}
.logo{
width: 25%;
text-align: center;
}
.menu{
width: 40%;
display: flex;
justify-content: space-around;
}
.menu a{
text-decoration: none;
color: blanchedalmond;
font-weight: bold;
width: 25%;
}
.menu a:first-child{
color: palevioletred;
}
main{
width: 100%;
height: 85vh;
display: flex;
justify-content:center;
align-items: center;
color: blanchedalmond;
text-align: center;
}
section{
font-family: 'Josefin Sans', sans-serif;
padding-top: 40px;
}
section h3{
font-size: 35px;
font-weight: 200;
letter-spacing: 3px;
text-shadow: 1px 2px 2px black;
}
section h1{
margin: 30px 0 20px 0;
font-size: 55px;
font-weight: 700px;
text-shadow: 2px 1px 5px black;
}
section p{
font-size: 25px;
word-spacing: 2px;
margin-bottom: 25px;
text-shadow: 1px 1px 1px black;
}
section a{
padding: 20px 30px;
border-radius: 4px;
outline: none;
text-transform: uppercase;
font-size: 13px;
font-weight: 500px;
text-decoration: none;
letter-spacing: 1px;
}
.btnone{
background: white;
color: black;
margin-right: 15px;
transition: all .5s ease;
}
.btnone:hover{
background: palevioletred;
color: papayawhip;
}
.btntwo{
background: palevioletred;
color: papayawhip;
transition: all .5s ease;
}
.btntwo:hover{
background: white;
color: black;
}
.city::after{
content: '';
animation:changetext 10s infinite linear;
color: palevioletred;
text-transform: uppercase;
}
@keyframes changetext{
0%{ content: "Pokhara"}
25%{ content: "Gorkha"}
50%{ content: "Dhading"}
75%{ content: "Kathmandu"}
100%{ content: "Mustang"}
}
footer{
width: 100%;
height: 5vh;
display:flex;
justify-content: center;
align-items: center;
background: rgba(0,0,0,0.4);
}
Comments
Post a Comment