<body>
<header id="header">
<img id="header-img"
src="https://pngimage.net/wp-content/uploads/2018/06/sample-company-logo-png-6.png"
alt="original trombones logo">
<nav id="nav-bar">
<a class="nav-link" href="#first">First plan</a>
<a class="nav-link" href="#second">Second plan</a>
<a class="nav-link" href="#third">Third plan</a>
</nav>
</header>
<h1> <u>e<b>X</b>ample Tourism</u></h1><br><br><br>
<div id="vid">
<iframe id="video" width="860" height="515" src="https://www.youtube.com/embed/qaBZPI7If14" ></iframe>
</div>
<p id="first">plan is for 50$<p>
<p id="second">plan is for 100$<p>
<p id="third">plan is for 500$<p>
<form id="form" action=" https://www.freecodecamp.com/email-submit">
<p>Email id:</p><input id="email"name="email" placeholder="rawly@email.com"type="email">
<input id="submit"type="submit"vale="SUBMIT">
</form>
</body>
#header-img{width:20%;}
#header{display:flex;
flex-direction:row;}
#nav-bar{margin-top:70px;margin-left:auto;margin-right:80px;}
.nav-link{color:black;font-size:30px;}
h1{text-align:center;
font-size:100px;}
b{color:red;}
body::before{ background: url("https://static.toiimg.com/thumb/72975551.cms?width=680&height=512&imgsize=881753");
background-size: cover;
content:"";
display: block;
position: absolute;
top: 0; left: 0; width: 100%; height: 100%; z-index: -2; opacity: 0.4; }
#video{display:block;margin:auto;padding:0px;}
I’ve edited your post for readability. When you enter a code block into a forum post, please precede it with a separate line of three backticks and follow it with a separate line of three backticks to make it easier to read.
Please use the “preformatted text” tool in the editor (</>) to add backticks around text.
See this post to find the backtick on your keyboard.
Note: Backticks are not single quotes.
