View file Elmiz/Elmiz/1/about.html

File size: 14.19Kb
<!doctype html>
<html lang="en">

<head>
    <!-- Meta -->
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">

    <!-- favicon -->
    <link rel="icon" sizes="16x16" href="assets/img/favicon.png">

    <!-- Title -->
    <title> Elmiz - Personal Portfolio Template </title>

    <!-- CSS Plugins -->
    <link rel="stylesheet" href="assets/css/all.css">
    <link rel="stylesheet" href="assets/css/elegant-font-icons.css">
    <link rel="stylesheet" href="assets/css/bootstrap.min.css">
    <link rel="stylesheet" href="assets/css/magnific-popup.css">
    <link rel="stylesheet" href="assets/css/owl.carousel.css">
    <link rel="stylesheet" href="assets/css/animate.css">

    <!-- Font Google -->
    <link href="https://fonts.googleapis.com/css?family=Poppins:300,400,500,600,700,800,900&display=swap" rel="stylesheet">
    <link href="https://fonts.googleapis.com/css?family=Muli:300,400,500,600,700,800,900&display=swap" rel="stylesheet">

    <!-- main style -->
    <link rel="stylesheet" href="assets/css/style.css">
    <link rel="stylesheet" href="assets/css/colors/color-1.css">
    <link rel="stylesheet" href="assets/css/custom.css">
</head>

