diff --git a/assets/css_files/testimonial.css b/assets/css_files/testimonial.css
new file mode 100644
index 00000000..fa89c26f
--- /dev/null
+++ b/assets/css_files/testimonial.css
@@ -0,0 +1,224 @@
+@import url('https://fonts.googleapis.com/css2?family=Playfair+Display:wght@400;500;600;700&display=swap');
+
+* {
+ box-sizing: border-box;
+ padding: 0;
+ margin: 0;
+}
+
+body {
+ font-family: 'Playfair Display', serif;
+ max-width: 100vw;
+ display: flex;
+ flex-direction: column;
+ background-image: url(../images/bg3.png);
+ background-repeat: no repeat;
+ background-attachment: fixed;
+ background-position: center;
+ background-size: cover;
+ background-repeat: no repeat;
+ align-items: center;
+ justify-content: center;
+}
+
+.navbar {
+ width: 100vw;
+ position: fixed;
+ top: 0;
+ left: 0;
+}
+.cont {
+ width: 1000px;
+ border: 2px solid #ccc;
+ background-color: #eee;
+ border-radius: 5px;
+ padding: 16px;
+ margin: 16px 0;
+ }
+
+ /* Clear floats after containers */
+ .cont::after {
+ content: "";
+ clear: both;
+ display: table;
+ }
+
+ /* Float images inside the container to the left. Add a right margin, and style the image as a circle */
+ .cont img {
+ float: left;
+ margin-right: 50px;
+ border-radius: 50%;
+ }
+
+ /* Increase the font-size of a span element */
+ .cont span {
+ font-size: 20px;
+ margin-right: 15px;
+ }
+
+section {
+ display: flex;
+ grid-template-columns: 1fr 1fr;
+ max-width: 80vw;
+ margin-top: 20px;
+ box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
+}
+
+.container {
+ width: 80%;
+ margin: 0 auto;
+ background-color: #fff;
+ padding: 20px;
+ box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
+ margin-top: 50px;
+ margin-bottom: 40px;
+}
+
+h1, h2 {
+ text-align: center;
+}
+
+.form-group {
+ margin-bottom: 15px;
+}
+
+label {
+ display: block;
+ margin-bottom: 5px;
+}
+
+input, textarea {
+ width: 100%;
+ padding: 10px;
+ border: 1px solid #ccc;
+ border-radius: 5px;
+}
+
+button {
+ display: block;
+ width: 100%;
+ padding: 10px;
+ background-color: #007bff;
+ color: white;
+ border: none;
+ border-radius: 5px;
+ cursor: pointer;
+}
+
+button:hover {
+ background-color: #0056b3;
+}
+
+#reviews {
+ margin-bottom: 30px;
+}
+
+.review {
+ width: 1000px;
+ border: 1px solid #ddd;
+ padding: 10px;
+ margin-bottom: 10px;
+ border-radius: 5px;
+ background-color:#eee;
+ box-sizing: border-box;
+ word-wrap: break-word;
+ overflow: hidden;
+}
+
+.review p {
+ margin: 5px 0;
+}
+
+.review-name {
+ font-weight: bold;
+ margin-bottom: 5px;
+}
+
+.review-text {
+ font-style: italic;
+}
+
+.credit {
+ display: flex;
+ flex-direction: column;
+ justify-content: center;
+ align-items: center;
+ min-height: 20vh;
+ width: 100%;
+ position: relative;
+ bottom: 0;
+ left: 0;
+ box-shadow: 0px -2.5px 6px rgb(30, 30, 30);
+ padding: 20px 50px;
+}
+
+.credit .social-icon {
+ position: relative;
+ display: flex;
+ justify-content: center;
+ align-items: center;
+ flex-wrap: wrap;
+}
+
+.credit .social-icon li {
+ list-style: none;
+}
+
+.credit .social-icon li a {
+ font-size: 2em;
+ color: var(--secondary);
+ margin: 0 10px;
+ display: inline-block;
+ transition: 0.5s;
+}
+
+.credit-links {
+ transition: transform .2s;
+}
+
+.credit .social-icon li a:hover {
+ transform: translateY(-10px);
+ color: red;
+}
+
+.credit p {
+ color: var(--secondary);
+ text-align: center;
+ margin-top: 15px;
+ margin-bottom: 10px;
+ font-size: 1.1em;
+ display: inline-block;
+}
+
+.credit p a {
+ background-color: rgba(239, 230, 230, 0.551);
+ color: var(--secondary);
+ text-align: center;
+ margin-top: 15px;
+ margin-bottom: 10px;
+ font-size: 1.1em;
+ display: inline-block;
+}
+
+@media (max-width: 900px) {
+ section {
+ grid-template-columns: 1fr;
+ width: 100%;
+ display: flex;
+ flex-direction: column;
+ align-items: center;
+ justify-content: center;
+ border-radius: 0;
+ }
+
+ .image {
+ border-radius: 0;
+ display: flex;
+ flex-direction: column;
+ align-items: center;
+ }
+
+ .content {
+ border-radius: 0;
+ }
+}
\ No newline at end of file
diff --git a/assets/html_files/testimonial.html b/assets/html_files/testimonial.html
new file mode 100644
index 00000000..4d3e5713
--- /dev/null
+++ b/assets/html_files/testimonial.html
@@ -0,0 +1,166 @@
+
+
+
+ Beautiify | Testimonial
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
Testimonials
+
+
+
Chris Fox
+
This website is really very useful.Lorem ipsum dolor sit amet consectetur adipisicing elit. Eum blanditiis est non cum error quia modi eaque perferendis iure, rerum cumque quod, illum!!
+
+
Rebecca Flex
+
Lorem ipsum dolor sit amet consectetur adipisicing elit. Provident, in. Minus, eligendi in! Atque voluptate impedit ad libero illum soluta molestiae totam aliquam quo iure, earum debitis !!
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ Created By
+ Rakesh Roshan ❤️ | ©
+ : All Rights Reserved
+
+
+
+
+
+
diff --git a/assets/js_files/testimonial.js b/assets/js_files/testimonial.js
new file mode 100644
index 00000000..9433d7ac
--- /dev/null
+++ b/assets/js_files/testimonial.js
@@ -0,0 +1,53 @@
+document.addEventListener('DOMContentLoaded', function() {
+ // Load existing reviews from localStorage
+ loadReviews();
+
+ document.getElementById('reviewForm').addEventListener('submit', function(e) {
+ e.preventDefault();
+
+ const name = document.getElementById('name').value;
+ const review = document.getElementById('review').value;
+
+ if (name && review) {
+ const reviewContainer = createReviewElement(name, review);
+
+ // Insert new review before the cont elements
+ document.getElementById('new-reviews-container').appendChild(reviewContainer);
+
+ saveReview(name, review);
+
+ document.getElementById('reviewForm').reset();
+ }
+ });
+});
+
+function loadReviews() {
+ const reviews = JSON.parse(localStorage.getItem('reviews')) || [];
+ const reviewsContainer = document.getElementById('new-reviews-container');
+
+ reviews.forEach(review => {
+ const reviewContainer = createReviewElement(review.name, review.text);
+ reviewsContainer.appendChild(reviewContainer);
+ });
+}
+
+function saveReview(name, text) {
+ const reviews = JSON.parse(localStorage.getItem('reviews')) || [];
+ reviews.push({ name, text });
+ localStorage.setItem('reviews', JSON.stringify(reviews));
+}
+
+function createReviewElement(name, text) {
+ const reviewContainer = document.createElement('div');
+ reviewContainer.classList.add('review');
+
+ const reviewName = document.createElement('p');
+ reviewName.innerHTML = `${name} `;
+ reviewContainer.appendChild(reviewName);
+
+ const reviewText = document.createElement('p');
+ reviewText.textContent = text;
+ reviewContainer.appendChild(reviewText);
+
+ return reviewContainer;
+}
diff --git a/index.html b/index.html
index 3c827a1d..0c179ba7 100644
--- a/index.html
+++ b/index.html
@@ -64,6 +64,9 @@
+
+