File: /home/suanchonac/domains/suanchon.ac.th/public_html/609/06414/iPortfolio/index.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta content="width=device-width, initial-scale=1.0" name="viewport">
<title>นายธีปกร แจ้งกระจ่าง
</title>
<meta content="" name="description">
<meta content="" name="keywords">
<!-- Favicons -->
<link href="assets/img/favicon.png" rel="icon">
<link href="assets/img/apple-touch-icon.png" rel="apple-touch-icon">
<!-- Google Fonts -->
<link href="https://fonts.googleapis.com/css?family=Open+Sans:300,300i,400,400i,600,600i,700,700i|Raleway:300,300i,400,400i,500,500i,600,600i,700,700i|Poppins:300,300i,400,400i,500,500i,600,600i,700,700i" rel="stylesheet">
<!-- Vendor CSS Files -->
<link href="assets/vendor/aos/aos.css" rel="stylesheet">
<link href="assets/vendor/bootstrap/css/bootstrap.min.css" rel="stylesheet">
<link href="assets/vendor/bootstrap-icons/bootstrap-icons.css" rel="stylesheet">
<link href="assets/vendor/boxicons/css/boxicons.min.css" rel="stylesheet">
<link href="assets/vendor/glightbox/css/glightbox.min.css" rel="stylesheet">
<link href="assets/vendor/swiper/swiper-bundle.min.css" rel="stylesheet">
<!-- Template Main CSS File -->
<link href="assets/css/style.css" rel="stylesheet">
<!-- =======================================================
* Template Name: iPortfolio
* Updated: May 30 2023 with Bootstrap v5.3.0
* Template URL: https://bootstrapmade.com/iportfolio-bootstrap-portfolio-websites-template/
* Author: BootstrapMade.com
* License: https://bootstrapmade.com/license/
======================================================== -->
</head>
<body>
<!-- ======= Mobile nav toggle button ======= -->
<i class="bi bi-list mobile-nav-toggle d-xl-none"></i>
<!-- ======= Header ======= -->
<header id="header">
<div class="d-flex flex-column">
<div class="profile">
<img src="assets/img/profile-img.jpg" alt="" class="img-fluid rounded-circle">
<h1 class="text-light"><a href="index.html">thipakorn jaengkracjang</a></h1>
<div class="social-links mt-3 text-center">
<a href="#" class="twitter"><i class="bx bxl-twitter"></i></a>
<a href="#" class="facebook"><i class="bx bxl-facebook"></i></a>
<a href="#" class="instagram"><i class="bx bxl-instagram"></i></a>
<a href="#" class="google-plus"><i class="bx bxl-skype"></i></a>
<a href="#" class="linkedin"><i class="bx bxl-linkedin"></i></a>
</div>
</div>
<nav id="navbar" class="nav-menu navbar">
<ul>
<li><a href="#hero" class="nav-link scrollto active"><i class="bx bx-home"></i> <span>Home</span></a></li>
<li><a href="#about" class="nav-link scrollto"><i class="bx bx-user"></i> <span>About</span></a></li>
<li><a href="#resume" class="nav-link scrollto"><i class="bx bx-file-blank"></i> <span>Resume</span></a></li>
<li><a href="#portfolio" class="nav-link scrollto"><i class="bx bx-book-content"></i> <span>Portfolio</span></a></li>
<li><a href="#services" class="nav-link scrollto"><i class="bx bx-server"></i> <span>Services</span></a></li>
<li><a href="#contact" class="nav-link scrollto"><i class="bx bx-envelope"></i> <span>Contact</span></a></li>
</ul>
</nav><!-- .nav-menu -->
</div>
</header><!-- End Header -->
<!-- ======= Hero Section ======= -->
<section id="hero" class="d-flex flex-column justify-content-center align-items-center">
<div class="hero-container" data-aos="fade-in">
<h1>Thaipakorn Jaengkracjang</h1>
<p>I'm <span class="typed" data-typed-items="Designer, Developer, Freelancer, Photographer"></span></p>
</div>
</section><!-- End Hero -->
<main id="main">
<!-- ======= About Section ======= -->
<section id="about" class="about">
<div class="container">
<div class="section-title">
<h2>About</h2>
<p> Practical activities (main activities) 1. Design artwork and write content for online media as specifically received. 2. Responsible for designing important graphics of the organization 3. Manage social media platforms such as Facebook, Line@, Twitter, Instagram, YouTube and websites. 4. Contact and coordinate with the printing house. 5. Take pictures of charity activities to use in online media. 6. Observe other things as received.</p>
</div>
<div class="row">
<div class="col-lg-4" data-aos="fade-right">
<img src="assets/img/profile-img.jpg" class="img-fluid" alt="">
</div>
<div class="col-lg-8 pt-4 pt-lg-0 content" data-aos="fade-left">
<h3>UI/UX Designer & Web Developer.</h3>
<p class="fst-italic">
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore
magna aliqua.
</p>
<div class="row">
<div class="col-lg-6">
<ul>
<li><i class="bi bi-chevron-right"></i> <strong>Birthday:</strong> <span>12 Jan 2006</span></li>
<li><i class="bi bi-chevron-right"></i> <strong>Website:</strong> <span>www.example.com</span></li>
<li><i class="bi bi-chevron-right"></i> <strong>Phone:</strong> <span>0638913744</span></li>
<li><i class="bi bi-chevron-right"></i> <strong>City:</strong> <span>Chonburi Thai</span></li>
</ul>
</div>
<div class="col-lg-6">
<ul>
<li><i class="bi bi-chevron-right"></i> <strong>Age:</strong> <span>16</span></li>
<li><i class="bi bi-chevron-right"></i> <strong>Degree:</strong> <span>Student</span></li>
<li><i class="bi bi-chevron-right"></i> <strong>PhEmailone:</strong> <span>ggcfvgcfh657@gmail.com</span></li>
<li><i class="bi bi-chevron-right"></i> <strong>school:</strong> <span>Suankularb wittayalai chonburi</span></li>
</ul>
</div>
</div>
<p>
Suankularb Wittayalai School students studying in the 6th year studying in art class visual arts Have academic achievements throughout their studies from 4th to 6th grade
</p>
</div>
</div>
</div>
</section><!-- End About Section -->
<!-- ======= Skills Section ======= -->
<section id="skills" class="skills section-bg">
<div class="container">
<div class="section-title">
<h2>Skills</h2>
<p> Communication through Graphic Design Great graphics in the design of each piece. Also known as Artwork, the step before starting work. All data should be analyzed and analyzed. Know the purpose, goal, and time period for doing it. Target groups used in communication To design graphics that look good. This will help the artwork to be successful. For example, want to promote a new cosmetic product. To want to generate sales</p>
</div>
<div class="row skills-content">
<div class="col-lg-6" data-aos="fade-up">
<div class="progress">
<span class="skill">Desing art <i class="val">exceiient</i></span>
<div class="progress-bar-wrap">
<div class="progress-bar" role="progressbar" aria-valuenow="100" aria-valuemin="0" aria-valuemax="100"></div>
</div>
</div>
<div class="progress">
<span class="skill">Eng <i class="val">good</i></span>
<div class="progress-bar-wrap">
<div class="progress-bar" role="progressbar" aria-valuenow="100" aria-valuemin="0" aria-valuemax="100"></div>
</div>
</div>
<div class="progress">
<span class="skill">Maths <i class="val">good</i></span>
<div class="progress-bar-wrap">
<div class="progress-bar" role="progressbar" aria-valuenow="100" aria-valuemin="0" aria-valuemax="100"></div>
</div>
</div>
</div>
<div class="col-lg-6" data-aos="fade-up" data-aos-delay="100">
<div class="progress">
<span class="skill">Science <i class="val">good</i></span>
<div class="progress-bar-wrap">
<div class="progress-bar" role="progressbar" aria-valuenow="100" aria-valuemin="0" aria-valuemax="100"></div>
</div>
</div>
<div class="progress">
<span class="skill">Other Foreign languages <i class="val">good</i></span>
<div class="progress-bar-wrap">
<div class="progress-bar" role="progressbar" aria-valuenow="100" aria-valuemin="0" aria-valuemax="100"></div>
</div>
</div>
<div class="progress">
<span class="skill">Computer Program <i class="val">good</i></span>
<div class="progress-bar-wrap">
<div class="progress-bar" role="progressbar" aria-valuenow="100" aria-valuemin="0" aria-valuemax="100"></div>
</div>
</div>
</div>
</div>
</div>
</section><!-- End Skills Section -->
<!-- ======= Resume Section ======= -->
<section id="resume" class="resume">
<div class="container">
<div class="section-title">
<h2>Resume</h2>
<p>Suankularb Wittayalai School students studying in the 6th year studying in art class visual arts Have academic achievements throughout their studies from 4th to 6th grade Studied at Suankularb Wittayalai Chonburi School Studying at the secondary school level 1-3 in 2018-2021 Study high school 4-6 from 2021-2023 I am enrolled in the Fine Arts class. I am studying from 2021-2023. I have gained a lot of knowledge and skills from attending the Fine Arts class. for 2-3 years Gain skills in drawing, painting in canvas frames, and many more</p>
</div>
<div class="row">
<div class="col-lg-6" data-aos="fade-up">
<h3 class="resume-title">Sumary</h3>
<div class="resume-item pb-0">
<h4>thipakorn</h4>
<p><em>Education during the arts Is interested in art.</em></p>
<ul>
<li>Bueng Subdistrict</li>
<li>0638913744</li>
<li>ggfcvgfch657@gmail.com</li>
</ul>
</div>
<h3 class="resume-title">Education</h3>
<div class="resume-item">
<h4>Being a student at suankularb wittayalai chonburi & Graphic Design</h4>
<h5>2016-2024</h5>
<p><em>RochesterEducation during the arts Is interested in art markend</p>
</div>
<div class="resume-item">
<h4>High school education & Graphic Design</h4>
<h5>2019-2024</h5>
<p><em>education during the arts are interested in art and various work designs have begun to be issued</p>
</div>
</div>
<div class="col-lg-6" data-aos="fade-up" data-aos-delay="100">
<h3 class="resume-title">Professional Experience</h3>
<div class="resume-item">
<h4>Senior graphic design specialist</h4>
<h5>2019 - Present</h5>
<p><em></em></p>
<ul>
<li> education during the arts are interested in art and various work designs have begun to be issued</li>
<li>Delegate tasks of the project. </li>
<li>Supervise the assessment of all graphic materials in order to ensure quality and accuracy of the design</li>
<li>Oversee the efficient use of production project</li>
</ul>
</div>
<div class="resume-item">
<h4>Graphic design specialist</h4>
<h5>2017 - 2018</h5>
<p><em></em></p>
<ul>
<li></li>
<li>Managed up to 5 projects or tasks at a given time while under pressure</li>
<li>Recommended and consulted with clients on the most appropriate graphic design</li>
<li>Created 4+ design presentations and proposals a month for clients and account managers</li>
</ul>
</div>
</div>
</div>
</div>
</section><!-- End Resume Section -->
<!-- ======= Portfolio Section ======= -->
<section id="portfolio" class="portfolio section-bg">
<div class="container">
<div class="section-title">
<h2>Portfolio</h2>
<p>Design, create, and improve graphic design work that is modern, creative, and appropriate for the organization's operating objectives and target groups both in Thailand and abroad. and ready to understand the needs of the target group along with coordinating the fundraising department In the details of creating tools for marketing communication Performing photography work and create new things related to communication.</p>
</div>
<div class="row" data-aos="fade-up">
<div class="col-lg-12 d-flex justify-content-center">
<ul id="portfolio-flters">
<li data-filter="*" class="filter-active">ทั้งหมด </li>
<li data-filter=".filter-app">สปอตไลท์ครีเอเตอร์ </li>
<li data-filter=".filter-card">คอนเท้นยอดนิยม </li>
<li data-filter=".filter-web">ไววัล </li>
</ul>
</div>
</div>
<div class="row portfolio-container" data-aos="fade-up" data-aos-delay="100">
<div class="col-lg-4 col-md-6 portfolio-item filter-app">
<div class="portfolio-wrap">
<img src="assets/img/portfolio/portfolio-1.jpg" class="img-fluid" alt="">
<div class="portfolio-links">
<a href="assets/img/portfolio/portfolio-1.jpg" data-gallery="portfolioGallery" class="portfolio-lightbox" title="App 1"><i class="bx bx-plus"></i></a>
<a href="portfolio-details.html" title="More Details"><i class="bx bx-link"></i></a>
</div>
</div>
</div>
<div class="col-lg-4 col-md-6 portfolio-item filter-web">
<div class="portfolio-wrap">
<img src="assets/img/portfolio/portfolio-2.jpg" class="img-fluid" alt="">
<div class="portfolio-links">
<a href="assets/img/portfolio/portfolio-2.jpg" data-gallery="portfolioGallery" class="portfolio-lightbox" title="Web 3"><i class="bx bx-plus"></i></a>
<a href="portfolio-details.html" title="More Details"><i class="bx bx-link"></i></a>
</div>
</div>
</div>
<div class="col-lg-4 col-md-6 portfolio-item filter-app">
<div class="portfolio-wrap">
<img src="assets/img/portfolio/portfolio-3.jpg" class="img-fluid" alt="">
<div class="portfolio-links">
<a href="assets/img/portfolio/portfolio-3.jpg" data-gallery="portfolioGallery" class="portfolio-lightbox" title="App 2"><i class="bx bx-plus"></i></a>
<a href="portfolio-details.html" title="More Details"><i class="bx bx-link"></i></a>
</div>
</div>
</div>
<div class="col-lg-4 col-md-6 portfolio-item filter-card">
<div class="portfolio-wrap">
<img src="assets/img/portfolio/portfolio-4.jpg" class="img-fluid" alt="">
<div class="portfolio-links">
<a href="assets/img/portfolio/portfolio-4.jpg" data-gallery="portfolioGallery" class="portfolio-lightbox" title="Card 2"><i class="bx bx-plus"></i></a>
<a href="portfolio-details.html" title="More Details"><i class="bx bx-link"></i></a>
</div>
</div>
</div>
<div class="col-lg-4 col-md-6 portfolio-item filter-web">
<div class="portfolio-wrap">
<img src="assets/img/portfolio/portfolio-5.jpg" class="img-fluid" alt="">
<div class="portfolio-links">
<a href="assets/img/portfolio/portfolio-5.jpg" data-gallery="portfolioGallery" class="portfolio-lightbox" title="Web 2"><i class="bx bx-plus"></i></a>
<a href="portfolio-details.html" title="More Details"><i class="bx bx-link"></i></a>
</div>
</div>
</div>
<div class="col-lg-4 col-md-6 portfolio-item filter-app">
<div class="portfolio-wrap">
<img src="assets/img/portfolio/portfolio-6.jpg" class="img-fluid" alt="">
<div class="portfolio-links">
<a href="assets/img/portfolio/portfolio-6.jpg" data-gallery="portfolioGallery" class="portfolio-lightbox" title="App 3"><i class="bx bx-plus"></i></a>
<a href="portfolio-details.html" title="More Details"><i class="bx bx-link"></i></a>
</div>
</div>
</div>
<div class="col-lg-4 col-md-6 portfolio-item filter-card">
<div class="portfolio-wrap">
<img src="assets/img/portfolio/portfolio-7.jpg" class="img-fluid" alt="">
<div class="portfolio-links">
<a href="assets/img/portfolio/portfolio-7.jpg" data-gallery="portfolioGallery" class="portfolio-lightbox" title="Card 1"><i class="bx bx-plus"></i></a>
<a href="portfolio-details.html" title="More Details"><i class="bx bx-link"></i></a>
</div>
</div>
</div>
<div class="col-lg-4 col-md-6 portfolio-item filter-card">
<div class="portfolio-wrap">
<img src="assets/img/portfolio/portfolio-8.jpg" class="img-fluid" alt="">
<div class="portfolio-links">
<a href="assets/img/portfolio/portfolio-8.jpg" data-gallery="portfolioGallery" class="portfolio-lightbox" title="Card 3"><i class="bx bx-plus"></i></a>
<a href="portfolio-details.html" title="More Details"><i class="bx bx-link"></i></a>
</div>
</div>
</div>
<div class="col-lg-4 col-md-6 portfolio-item filter-web">
<div class="portfolio-wrap">
<img src="assets/img/portfolio/portfolio-9.jpg" class="img-fluid" alt="">
<div class="portfolio-links">
<a href="assets/img/portfolio/portfolio-9.jpg" data-gallery="portfolioGallery" class="portfolio-lightbox" title="Web 3"><i class="bx bx-plus"></i></a>
<a href="portfolio-details.html" title="More Details"><i class="bx bx-link"></i></a>
</div>
</div>
</div>
</div>
</div>
</section><!-- End Portfolio Section -->
<!-- ======= Testimonials Section ======= -->
<section id="testimonials" class="testimonials section-bg">
<div class="container">
<div class="section-title">
<h2>Testimonials</h2>
<p> Graphic Design Great graphics in the design of each piece. Also known as Artwork, the step before starting work. All data should be analyzed and analyzed. Know the purpose, goal, and time period for doing it. Target groups used in communication To design graphics that look good. This will help the artwork to be successful. For example, want to promote a new cosmetic product. To want to generate sales</p>
</div>
<div class="testimonials-slider swiper" data-aos="fade-up" data-aos-delay="100">
<div class="swiper-wrapper">
<div class="swiper-slide">
<div class="testimonial-item" data-aos="fade-up">
<p>
<i class="bx bxs-quote-alt-left quote-icon-left"></i>นายธีปกร นักเรียนช้ันมัธยมศึกษาปีที่609สายการเรียน ศิลปะกรรม โรงเรียนสวนกุหลาบวิทยาลัย ชลบุรี เป็นนักเรียนท่ีมีเกยีรติมี ศักด์ศิ รี มีความน่ายกย่องในด้านต่างๆ ดงั นี้ ด้านทั่วไป เป็นนกั เรียนที่ร่าเริง แจ่มใส มีมารยาทดี วางตวั เหมาะสม ด้านการเรียน มีความขยนั ต้งั ใจเรียน ทาํ งานเป็นระบบ รอบคอบ มีระเบียบวนิ ยั มีความ รับผิดชอบในงานท่ีไดม้ อบหมาย ทาํ งานเป็นปัจจุบนั และส่งงานตรงตามกาํ หนดของ เวลา ผลงานท่ีไดม้ ีคุณภาพ นอกจากน้ียงัเชื่อฟังคาํสง่ัสอนของครู เม่ือสงสยั หรือไม่เขา้ใจในเน้ือหาท่ีเรียนก็ จะมีความเอาใจใส่ในคน้ หาคาํ ตอบในขอ้ สงสยั หรือเร่ืองน้นั เป็นผใู้ ฝ่รู้ใฝ่เรียน ด้านกจิกรรมในโรงเรียน ถา้ มีกิจกรรมในโรงเรียนก็จะให้ความร่วมมือและมีส่วนร่วมในการทาํ กิจกรรมน้นั อยา่ งเตม็ ท่ี จนทาํ ให้เป็นท่ีรักของครูและเพื่อน ๆ ตลอดจนรุ่นนอ้ งในโรงเรียน
<i class="bx bxs-quote-alt-right quote-icon-right"></i>
</p>
<img src="assets/img/testimonials/testimonials-1.jpg" class="testimonial-img" alt="">
<h3>อาจารย์ อาย </h3>
<h4>Ceo & Founder</h4>
</div>
</div><!-- End testimonial item -->
<div class="swiper-slide">
<div class="testimonial-item" data-aos="fade-up" data-aos-delay="100">
<p>
<i class="bx bxs-quote-alt-left quote-icon-left"></i>
นายมธีปกร เเจ้งกระจ่างนักเรียนช้นั มธั ยมศึกษาปีที่609แผนการเรียนศิลปะกรรม โรงเรียน สวนกุหลาบวิยาลัย ชลบุรี เป็นผทู้ ่ีมีความรู้ ความสามารถท้งั ดา้ นวชิ าการและดา้ นการร่วมกิจกรรม เป็นผทู้ าํ ชื่อเสียงที่น่า ภูมิใจมาสู่โรงเรี ยน นายภทั ร สกลุ รุจินนั ท์ เป็นผมู้ ีความเอาใจใส่ในการเรียนดีมีความขยนั หมนั่ เพียรกระตือรือร้นใฝ่รู้ใฝ่เรียนมี ความรับผิดชอบในงานท่ีไดร้ ับมอบหมายเป็นผนู้ าํ ในการจดั กิจกรรมต่างๆของหอ้ งเรียนระดบั ช้นั และโรงเรียนโดยเฉพาะ ความสามารถในการทาํ งานดา้ นตา่ งๆ การแสดงออก เขา้ ร่วมกิจกรรมต่างๆ ของโรงเรียน เช่นการแสดงในงานราตรี สมั พนั ธ์ การแสดงออกในงานเล้ียงส่งรุ่นพี่ เป็นการแสดงออกที่เตม็ ไปดว้ ยความยนิ ดียงิ่ จากการปฏิบตั ิหนา้ ที่ที่ไดร้ ับ มอบหมาย สาํ เร็จลุล่วงดว้ ยดีอยา่ งมีประสิทธิภาพ ท้งั มีมนุษยส์ มั พนั ธ์ท่ีดี จิตใจโอบออ้ มอารี เอ้ืออาทรต่อผอู้ ื่น เป็นที่รักใคร่ ของเพื่อนๆ นอ้ งๆและครูอาจารยท์ ุกคน .
<i class="bx bxs-quote-alt-right quote-icon-right"></i>
</p>
<img src="assets/img/testimonials/testimonials-2.jpg" class="testimonial-img" alt="">
<h3>อาจารย์ ชานน</h3>
<h4>Designer</h4>
</div>
</div><!-- End testimonial item -->
<div class="swiper-slide">
<div class="testimonial-item" data-aos="fade-up" data-aos-delay="200">
<p>
<i class="bx bxs-quote-alt-left quote-icon-left"></i>
ด้านทั่วไป
มารยาทดี วางตัวเป็น ร่าเริงเเจ่มใส่
ด้านการเรียน
มีความขยันตั้งใจเรียน ทำงานเป็นระบบ รอบคอบ มีวินัย มีความรับผิดชอบกับงานที่ได้รับมอบหมาย ทำงานเป็นปัจจุบัน ส่งงานตามกำหนด ทำงานอย่างมีประสิทธิภาพ
ด้านโรงเรียน
มีกิจกรรมอะไรเข้าร่วมเสมอ เป็นส่วนหนึ่งของการทำกิจกรรมของโรงเรียนเสมอ
<i class="bx bxs-quote-alt-right quote-icon-right"></i>
</p>
<img src="assets/img/testimonials/testimonials-3.jpg" class="testimonial-img" alt="">
<h3>อาจารยื กอร์ฟ </h3>
<h4>Store Owner</h4>
</div>
</div><!-- End testimonial item -->
</div>
<div class="swiper-pagination"></div>
</div>
</div>
</section><!-- End Testimonials Section -->
<!-- ======= Contact Section ======= -->
<section id="contact" class="contact">
<div class="container">
<div class="section-title">
<h2>Contact</h2>
<p>Can be contacted via e-mail and other contact methods.</p>
</div>
<div class="row" data-aos="fade-in">
<div class="col-lg-5 d-flex align-items-stretch">
<div class="info">
<div class="address">
<i class="bi bi-geo-alt"></i>
<h4>Location:</h4>
<p>75/6 bueng subdistrict chonburi 20230</p>
</div>
<div class="email">
<i class="bi bi-envelope"></i>
<h4>Email:</h4>
<p>ggfcvgfch657@gmail.com</p>
</div>
<div class="phone">
<i class="bi bi-phone"></i>
<h4>Call:</h4>
<p>0638913744</p>
</div>
<iframe src="https://www.google.com/maps/embed?pb=!1m14!1m12!1m3!1d1633.988619663934!2d101.00084260709734!3d13.080050496033845!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!5e0!3m2!1sth!2sth!4v1694580074580!5m2!1sth!2sth" width="100%" height="290px" style="border:0;" allowfullscreen="" loading="lazy" referrerpolicy="no-referrer-when-downgrade"></iframe>
</div>
</div>
<div class="col-lg-7 mt-5 mt-lg-0 d-flex align-items-stretch">
<form action="forms/contact.php" method="post" role="form" class="php-email-form">
<div class="row">
<div class="form-group col-md-6">
<label for="name">Your Name</label>
<input type="text" name="name" class="form-control" id="name" required>
</div>
<div class="form-group col-md-6">
<label for="name">Email</label>
<input type="email" class="form-control" name="email" id="email" required>
</div>
</div>
<div class="form-group">
<label for="name">Subject</label>
<input type="text" class="form-control" name="subject" id="subject" required>
</div>
<div class="form-group">
<label for="name">Message</label>
<textarea class="form-control" name="message" rows="10" required></textarea>
</div>
<div class="my-3">
<div class="loading">Loading</div>
<div class="error-message"></div>
<div class="sent-message">Your message has been sent. Thank you!</div>
</div>
<div class="text-center"><button type="submit">Send Message</button></div>
</form>
</div>
</div>
</div>
</section><!-- End Contact Section -->
</main><!-- End #main -->
<!-- ======= Footer ======= -->
<footer id="footer">
<div class="container">
<div class="copyright">
© Copyright <strong><span>iPortfolio</span></strong>
</div>
<div class="credits">
<!-- All the links in the footer should remain intact. -->
<!-- You can delete the links only if you purchased the pro version. -->
<!-- Licensing information: https://bootstrapmade.com/license/ -->
<!-- Purchase the pro version with working PHP/AJAX contact form: https://bootstrapmade.com/iportfolio-bootstrap-portfolio-websites-template/ -->
Designed by <a href="https://bootstrapmade.com/">BootstrapMade</a>
</div>
</div>
</footer><!-- End Footer -->
<a href="#" class="back-to-top d-flex align-items-center justify-content-center"><i class="bi bi-arrow-up-short"></i></a>
<!-- Vendor JS Files -->
<script src="assets/vendor/purecounter/purecounter_vanilla.js"></script>
<script src="assets/vendor/aos/aos.js"></script>
<script src="assets/vendor/bootstrap/js/bootstrap.bundle.min.js"></script>
<script src="assets/vendor/glightbox/js/glightbox.min.js"></script>
<script src="assets/vendor/isotope-layout/isotope.pkgd.min.js"></script>
<script src="assets/vendor/swiper/swiper-bundle.min.js"></script>
<script src="assets/vendor/typed.js/typed.umd.js"></script>
<script src="assets/vendor/waypoints/noframework.waypoints.js"></script>
<script src="assets/vendor/php-email-form/validate.js"></script>
<!-- Template Main JS File -->
<script src="assets/js/main.js"></script>
</body>
</html>