<body>

    <!--Menu-->
    <div class="main-menu fixed-top main-menu-left">
        <nav class="nav-menu">
            <ul class="menu">
                <li><a href="index-1.html">Home</a></li>
                <li><a href="about.html" class="active">About</a></li>
                <li><a href="services.html">Services</a></li>
                <li><a href="works.html">Works</a></li>
                <li><a href="blog.html">Blog</a></li>
                <li><a href="contact.html">Contact</a></li>
            </ul>
        </nav>
        <!--hamburger-menu-->
        <a class="hamburger-menu js-toggle-menu" href="#" >
            <div class="g-lines">
                <span class="line line-dark"></span>
                <span class="line line-dark"></span>
                <span class="line line-dark"></span>
            </div>
        </a>
    </div>

    <!-- About-->
    <div class="section">
        <div class="container">
            <!--Section title-->
            <div class="row" >
                <div class="col-12">
                    <div class="section-heading">
                        <p class="section-description bg-base-color">Know About Me</p>
                        <h2 class="section-title">About Me</h2>
                    </div>
                </div>
            </div>
            <!--about-info-->
            <div class="row d-flex align-items-center mb-50 wow customFadeInUp slow">
                <div class="col-lg-7 ">
                    <div class="about-info">
                        <h5>I'm Elizabeth Elmiz, a UX & UI Designer and Photographer</h5>
                        <p>I am a freelancer based in the United States and i have been building noteworthy UX/UI designs and websites for years,
                                which comply with the latest design trends.</p>
                        <div class="g-listes">
                            <ul class="liste">
                                <li><span>Name:</span>Elizabeth Elmiz.</li>
                                <li><span>Phone:</span>+3 (123)-456-78-91.</li>
                                <li><span>Freelancer:</span>Available.</li>
                            </ul>
                            <ul class="liste">
                                <li><span>Email:</span>elizabeth.elmiz@gmail.com.</li>
                                <li><span>Location:</span>New York City,USA.</li>
                                <li><span>Experience:</span>8 years .</li>
                            </ul>
                        </div>
                        <div class="g-bottom">
                            <a href="#" class="btn-custom">Downland My CV</a>
                            <ul class="social-icons  list-inline">
                                <li><a href="#"><i class="fab fa-facebook"></i></a></li>
                                <li><a href="#"><i class="fab fa-twitter"></i></a></li>
                                <li><a href="#"><i class="fab fa-instagram"></i></a></li>
                                <li><a href="#"><i class="fab fa-behance"></i></a></li>
                                <li><a href="#"><i class="fab fa-dribbble"></i></a></li>
                            </ul>
                        </div>
                    </div>
                </div>
                <div class="col-lg-5">
                    <div class="row">
                        <div class="col-6">
                            <div class="about-box">
                                <h2 class="base-color">120</h2>
                                <p>Projects Complated</p>
                            </div>
                        </div>
                        <div class="col-6">
                            <div class="about-box">
                                <h2 class="base-color">400</h2>
                                <p>Cups of coffee</p>
                            </div>
                        </div>
                        <div class="col-6">
                            <div class="about-box">
                                <h2 class="base-color">15</h2>
                                <p>awards won</p>
                            </div>
                        </div>
                        <div class="col-6">
                            <div class="about-box">
                                <h2 class="base-color">430</h2>
                                <p>Satisfied Clients</p>
                            </div>
                        </div>
                    </div> 
                </div>
            </div>
          
            <!--Work & Eduction-->
            <div class="section-sub-heading">
                <h4 class="section-sub-title"> Work & Eduction</h4>
            </div>
            <div class="row mb-50">
                <div class="col-md-6 wow customFadeInUp  delay-0-2s slow">
                    <div class="timeline">
                        <div class="timeline-item">
                            <div class="icon"></div>
                            <div class="box">
                                <h5>Full stack Web Developer </h5>
                                <small class="bg-base-color"> 2004 - 2007</small>
                                <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Optio quo repudiandae.</p>
                            </div>
                        </div>
                        <div class="timeline-item">
                            <div class="icon"></div>
                            <div class="box">
                                <h5>Back-End Developer</h5>
                                <small class="bg-base-color"> 2004 - 2007</small>
                                <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Optio quo repudiandae.</p>
                            </div>
                        </div>
                        <div class="timeline-item">
                            <div class="icon"></div>
                            <div class="box ">
                                <h5>UI/UX Designer </h5>
                                <small class="bg-base-color"> 2004 - 2007</small>
                                <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Optio quo repudiandae.</p>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="col-md-6 wow customFadeInUp delay-0-4s slow">
                    <div class="timeline">
                        <div class="timeline-item">
                            <div class="icon"></div>
                            <div class="box ">
                                <h5>Academic Degree</h5>
                                <small class="bg-base-color"> 2004 - 2007</small>
                                <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Optio quo repudiandae.</p>
                            </div>
                        </div>
                        <div class="timeline-item">
                            <div class="icon"> </div>
                            <div class="box ">
                                <h5>Bachelor’s Degree</h5>
                                <small class="bg-base-color"> 2004 - 2007</small>
                                <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Optio quo repudiandae.</p>
                            </div>
                        </div>
                        <div class="timeline-item">
                            <div class="icon"></div>
                            <div class="box">
                                <h5>Specialization Course </h5>
                                <small class="bg-base-color"> 2004 - 2007</small>
                                <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Optio quo repudiandae.</p>
                            </div>
                        </div>
                    </div>
                </div>
            </div>

            <!--Skills-->
            <div class="section-sub-heading">
                <h4 class="section-sub-title"> My Skills</h4>
            </div>
            <div class="row">
                <div class="col-md-6">
                    <!--skill-item-->
                    <div class="skill-item">
                        <p>Photoshop</p>
                        <div class="skill-progress">
                            <div class="skill-progress-bar bg-base-color" role="progressbar" aria-valuenow="92" aria-valuemin="0" aria-valuemax="100">
                                <span>92%</span>
                            </div>
                        </div>
                    </div>
            
                    <!--skill-item-->
                    <div class="skill-item">
                        <p>Illustrator</p>
                        <div class="skill-progress">
                            <div class="skill-progress-bar bg-base-color" role="progressbar" aria-valuenow="80" aria-valuemin="0" aria-valuemax="100">
                                <span>80%</span>
                            </div>
                        </div>
                    </div>
            
                    <!--skill-item-->
                    <div class="skill-item">
                        <p>Figma </p>
                        <div class="skill-progress">
                            <div class="skill-progress-bar bg-base-color" role="progressbar" aria-valuenow="75" aria-valuemin="0" aria-valuemax="100">
                                <span>75%</span>
                            </div>
                        </div>
                    </div>
            
                    <!--skill-item-->
                    <div class="skill-item">
                        <p>Adobe XD</p>
                        <div class="skill-progress">
                            <div class="skill-progress-bar bg-base-color" role="progressbar" aria-valuenow="70" aria-valuemin="0" aria-valuemax="100">
                                <span>70%</span>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="col-md-6">
                    <!--skill-item-->
                    <div class="skill-item">
                        <p>React</p>
                        <div class="skill-progress">
                            <div class="skill-progress-bar bg-base-color" role="progressbar" aria-valuenow="92" aria-valuemin="0" aria-valuemax="100">
                                <span>92%</span>
                            </div>
                        </div>
                    </div>
            
                    <!--skill-item-->
                    <div class="skill-item">
                        <p>Javascript</p>
                        <div class="skill-progress">
                            <div class="skill-progress-bar bg-base-color" role="progressbar" aria-valuenow="80" aria-valuemin="0" aria-valuemax="100">
                                <span>80%</span>
                            </div>
                        </div>
                    </div>
            
                    <!--skill-item-->
                    <div class="skill-item">
                        <p>CSS </p>
                        <div class="skill-progress">
                            <div class="skill-progress-bar bg-base-color" role="progressbar" aria-valuenow="75" aria-valuemin="0" aria-valuemax="100">
                                <span>75%</span>
                            </div>
                        </div>
                    </div>
            
                    <!--skill-item-->
                    <div class="skill-item">
                        <p>Jquery</p>
                        <div class="skill-progress">
                            <div class="skill-progress-bar bg-base-color" role="progressbar" aria-valuenow="70" aria-valuemin="0" aria-valuemax="100">
                                <span>70%</span>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>

    <!--loading -->
    <div class="loading">
        <div class="circle"></div>
    </div>


    <!-- jQuery first, then Popper.js, then Bootstrap JS -->
    <script src="assets/js/jquery-3.5.0.min.js"></script>
    <script src="assets/js/popper.min.js"></script>
    <script src="assets/js/bootstrap.min.js"></script>
    
    <!-- JS Plugins  -->
    <script src="assets/js/jquery.magnific-popup.min.js"></script>
    <script src="assets/js/owl.carousel.min.js"></script>
    <script src="assets/js/jquery.mixitup.js"></script>
    <script src="assets/js/wow.min.js"></script>
    <script src="assets/js/ajax-contact.js"></script>
    <script src="assets/js/jquery.animatedheadline.min.js"></script>
    <script src="assets/js/main.js"></script>


</body>

</html>