File: /home/suanchonac/domains/suanchon.ac.th/private_html/609/06255/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>นายอลงกรณ์ สีแนน เลขที่ 26</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 (2).jpg" width="1920" height="114" alt=""/>
<h1 class="text-light"><a href="index.html">Mark </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>Alongkorn Seenaen</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> </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">
</p>
<div class="row">
<div class="col-lg-6">
<ul>
<li><i class="bi bi-chevron-right"></i> <strong>Birthday:</strong> <span>1 September 2005</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>098 194 3834</span></li>
<li><i class="bi bi-chevron-right"></i> <strong>City:</strong> Chonburi Thailand</li>
</ul>
</div>
<div class="col-lg-6">
<ul>
<li><i class="bi bi-chevron-right"></i> <strong>Age:</strong> <span>18</span></li>
<li><i class="bi bi-chevron-right"></i> <strong>Degree:</strong> <span>high school</span></li>
<li><i class="bi bi-chevron-right"></i> <strong>PhEmailone:</strong> <span>Alongkornseenaen@gmail.com</span></li>
<li><i class="bi bi-chevron-right"></i> <strong>Freelance:</strong> <span>Available</span></li>
</ul>
</div>
</div>
<p>
</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>badly 0-20 good 20-40 excellnt 40-60 epic 60-80 cosmis level 80-100</p>
</div>
<div class="row skills-content">
<div class="col-lg-6" data-aos="fade-up">
<div class="progress">
<span class="skill">draw a picture <i class="val">80%</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">cook <i class="val">90%</i></span>
<div class="progress-bar-wrap">
<div class="progress-bar" role="progressbar" aria-valuenow="90" aria-valuemin="0" aria-valuemax="100"></div>
</div>
</div>
<div class="progress">
<span class="skill">play a game <i class="val">100%</i></span>
<div class="progress-bar-wrap">
<div class="progress-bar" role="progressbar" aria-valuenow="75" 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">work <i class="val">80%</i></span>
<div class="progress-bar-wrap">
<div class="progress-bar" role="progressbar" aria-valuenow="80" aria-valuemin="0" aria-valuemax="100"></div>
</div>
</div>
<div class="progress">
<span class="skill">take a photo <i class="val">50%</i></span>
<div class="progress-bar-wrap">
<div class="progress-bar" role="progressbar" aria-valuenow="90" aria-valuemin="0" aria-valuemax="100"></div>
</div>
</div>
<div class="progress">
<span class="skill">football <i class="val">60%</i></span>
<div class="progress-bar-wrap">
<div class="progress-bar" role="progressbar" aria-valuenow="55" 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>Magnam dolores commodi suscipit. Necessitatibus eius consequatur ex aliquid fuga eum quidem. Sit sint consectetur velit. Quisquam quos quisquam cupiditate. Et nemo qui impedit suscipit alias ea. Quia fugiat sit in iste officiis commodi quidem hic quas.</p>
</div>
<div class="row">
<div class="col-lg-6" data-aos="fade-up">
<h3 class="resume-title">abstract</h3>
<div class="resume-item pb-0">
<h4> Alongkorn Seenaen </h4>
<p><em>Born and raised in Chonburi </em></p>
<ul>
<li>254/54 Moo 3, Bowin Subdistrict, Sriracha District, Chonburi Province </li>
<li>0981943834</li>
<li>alongkornseenaen@gmail.com</li>
</ul>
</div>
<h3 class="resume-title">study</h3>
<div class="resume-item">
<h4>elementary school</h4>
<h5>2554-2559</h5>
<p><em>Panya Naruemit School</em></p>
<p></p>
</div>
<div class="resume-item">
<h4>secondary education</h4>
<h5>2560-2566</h5>
<p><em>Graduated from junior high school at Suankularb Wittayalai Chonburi School.</em></p>
<p>and is currently studying high school at Suankularb Chonburi School, Chonburi College</p>
</div>
</div>
<div class="col-lg-6" data-aos="fade-up" data-aos-delay="100">
<h3 class="resume-title">experience</h3>
<div class="resume-item">
<h4>Participating activities</h4>
<h5>2565-present</h5>
<p><em></em></p>
<ul>
<li>Ceremony to pay homage to teachers covering art teachers</li>
<li>Enter the rov competition at school. </li>
<li>Making cheer stands at sports events, blue</li>
<li>Organized the 6th Paritas Art Fair at Robinson Lifestyle Shopping Center, Bowin. </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>Magnam dolores commodi suscipit. Necessitatibus eius consequatur ex aliquid fuga eum quidem. Sit sint consectetur velit. Quisquam quos quisquam cupiditate. Et nemo qui impedit suscipit alias ea. Quia fugiat sit in iste officiis commodi quidem hic quas.</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">Ekathaat</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">
<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">
<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">
<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">
<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>
<div class="col-lg-4 col-md-6 portfolio-item filter-web">
<div class="portfolio-wrap">
<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 -->
<!-- ======= Services Section ======= -->
<section id="services" class="services">
<div class="container">
</div>
</section><!-- End Services Section -->
<!-- ======= Testimonials Section ======= -->
<section id="testimonials" class="testimonials section-bg">
<div class="container">
<div class="section-title">
<h2>Testimonials</h2>
<p>This is a testimonial from the teacher.</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>Professor Drift</h3>
<h4></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>Teacher Narisara</h3>
<h4></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>Teacher Maprang</h3>
<h4></h4>
</div>
</div><!-- End testimonial item -->
<div class="swiper-slide">
<div class="testimonial-item" data-aos="fade-up" data-aos-delay="300">
<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-4.jpg" class="testimonial-img" alt="">
<h3>Teacher Chai</h3>
<h4></h4>
</div>
</div><!-- End testimonial item -->
<div class="swiper-slide">
<div class="testimonial-item" data-aos="fade-up" data-aos-delay="400">
<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-5.jpg" class="testimonial-img" alt="">
<h3>Professor Chanon</h3>
<h4></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>People who want to contact can contact us this way.</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>254/54 หมู่ 3 บ่อวิน ศรีราชา ชลบูรี</p>
</div>
<div class="email">
<i class="bi bi-envelope"></i>
<h4>Email:</h4>
<p>alongkornseenaen@gmail.com</p>
</div>
<div class="phone">
<i class="bi bi-phone"></i>
<h4>Call:</h4>
<p>098 194 3834</p>
</div>
<iframe src="https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d3887.4178844946673!2d101.06705625073488!3d13.009039659658638!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x3102bf5d198f1761%3A0x9455a0b07830bafe!2z4LmC4Lij4LiH4LmA4Lij4Li14Lii4LiZ4Lia4LmJ4Liy4LiZ4LmC4Lib4LmI4LiH4Liq4Liw4LmA4LiB4LmH4LiU!5e0!3m2!1sth!2sth!4v1694595836412!5m2!1sth!2sth" width="100%" height="290" 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">Your 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>