*{
margin:0;
padding:0;
font-family:sans-serif;
}

body {
margin:0;
background-image: url("https://owlex.neocities.org/roomback.png");
background-size: 100%;
background-color: #ddd;
}

/* Banner Background */

.banner {
width:100%;
height:100vh;
background-image: url("https://owlex.neocities.org/roomback.png");
background-size: cover;
background-repeat: no-repeat;
background-position:center;
}

/* Navbar */

.navbar {
width:85%;
margin:auto;
padding:35px 0;
display:flex;
align-items:center;
justify-content:space-between;
}

.logo {
width:120px;
cursor:pointer;
}

.logo:hover {
display:inline-block;
animation:rotate360 4s linear infinite;
}

@keyframes rotate360{
from{transform:rotate(0deg);}
to{transform:rotate(360deg);}
}

/* Nav Links */

.navbar2 ul li{
list-style:none;
display:inline-block;
margin:-67px 20px 50px;
position:relative;
text-align:center;
float:right;
}

.navbar2 ul li a{
text-decoration:none;
color:#fff;
text-transform:uppercase;
font-weight:bold;
}

.navbar2 ul li a:hover{
color:hotpink;
transition:0.3s;
}

.navbar2 ul li::after{
content:'';
height:3px;
width:0;
background:#00ff40;
position:absolute;
left:0;
bottom:-10px;
transition:0.5s;
}

.navbar2 ul li:hover::after{
width:100%;
}

/* Content */

.content{
width:100%;
position:absolute;
top:50%;
transform:translateY(-50%);
text-align:center;
color:#fff;
}

.content h1{
font-size:70px;
margin-top:80px;
margin-right:300px;
}

.content p{
margin:20px auto;
text-align:center;
line-height:20px;
}

/* Photo */

.photo{
border-radius:50%;
margin-top:-750px;
margin-right:50px;
float:right;
border:5px solid #00ff40;
}

/* Buttons */

button{
width:200px;
padding:15px 0;
text-align:center;
margin:20px 10px;
border-radius:25px;
font-weight:bold;
border:2px solid hotpink;
background:transparent;
color:#fff;
cursor:pointer;
position:relative;
overflow:hidden;
font-size:18px;
}

span {
background:#00ff40;
height:100%;
width:0;
border-radius:25px;
position:absolute;
left:0;
bottom:0;
z-index:-1;
transition:0.5s;
}

button:hover span {
width:100%;
}

button:hover {
color:black;
transition:0.9s;
}

/* Video */

.video {
display:flex;
justify-content:left;
align-items:left;
margin-top: -120px;
}

/* Name */

.name {
font-size:40px;
font-weight:bold;
margin-top:-530px;
margin-left:950px;
color:#00ff40;
line-height:27px;
}