diff --git a/assets/1.jpg b/assets/1.jpg
new file mode 100644
index 0000000..73b1d63
Binary files /dev/null and b/assets/1.jpg differ
diff --git a/assets/ganesh.png b/assets/ganesh.png
new file mode 100644
index 0000000..a9aa0a8
Binary files /dev/null and b/assets/ganesh.png differ
diff --git a/assets/rose-background.jpg b/assets/rose-background.jpg
new file mode 100644
index 0000000..35fcf2b
Binary files /dev/null and b/assets/rose-background.jpg differ
diff --git a/harshBio.html b/harshBio.html
new file mode 100644
index 0000000..a2330e5
--- /dev/null
+++ b/harshBio.html
@@ -0,0 +1,59 @@
+
+
+
+
+
+
+ Marriage Biodata
+
+
+
+
+
+
+
+
+
+
+
+
Biodata
+
+
+
Harsh Patel
+
Software Engineer
+
+
+
+
My Details
+
+
+
+
Images
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
diff --git a/main.js b/main.js
new file mode 100644
index 0000000..184bd5b
--- /dev/null
+++ b/main.js
@@ -0,0 +1,138 @@
+/**This function is used for flip the card */
+document.getElementById('clickToFlap').addEventListener('click', function() {
+ document.getElementById('flipCard').classList.toggle('flip');
+});
+
+//this function is used for making the details html
+$(function() {
+ var detailsWrapper = document.getElementById("detail-list"); // get the details html div
+
+ var myDetailHTML = ''; //variable that hold my details html
+
+ //variable that contains my details
+ var myData = [
+ {
+ key : "Name",
+ value : "Harsh Joginbhai Patel",
+ },
+ {
+ key : "Date of birth",
+ value : "31/May/1998",
+ },
+ {
+ key : "Time of birth",
+ value : "11:15 AM",
+ },
+ {
+ key : "Place of birth",
+ value : "Khambhat, Gujarat",
+ },
+ {
+ key : "Complexion",
+ value : "Fair",
+ },
+ {
+ key : "Weight",
+ value : "68 kg",
+ },
+ {
+ key : "Height",
+ value : `5' 8"`,
+ },
+ {
+ key : "Cast",
+ value : "Kadva Patel",
+ },
+ {
+ key : "Sub Cast",
+ value : "42 Gam Kadva Patel",
+ },
+ {
+ key : "Education",
+ value : "IT Engineer",
+ },
+ {
+ key : "Profession",
+ value : "Android Developer at Openxcell Technolabs",
+ },
+ {
+ key : "Father's Name",
+ value : "Joginbhai Vadilal Patel",
+ },
+ {
+ key : "His Profession",
+ value : "Social Worker",
+ },
+ {
+ key : "Mother's Name",
+ value : "Urmilaben Joginbhai Patel",
+ },
+ {
+ key : "Her Profession",
+ value : "House Maker",
+ },
+ {
+ key : "Brother",
+ value : "Meet Patel",
+ },
+ {
+ key : "His Profession",
+ value : "Mechanical Engineer",
+ },
+ {
+ key : "Native",
+ value : "Kapadwanj",
+ },
+ {
+ key : "Mosal",
+ value : "Finav, Khambhat",
+ },
+ {
+ key : "Address",
+ value : "1328, Mota Patelwada, beside Swaminarayan Temple, Kapadwanj, Kheda-387620",
+ },
+ {
+ key : "Food Habbit",
+ value : "Veg",
+ }
+ ]
+
+ for (var i = 0; i < myData.length; i++) { //generating my details html by using loop
+ myDetailHTML += `
${myData[i].key}
${myData[i].value}
`;
+ }
+
+ detailsWrapper.innerHTML = myDetailHTML //adding the dynamic html as inner HTML of my details div
+
+});
+
+//this function is used for showing my all photos
+$(function() {
+ var imagesWrapper = document.getElementById("all-images"); //this is holding the parent container where my all photo's html will be inserted
+
+ //this is the variable that hold my image name and my all images exist in assets folder
+ var myImageName = [
+ '1.jpg',
+ '1.jpg',
+ '1.jpg',
+ '1.jpg',
+ '1.jpg',
+ '1.jpg',
+ ]
+
+ var myImageHTML = ''; //variable that hold the html of my all photos
+
+ for (var i = 0; i < myImageName.length; i++) {//generating html by of my all photos by using loop
+ myImageHTML += `
+ 
+