diff --git a/public/css/style.css b/public/css/style.css
new file mode 100644
index 0000000000000000000000000000000000000000..8143a3698d26568d086bbefcf51e9df0d3cc2473
--- /dev/null
+++ b/public/css/style.css
@@ -0,0 +1,173 @@
+/* ตั้งค่าพื้นฐาน */
+* {
+    margin: 0;
+    padding: 0;
+    box-sizing: border-box;
+    font-family: 'Poppins', sans-serif;
+}
+
+body {
+    background-color: #f4f4f4;
+    color: #333;
+    line-height: 1.6;
+}
+
+/* สไตล์ Navbar */
+.navbar {
+    background: #007bff;
+    color: white;
+    padding: 15px 20px;
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+}
+
+.navbar a {
+    color: white;
+    text-decoration: none;
+    font-size: 18px;
+    margin-right: 15px;
+}
+
+.navbar a:hover {
+    text-decoration: underline;
+}
+
+/* Hero Section */
+.hero {
+    background: url('/images/hero.jpg') no-repeat center center/cover;
+    height: 400px;
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    text-align: center;
+    color: white;
+}
+
+.hero h1 {
+    font-size: 50px;
+    text-shadow: 2px 2px 5px rgba(0, 0, 0, 0.5);
+}
+
+/* Tour Cards */
+.tour-container {
+    display: flex;
+    flex-wrap: wrap;
+    justify-content: center;
+    padding: 20px;
+}
+
+.tour-card {
+    background: white;
+    border-radius: 10px;
+    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
+    width: 300px;
+    margin: 15px;
+    overflow: hidden;
+    transition: transform 0.3s;
+}
+
+.tour-card:hover {
+    transform: scale(1.05);
+}
+
+.tour-card img {
+    width: 100%;
+    height: 180px;
+}
+
+.tour-card .content {
+    padding: 15px;
+}
+
+.tour-card h3 {
+    font-size: 22px;
+    color: #007bff;
+}
+
+.tour-card p {
+    font-size: 16px;
+    margin: 10px 0;
+}
+
+.tour-card .price {
+    font-size: 18px;
+    color: #28a745;
+    font-weight: bold;
+}
+
+.tour-card .btn {
+    display: block;
+    text-align: center;
+    padding: 10px;
+    background: #007bff;
+    color: white;
+    text-decoration: none;
+    border-radius: 5px;
+    margin-top: 10px;
+}
+
+.tour-card .btn:hover {
+    background: #0056b3;
+}
+
+/* ฟอร์มล็อกอิน & สมัครสมาชิก */
+.form-container {
+    width: 100%;
+    max-width: 400px;
+    margin: 50px auto;
+    padding: 20px;
+    background: white;
+    border-radius: 10px;
+    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
+}
+
+.form-container h2 {
+    text-align: center;
+    margin-bottom: 20px;
+}
+
+.form-group {
+    margin-bottom: 15px;
+}
+
+.form-group label {
+    display: block;
+    font-weight: bold;
+}
+
+.form-group input {
+    width: 100%;
+    padding: 10px;
+    border: 1px solid #ccc;
+    border-radius: 5px;
+    margin-top: 5px;
+}
+
+.btn-submit {
+    width: 100%;
+    background: #007bff;
+    color: white;
+    padding: 10px;
+    border: none;
+    border-radius: 5px;
+    font-size: 18px;
+    cursor: pointer;
+}
+
+.btn-submit:hover {
+    background: #0056b3;
+}
+
+/* Footer */
+.footer {
+    background: #333;
+    color: white;
+    text-align: center;
+    padding: 20px;
+    margin-top: 30px;
+}
+
+.footer p {
+    margin: 0;
+}
diff --git a/server.js b/server.js
index dccb20c5c4b626388d5596f6c7f5c4b8d66900e4..e8685b8de73dddda48407370d74f1489486da786 100644
--- a/server.js
+++ b/server.js
@@ -1,64 +1,17 @@
-require('dotenv').config();
-
 const express = require('express');
-const mysql = require('mysql2/promise');
-const path = require('path');
+const bodyParser = require('body-parser');
+const dotenv = require('dotenv');
+const tourRoutes = require('./routes/tourRoutes');
 
-// สร้างแอป Express
+dotenv.config();
 const app = express();
 
-// ตั้งค่า view engine เป็น EJS
 app.set('view engine', 'ejs');
-app.set('views', path.join(__dirname, 'views'));
-
-// สร้างการเชื่อมต่อฐานข้อมูล MySQL
-const pool = mysql.createPool({
-  host: process.env.DB_HOST ,
-  port: process.env.DB_PORT ,
-  user: process.env.DB_USER ,
-  password: process.env.DB_PASSWORD ,
-  database: process.env.DB_NAME ,
-  waitForConnections: true,
-  connectionLimit: 10,
-  queueLimit: 0
-});
-
-// Check database connection
-async function testConnection() {
-  try {
-    const connection = await pool.getConnection();
-    await connection.ping();
-    console.log('Database connection succeeded.');
-    connection.release();
-  } catch (err) {
-    console.error('Database connection failed:', err);
-    process.exit(1); // Terminate the app if the database connection fails
-  }
-}
-testConnection();
+app.use(express.static('public'));
+app.use(bodyParser.urlencoded({ extended: false }));
 
-// หน้าหลัก
-app.get('/', async (req, res) => {
-  try {
-    const [rows] = await pool.query('SELECT * FROM tours');
-    res.render('index', { tours: rows });
-  } catch (err) {
-    res.status(500).send('Server error');
-  }
-});
-
-// หน้ารายละเอียดทัวร์
-app.get('/tour/:id', async (req, res) => {
-  const { id } = req.params;
-  try {
-    const [rows] = await pool.query('SELECT * FROM tours WHERE id = ?', [id]);
-    res.render('tour', { tour: rows[0] });
-  } catch (err) {
-    res.status(500).send('Server error');
-  }
-});
+app.use('/', tourRoutes);
 
-// ตั้งค่าพอร์ต
 const PORT = process.env.PORT || 3000;
 app.listen(PORT, () => {
   console.log(`Server is running on port ${PORT}`);
diff --git a/views/index.ejs b/views/index.ejs
index 9dbe8b52df1667e5c78baea760c04d87e315021f..8d6645d6d30b19a8b1a83eb015615faec3ff55b3 100644
--- a/views/index.ejs
+++ b/views/index.ejs
@@ -3,6 +3,7 @@
 <head>
   <meta charset="UTF-8">
   <meta name="viewport" content="width=device-width, initial-scale=1.0">
+  <link rel="stylesheet" href="/css/style.css">
   <title>Tour Website</title>
 </head>
 <body>