text: import React from "react";
  import "./Header.css";
  import { Fade } from "react-reveal";
  import { NavLink, Link } from "react-router-dom";
  
  function Header() {
    return (
  		<Fade top duration={1000} distance="20px">
  			<div>
  				<header className="header" >
  					
  				
  					<input className="menu-btn" type="checkbox" id="menu-btn" />
  					<label className="menu-icon" htmlFor="menu-btn">
  						<span className="navicon"></span>
  					</label>
  					<ul className="menu">
  						<li>
  							<NavLink
  								to="/home"
  								tag={Link}
  								activeStyle={{ fontWeight: "bold" }}
  							>
  								Home
  							</NavLink>
  						</li>
  						<li>
  							<NavLink
  								to="/education"
  								tag={Link}
  								activeStyle={{ fontWeight: "bold" }}
  							>
  								Education
  							</NavLink>
  						</li>
  						<li>
  							<NavLink
  								to="/experience"
  								tag={Link}
  								activeStyle={{ fontWeight: "bold" }}
  							>
  								Experience
  							</NavLink>
  						</li>
  						<li>
  							<NavLink
  								to="/projects"
  								tag={Link}
  								activeStyle={{ fontWeight: "bold" }}
  							>
  								Projects
  							</NavLink>
  						</li>
  						
  						<li>
  							<NavLink
  								to="/contact"
  								tag={Link}
  								activeStyle={{ fontWeight: "bold" }}
  							>
  								Contact Me
  							</NavLink>
  						</li>
  					</ul>
  				</header>
  			</div>
  		</Fade>
  	);
  }
  export default Header;
  