-
Notifications
You must be signed in to change notification settings - Fork 0
Expand file tree
/
Copy pathindex.html
More file actions
1 lines (1 loc) · 26.6 KB
/
Copy pathindex.html
File metadata and controls
1 lines (1 loc) · 26.6 KB
1
<!DOCTYPE html><html lang="en"><head><meta charset="UTF-8"><meta name="viewport" content="width=device-width,initial-scale=1"><meta name="description" content="This is a portfolio"><title>DANIELS</title><link rel="preconnect" href="https://fonts.googleapis.com"><link rel="preconnect" href="https://fonts.gstatic.com" crossorigin><link href="https://fonts.googleapis.com/css2?family=Montserrat:wght@100..900&family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap" rel="stylesheet"><link rel="icon" type="image/x-icon" href="/assests/images/favicon.ico"><link rel="stylesheet" href="./dist/css/aos.css"><link rel="stylesheet" href="./dist/css/bootstrap.min.css"><link rel="stylesheet" href="./dist/css/all.min.css"><link rel="stylesheet" href="./dist/css/style.css"></head><body data-bs-spy="scroll" data-bs-target="#nav"><nav id="nav" class="fixed-top navbar navbar-expand-md navbar-light bg-light"><div class="container"><a class="navbar-brand" href="index.html">Daniels</a><button class="navbar-toggler d-lg-none" type="button" data-bs-toggle="collapse" data-bs-target="#collapsibleNavId" aria-controls="collapsibleNavId" aria-expanded="false" aria-label="Toggle navigation"><span class="navbar-toggler-icon"></span></button><div class="collapse navbar-collapse" id="collapsibleNavId"><ul class="navbar-nav ms-auto gap-4 gap-md-1 gap-lg-3 mt-1 mt-lg-0"><li class="nav-item"><a class="nav-link active" aria-current="page" href="#home">Home</a></li><li class="nav-item"><a class="nav-link" href="#about">About</a></li><li class="nav-item"><a class="nav-link" href="#services">Services</a></li><li class="nav-item"><a class="nav-link" href="#portfolio">Portfolio</a></li><li class="nav-item"><a class="nav-link" href="#clients">Testimonials</a></li><li class="nav-item"><a class="nav-link" href="#team">Team</a></li><li class="nav-item"><a class="nav-link" href="#contact">Contact</a></li></ul></div></div></nav><header id="home" class="vh-100 d-flex justify-content-center align-items-center"><div class="content text-center" data-aos="zoom-in-up"><span class="top">Hello</span><h1 class="hed my-5">I am<span id="typed"></span></h1><ul class="links d-flex flex-wrap align-items-center justify-content-center gap-3"><li><a href="#" target="_blank"><i class="fa-brands fa-fw fa-beat-fade fa-facebook-f"></i></a></li><li><a href="#" target="_blank"><i class="fa-brands fa-fw fa-beat-fade fa-twitter"></i></a></li><li><a href="#" target="_blank"><i class="fa-brands fa-fw fa-beat-fade fa-linkedin-in"></i></a></li><li><a href="#" target="_blank"><i class="fa-brands fa-fw fa-beat-fade fa-behance"></i></a></li><li><a href="#" target="_blank"><i class="fa-brands fa-fw fa-beat-fade fa-youtube"></i></a></li></ul></div></header><section id="about"><div class="container overflow-hidden"><div class="content row justify-content-center g-5"><div class="left col-11 col-sm-9 col-lg-4" data-aos="fade-right"><div class="img"><img src="./assests/images/hero.jpg" class="d-block w-100" alt="man"></div></div><div class="right col-lg-6 offset-lg-1" data-aos="fade-left"><header><h2>About Me.</h2><span>UI / UX DESIGNER & WEB DEVELOPER</span></header><div class="bottom mt-3 overflow-hidden"><p class="mb-5">I am<b>Jerry Daniels</b>Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever It has survived not only five centuries, but also the leap into electronic but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing</p><div class="progress bar" role="progressbar" aria-label="Example with label" aria-valuenow="10" aria-valuemin="0" aria-valuemax="100"><div class="progress-bar row overflow-visible bg-dark p-2 text-white" style="width:95%"><span class="me-auto col-1">Web Design</span><span class="ms-auto col-1">95%</span></div></div><div class="progress bar" role="progressbar" aria-label="Example with label" aria-valuenow="10" aria-valuemin="0" aria-valuemax="100"><div class="progress-bar row overflow-visible bg-dark p-2 text-white" style="width:80%"><span class="me-auto col-1">Branding</span><span class="ms-auto col-1">80%</span></div></div><div class="progress bar" role="progressbar" aria-label="Example with label" aria-valuenow="10" aria-valuemin="0" aria-valuemax="100"><div class="progress-bar row overflow-visible bg-dark p-2 text-white" style="width:90%"><span class="me-auto col-1">Development</span><span class="ms-auto col-1">90%</span></div></div><div class="buttons"><a target="_blank" href="#" class="btn1 btn me-2">Download CV</a><a target="_blank" href="https://www.linkedin.com/in/abdulrahman-sallam-608764308/" class="btn2 btn">Contant Me</a></div></div></div></div></div></section><main><section id="services"><header class="m-auto mb-5 p-1" data-aos="zoom-in"><h2>Services.</h2></header><div class="container"><div class="row justify-content-center justify-content-md-start g-5"><article class="col-11 col-sm-10 col-md-6 col-lg-4" data-aos="fade-down-right"><div class="item shadow-sm"><span><i class="fa-solid fa-laptop-code"></i></span><h3 class="my-3">WEB DESIGN</h3><p>Lorem Ipsum is simply dummy text of the Lorem Ipsum has been the industry's standard dummy text ever</p></div></article><article class="col-11 col-sm-10 col-md-6 col-lg-4" data-aos="fade-down"><div class="item shadow-sm"><span><i class="fa-solid fa-volume-high"></i></span><h3 class="my-3">Branding</h3><p>Lorem Ipsum is simply dummy text of the Lorem Ipsum has been the industry's standard dummy text ever</p></div></article><article class="col-11 col-sm-10 col-md-6 col-lg-4" data-aos="fade-down-left"><div class="item shadow-sm"><span><i class="fa-solid fa-umbrella"></i></span><h3 class="my-3">Development</h3><p>Lorem Ipsum is simply dummy text of the Lorem Ipsum has been the industry's standard dummy text ever</p></div></article><article class="col-11 col-sm-10 col-md-6 col-lg-4" data-aos="fade-up-right"><div class="item shadow-sm"><span><i class="fa-regular fa-gem"></i></span><h3 class="my-3">Creative Design</h3><p>Lorem Ipsum is simply dummy text of the Lorem Ipsum has been the industry's standard dummy text ever</p></div></article><article class="col-11 col-sm-10 col-md-6 col-lg-4" data-aos="fade-up"><div class="item shadow-sm"><span><i class="fa-solid fa-display"></i></span><h3 class="my-3">Fully Responsive</h3><p>Lorem Ipsum is simply dummy text of the Lorem Ipsum has been the industry's standard dummy text ever</p></div></article><article class="col-11 col-sm-10 col-md-6 col-lg-4" data-aos="fade-up-left"><div class="item shadow-sm"><span><i class="fa-solid fa-camera"></i></span><h3 class="my-3">Retina Ready</h3><p>Lorem Ipsum is simply dummy text of the Lorem Ipsum has been the industry's standard dummy text ever</p></div></article></div></div></section></main><section id="portfolio"><header class="m-auto mb-5 p-1" data-aos="zoom-in"><h2>Portfolio</h2></header><div class="container" data-aos="zoom-out-up"><ul class="justify-content-center d-flex align-items-center gap-3 gap-md-5 mb-5 nav nav-pills" id="pills-tab" role="tablist"><li class="nav-item" role="presentation"><button type="button" data-bs-target="#pills-All" class="nav-link active" aria-controls="pills-All" data-bs-toggle="pill" aria-selected="true" id="pills-All-tab" role="tab">All</button><li class="nav-item" role="presentation"><button type="button" data-bs-target="#pills-Brand" class="nav-link" aria-controls="pills-Brand" data-bs-toggle="pill" aria-selected="false" id="pills-Brand-tab" role="tab">Brand</button><li class="nav-item" role="presentation"><button type="button" data-bs-target="#pills-Design" class="nav-link" aria-controls="pills-Design" data-bs-toggle="pill" aria-selected="false" id="pills-Design-tab" role="tab">Design</button><li class="nav-item" role="presentation"><button type="button" data-bs-target="#pills-Graphic" class="nav-link" aria-controls="pills-Graphic" data-bs-toggle="pill" aria-selected="false" id="pills-Graphic-tab" role="tab">Graphic</button></ul><div class="overflow-hidden tab-content" id="pills-tabContent"><div class="active fade show tab-pane" id="pills-All" aria-labelledby="pills-tab" role="tabpanel" tabindex="0"><div class="row g-5 justify-content-center justify-content-md-start"><div class="col-lg-4 col-11 col-md-6 col-sm-10"><div class="item"><div class="img"><img loading="lazy" alt="charger" class="d-block w-100" src="./assests/images/charger.jpg"></div><div class="justify-content-center d-flex align-items-center on"><div><h3>WEB DESIGN</h3><div class="justify-content-center d-flex align-items-center gap-4 links mt-3"><span><a href="#" aria-label="see photo"><i class="fa-fw fa-solid fa-paperclip"></i></a></span><span><a aria-label="show details" href="#"><i class="fa-fw fa-solid fa-magnifying-glass-plus"></i></a></span></div></div></div></div></div><div class="col-lg-4 col-11 col-md-6 col-sm-10"><div class="item"><div class="img"><img loading="lazy" alt="book" class="d-block w-100" src="./assests/images/book.jpg"></div><div class="justify-content-center d-flex align-items-center on"><div><h3>WEB DESIGN</h3><div class="justify-content-center d-flex align-items-center gap-4 links mt-3"><span><a aria-label="see photo" href="#"><i class="fa-fw fa-solid fa-paperclip"></i></a></span><span><a aria-label="show details" href="#"><i class="fa-fw fa-solid fa-magnifying-glass-plus"></i></a></span></div></div></div></div></div><div class="col-lg-4 col-11 col-md-6 col-sm-10"><div class="item"><div class="img"><img loading="lazy" alt="logo" class="d-block w-100" src="./assests/images/logo.jpg"></div><div class="justify-content-center d-flex align-items-center on"><div><h3>WEB DESIGN</h3><div class="justify-content-center d-flex align-items-center gap-4 links mt-3"><span><a aria-label="see photo" href="#"><i class="fa-fw fa-solid fa-paperclip"></i></a></span><span><a aria-label="show details" href="#"><i class="fa-fw fa-solid fa-magnifying-glass-plus"></i></a></span></div></div></div></div></div><div class="col-lg-4 col-11 col-md-6 col-sm-10"><div class="item"><div class="img"><img loading="lazy" alt="lamp" class="d-block w-100" src="./assests/images/lamp.jpg"></div><div class="justify-content-center d-flex align-items-center on"><div><h3>WEB DESIGN</h3><div class="justify-content-center d-flex align-items-center gap-4 links mt-3"><span><a aria-label="see photo" href="#"><i class="fa-fw fa-solid fa-paperclip"></i></a></span><span><a aria-label="show details" href="#"><i class="fa-fw fa-solid fa-magnifying-glass-plus"></i></a></span></div></div></div></div></div><div class="col-lg-4 col-11 col-md-6 col-sm-10"><div class="item"><div class="img"><img loading="lazy" alt="pens" class="d-block w-100" src="./assests/images/pens.jpg"></div><div class="justify-content-center d-flex align-items-center on"><div><h3>WEB DESIGN</h3><div class="justify-content-center d-flex align-items-center gap-4 links mt-3"><span><a aria-label="see photo" href="#"><i class="fa-fw fa-solid fa-paperclip"></i></a></span><span><a aria-label="show details" href="#"><i class="fa-fw fa-solid fa-magnifying-glass-plus"></i></a></span></div></div></div></div></div><div class="col-lg-4 col-11 col-md-6 col-sm-10"><div class="item"><div class="img"><img loading="lazy" alt="ruler" class="d-block w-100" src="./assests/images/ruler.jpg"></div><div class="justify-content-center d-flex align-items-center on"><div><h3>WEB DESIGN</h3><div class="justify-content-center d-flex align-items-center gap-4 links mt-3"><span><a aria-label="see photo" href="#"><i class="fa-fw fa-solid fa-paperclip"></i></a></span><span><a aria-label="show details" href="#"><i class="fa-fw fa-solid fa-magnifying-glass-plus"></i></a></span></div></div></div></div></div></div></div><div class="fade tab-pane" id="pills-Brand" aria-labelledby="pills-Brand-tab" role="tabpanel" tabindex="0"><div class="row g-5 justify-content-center justify-content-md-start"><div class="col-lg-4 col-11 col-md-6 col-sm-10"><div class="item"><div class="img"><img loading="lazy" alt="charger" class="d-block w-100" src="./assests/images/charger.jpg"></div><div class="justify-content-center d-flex align-items-center on"><div><h3>WEB DESIGN</h3><div class="justify-content-center d-flex align-items-center gap-4 links mt-3"><span><a aria-label="see photo" href="#"><i class="fa-fw fa-solid fa-paperclip"></i></a></span><span><a aria-label="show details" href="#"><i class="fa-fw fa-solid fa-magnifying-glass-plus"></i></a></span></div></div></div></div></div><div class="col-lg-4 col-11 col-md-6 col-sm-10"><div class="item"><div class="img"><img loading="lazy" alt="book" class="d-block w-100" src="./assests/images/book.jpg"></div><div class="justify-content-center d-flex align-items-center on"><div><h3>WEB DESIGN</h3><div class="justify-content-center d-flex align-items-center gap-4 links mt-3"><span><a aria-label="see photo" href="#"><i class="fa-fw fa-solid fa-paperclip"></i></a></span><span><a aria-label="show details" href="#"><i class="fa-fw fa-solid fa-magnifying-glass-plus"></i></a></span></div></div></div></div></div><div class="col-lg-4 col-11 col-md-6 col-sm-10"><div class="item"><div class="img"><img loading="lazy" alt="logo" class="d-block w-100" src="./assests/images/logo.jpg"></div><div class="justify-content-center d-flex align-items-center on"><div><h3>WEB DESIGN</h3><div class="justify-content-center d-flex align-items-center gap-4 links mt-3"><span><a aria-label="see photo" href="#"><i class="fa-fw fa-solid fa-paperclip"></i></a></span><span><a aria-label="show details" href="#"><i class="fa-fw fa-solid fa-magnifying-glass-plus"></i></a></span></div></div></div></div></div><div class="col-lg-4 col-11 col-md-6 col-sm-10"><div class="item"><div class="img"><img loading="lazy" alt="ruler" class="d-block w-100" src="./assests/images/ruler.jpg"></div><div class="justify-content-center d-flex align-items-center on"><div><h3>WEB DESIGN</h3><div class="justify-content-center d-flex align-items-center gap-4 links mt-3"><span><a aria-label="see photo" href="#"><i class="fa-fw fa-solid fa-paperclip"></i></a></span><span><a aria-label="show details" href="#"><i class="fa-fw fa-solid fa-magnifying-glass-plus"></i></a></span></div></div></div></div></div></div></div><div class="fade tab-pane" id="pills-Design" aria-labelledby="pills-Design-tab" role="tabpanel" tabindex="0"><div class="row g-5 justify-content-center justify-content-md-start"><div class="col-lg-4 col-11 col-md-6 col-sm-10"><div class="item"><div class="img"><img loading="lazy" alt="lamp" class="d-block w-100" src="./assests/images/lamp.jpg"></div><div class="justify-content-center d-flex align-items-center on"><div><h3>WEB DESIGN</h3><div class="justify-content-center d-flex align-items-center gap-4 links mt-3"><span><a aria-label="see photo" href="#"><i class="fa-fw fa-solid fa-paperclip"></i></a></span><span><a aria-label="show details" href="#"><i class="fa-fw fa-solid fa-magnifying-glass-plus"></i></a></span></div></div></div></div></div><div class="col-lg-4 col-11 col-md-6 col-sm-10"><div class="item"><div class="img"><img loading="lazy" alt="charger" class="d-block w-100" src="./assests/images/charger.jpg"></div><div class="justify-content-center d-flex align-items-center on"><div><h3>WEB DESIGN</h3><div class="justify-content-center d-flex align-items-center gap-4 links mt-3"><span><a aria-label="see photo" href="#"><i class="fa-fw fa-solid fa-paperclip"></i></a></span><span><a aria-label="show details" href="#"><i class="fa-fw fa-solid fa-magnifying-glass-plus"></i></a></span></div></div></div></div></div><div class="col-lg-4 col-11 col-md-6 col-sm-10"><div class="item"><div class="img"><img loading="lazy" alt="book" class="d-block w-100" src="./assests/images/book.jpg"></div><div class="justify-content-center d-flex align-items-center on"><div><h3>WEB DESIGN</h3><div class="justify-content-center d-flex align-items-center gap-4 links mt-3"><span><a aria-label="see photo" href="#"><i class="fa-fw fa-solid fa-paperclip"></i></a></span><span><a aria-label="show details" href="#"><i class="fa-fw fa-solid fa-magnifying-glass-plus"></i></a></span></div></div></div></div></div><div class="col-lg-4 col-11 col-md-6 col-sm-10"><div class="item"><div class="img"><img loading="lazy" alt="ruler" class="d-block w-100" src="./assests/images/ruler.jpg"></div><div class="justify-content-center d-flex align-items-center on"><div><h3>WEB DESIGN</h3><div class="justify-content-center d-flex align-items-center gap-4 links mt-3"><span><a aria-label="see photo" href="#"><i class="fa-fw fa-solid fa-paperclip"></i></a></span><span><a aria-label="show details" href="#"><i class="fa-fw fa-solid fa-magnifying-glass-plus"></i></a></span></div></div></div></div></div></div></div><div class="fade tab-pane" id="pills-Graphic" aria-labelledby="pills-Graphic-tab" role="tabpanel" tabindex="0"><div class="row g-5 justify-content-center justify-content-md-start"><div class="col-lg-4 col-11 col-md-6 col-sm-10"><div class="item"><div class="img"><img loading="lazy" alt="lamp" class="d-block w-100" src="./assests/images/lamp.jpg"></div><div class="justify-content-center d-flex align-items-center on"><div><h3>WEB DESIGN</h3><div class="justify-content-center d-flex align-items-center gap-4 links mt-3"><span><a aria-label="see photo" href="#"><i class="fa-fw fa-solid fa-paperclip"></i></a></span><span><a aria-label="show details" href="#"><i class="fa-fw fa-solid fa-magnifying-glass-plus"></i></a></span></div></div></div></div></div><div class="col-lg-4 col-11 col-md-6 col-sm-10"><div class="item"><div class="img"><img loading="lazy" alt="charger" class="d-block w-100" src="./assests/images/charger.jpg"></div><div class="justify-content-center d-flex align-items-center on"><div><h3>WEB DESIGN</h3><div class="justify-content-center d-flex align-items-center gap-4 links mt-3"><span><a aria-label="see photo" href="#"><i class="fa-fw fa-solid fa-paperclip"></i></a></span><span><a aria-label="show details" href="#"><i class="fa-fw fa-solid fa-magnifying-glass-plus"></i></a></span></div></div></div></div></div><div class="col-lg-4 col-11 col-md-6 col-sm-10"><div class="item"><div class="img"><img loading="lazy" alt="ruler" class="d-block w-100" src="./assests/images/ruler.jpg"></div><div class="justify-content-center d-flex align-items-center on"><div><h3>WEB DESIGN</h3><div class="justify-content-center d-flex align-items-center gap-4 links mt-3"><span><a aria-label="see photo" href="#"><i class="fa-fw fa-solid fa-paperclip"></i></a></span><span><a aria-label="show details" href="#"><i class="fa-fw fa-solid fa-magnifying-glass-plus"></i></a></span></div></div></div></div></div><div class="col-lg-4 col-11 col-md-6 col-sm-10"><div class="item"><div class="img"><img loading="lazy" alt="book" class="d-block w-100" src="./assests/images/book.jpg"></div><div class="justify-content-center d-flex align-items-center on"><div><h3>WEB DESIGN</h3><div class="justify-content-center d-flex align-items-center gap-4 links mt-3"><span><a aria-label="see photo" href="#"><i class="fa-fw fa-solid fa-paperclip"></i></a></span><span><a aria-label="show details" href="#"><i class="fa-fw fa-solid fa-magnifying-glass-plus"></i></a></span></div></div></div></div></div></div></div></div></div></section><section id="clients"><header class="m-auto mb-5 p-1" data-aos="zoom-in"><h2>Testimonials.</h2></header><div class="container"><div id="carouselExampleCaptions" class="carousel slide w-auto" data-aos="zoom-in-up"><div class="carousel-indicators"><button type="button" data-bs-target="#carouselExampleCaptions" data-bs-slide-to="0" class="active" aria-current="true" aria-label="Slide 1"></button><button type="button" data-bs-target="#carouselExampleCaptions" data-bs-slide-to="1" aria-label="Slide 2"></button><button type="button" data-bs-target="#carouselExampleCaptions" data-bs-slide-to="2" aria-label="Slide 3"></button></div><div class="carousel-inner"><div class="carousel-item active"><div class="img"><img src="./assests/images/1_New1.jpg" class="d-block w-75 m-auto rounded-circle" alt="man"></div><div class="carousel-caption caption position-static"><p>Lorem, ipsum dolor sit amet consectetur adipisicing elit. Laborum fugit mollitia delectus nihil officia. Fugit<br>deleniti autem dolorum, consequatur minus</p><h3>Ronaldo</h3><span>The best</span></div></div><div class="carousel-item"><div class="img"><img src="./assests/images/1_New1.jpg" class="d-block w-75 m-auto rounded-circle" alt="woman"></div><div class="carousel-caption caption position-static"><p>Lorem, ipsum dolor sit amet consectetur adipisicing elit. Laborum fugit mollitia delectus nihil officia. Fugit<br>deleniti autem dolorum, consequatur minus</p><h3>CR7</h3><span>The best</span></div></div><div class="carousel-item"><div class="img"><img src="./assests/images/1_New1.jpg" class="d-block w-75 m-auto rounded-circle" alt="woman"></div><div class="carousel-caption caption position-static"><p>Lorem, ipsum dolor sit amet consectetur adipisicing elit. Laborum fugit mollitia delectus nihil officia. Fugit<br>deleniti autem dolorum, consequatur minus</p><h3>CR7</h3><span>The best</span></div></div></div></div></div></section><div id="achievement" class="overflow-hidden"><div class="container"><div class="row g-5 justify-content-center text-center" data-aos="zoom-out-up"><div class="item col-10 col-md-6 col-lg-3 d-flex flex-column gap-4 justify-content-center align-items-center"><span><i class="fa-solid fa-fw fa-2xl fa-users"></i></span><span id="counter1"></span><h3>Happy Customers</h3></div><div class="item col-10 col-md-6 col-lg-3 d-flex flex-column gap-3 justify-content-center align-items-center"><span><i class="fa-solid fa-fw fa-2xl fa-thumbs-up"></i></span><span id="counter2"></span><h3>Happy Customers</h3></div><div class="item col-10 col-md-6 col-lg-3 d-flex flex-column gap-3 justify-content-center align-items-center"><span><i class="fa-solid fa-fw fa-2xl fa-volume-high"></i></span><span id="counter3"></span><h3>Happy Customers</h3></div><div class="item col-10 col-md-6 col-lg-3 d-flex flex-column gap-3 justify-content-center align-items-center"><span><i class="fa-solid fa-2xl fa-cloud-arrow-down"></i></span><span id="counter4"></span><h3>Happy Customers</h3></div></div></div></div><section id="team"><header class="m-auto mb-5 p-1" data-aos="zoom-in"><h2>Our Team.</h2></header><div class="container"><div class="row g-5 justify-content-center"><div class="col-10 col-sm-6 col-lg-4" data-aos="flip-left"><div class="item"><div class="top position-relative"><div class="img overflow-hidden"><img src="./assests/images/1.jpg" class="w-100 d-block" alt="man"></div><div class="on d-flex justify-content-center align-items-center"><ul class="links d-flex justify-content-center gap-4"><li><a target="_blank" href="https://web.facebook.com/profile.php?id=61563517265381"><i class="fa-brands fa-fw fa-lg fa-beat fa-facebook-f"></i></a></li><li><a target="_blank" href="#"><i class="fa-brands fa-fw fa-lg fa-beat fa-twitter"></i></a></li><li><a target="_blank" href="#"><i class="fa-brands fa-fw fa-lg fa-beat fa-pinterest"></i></a></li><li><a target="_blank" href="https://www.linkedin.com/in/abdulrahman-sallam-608764308/"><i class="fa-brands fa-fw fa-lg fa-beat fa-linkedin-in"></i></a></li></ul></div></div><div class="caption"><h4>John Doe</h4><h5>FRONT-END DEVELOPER</h5></div></div></div><div class="col-10 col-sm-6 col-lg-4" data-aos="flip-up"><div class="item"><div class="top position-relative"><div class="img overflow-hidden"><img src="./assests/images/2.jpg" class="w-100 d-block" alt="man"></div><div class="on d-flex justify-content-center align-items-center"><ul class="links d-flex justify-content-center gap-4"><li><a target="_blank" href="https://web.facebook.com/profile.php?id=61563517265381"><i class="fa-brands fa-fw fa-lg fa-beat fa-facebook-f"></i></a></li><li><a target="_blank" href="#"><i class="fa-brands fa-fw fa-lg fa-beat fa-twitter"></i></a></li><li><a target="_blank" href="#"><i class="fa-brands fa-fw fa-lg fa-beat fa-pinterest"></i></a></li><li><a target="_blank" href="https://www.linkedin.com/in/abdulrahman-sallam-608764308/"><i class="fa-brands fa-fw fa-lg fa-beat fa-linkedin-in"></i></a></li></ul></div></div><div class="caption"><h4>John Doe</h4><h5>FRONT-END DEVELOPER</h5></div></div></div><div class="col-10 col-sm-6 col-lg-4" data-aos="flip-right"><div class="item"><div class="top position-relative"><div class="img overflow-hidden"><img src="./assests/images/1.jpg" class="w-100 d-block" alt="man"></div><div class="on d-flex justify-content-center align-items-center"><ul class="links d-flex justify-content-center gap-4"><li><a target="_blank" href="https://web.facebook.com/profile.php?id=61563517265381"><i class="fa-brands fa-fw fa-lg fa-beat fa-facebook-f"></i></a></li><li><a target="_blank" href="#"><i class="fa-brands fa-fw fa-lg fa-beat fa-twitter"></i></a></li><li><a target="_blank" href="#"><i class="fa-brands fa-fw fa-lg fa-beat fa-pinterest"></i></a></li><li><a target="_blank" href="https://www.linkedin.com/in/abdulrahman-sallam-608764308/"><i class="fa-brands fa-fw fa-lg fa-beat fa-linkedin-in"></i></a></li></ul></div></div><div class="caption"><h4>John Doe</h4><h5>FRONT-END DEVELOPER</h5></div></div></div></div></div></section><section id="contact"><header class="m-auto mb-5 p-1" data-aos="zoom-in"><h2>Contact Us.</h2></header><div class="container"><div class="row g-4 justify-content-center" data-aos="zoom-in-down"><div class="item col-10 col-lg-4 text-center"><span><i class="fa-solid fa-xl fa-fw fa-location-arrow"></i></span><h3>Address</h3><p>6834 Hollywood Blvd - Los Angeles CA</p></div><div class="item col-10 col-lg-4 text-center"><span><i class="fa-solid fa-xl fa-fw fa-envelope"></i></span><h3>Email</h3><a href="https://github.com/AbdulrahmanSallam" target="_blank">https://github.com</a></div><div class="item col-10 col-lg-4 text-center"><span><i class="fa-solid fa-xl fa-fw fa-phone"></i></span><h3>Phone</h3><a href="tel:+201062893465" target="_blank">+20 10 6289 3465</a></div></div><form method="post" id="form" data-aos="zoom-in-up"><div class="row g-4 justify-content-center"><div class="col-10 col-xl-5"><input id="name" type="text" name="name" placeholder="Name"><p id="nameError" hidden>Name is required.</p></div><div class="col-10 col-xl-5"><input id="email" type="email" name="email" placeholder="Email"><p id="emailError" hidden>Email is required.</p></div><div class="col-10"><textarea id="message" placeholder="Message" name="message" rows="7"></textarea><p id="messageError" hidden>Please leave us a message.</p></div></div><button type="submit" class="btn mt-4 mx-auto d-block">Submit</button></form></div></section><footer id="footer"><p>Copy Right 2018 © By Daniels All Rights Reserved</p></footer><script src="./dist/js/aos.js"></script><script src="./dist/js/typed.umd.js"></script><script nomodule src="./dist/js/countUp.min.js"></script><script src="./dist/js/bootstrap.bundle.min.js"></script><script type="module" src="./dist/js/index.js"></script></body></html>