diff --git a/Contact_Form.html b/Contact_Form.html
new file mode 100644
index 0000000..507b6ca
--- /dev/null
+++ b/Contact_Form.html
@@ -0,0 +1,48 @@
+<!DOCTYPE html>
+<html>
+<head>
+    
+    <title>CONTACT FORM</title>
+</head>
+
+<body>
+     <h1>Contact form</h1>
+<main>
+<form>
+  <h2>Contact information</h2>
+  <label for="fname">First name:</label><br>
+  <input type="text" id="fname" name="fname"><br>
+  <label for="lname">Last name:</label><br>
+  <input type="text" id="lname" name="lname"><br>
+  <label for="Email">Email:</label><br>
+  <input type="text" id="Email" name="Email"><br>
+  <label for="MobileNumber">Mobile number:</label><br>
+  <input type="text" id="MobileNumber" name="Mobile number"><br>
+
+  <h3>How did you hear about us</h3>
+
+   Please check which applies: 
+  <select name="something">
+   <option value="Search Engine">Search Engine</option>
+   <option value="Social Media">Social Media</option>
+   <option value="Recruiter">Recruiter</option><br>
+  </select>
+   <h4>Skill set of interest</h4>
+  Check on of your skills in the box :<br>
+   <input type="checkbox" name="Programing" value="Programing"> Programing<br>
+  <input type="checkbox" name="HelpDesk" value="HelpDesk"> HelpDesk<br>
+  <input type="checkbox" name="DesktopSupport" value="DesktopSuppot"> DesktopSupport<br>
+  <input type="checkbox" name="DataAnalyst" value="DataAnalyst"> DataAnalyst<br>
+
+   <h5>Comments</h5>
+   <textarea rows="4" cols="50" name="comment" form="usrform">
+   Enter text here...</textarea>
+  
+</form>
+
+
+ 
+</main>
+ 
+</body>
+</html>
\ No newline at end of file
diff --git a/images/profilepic.jpg b/images/profilepic.jpg
new file mode 100644
index 0000000..c227067
Binary files /dev/null and b/images/profilepic.jpg differ
diff --git a/resume.html b/resume.html
new file mode 100644
index 0000000..6496d23
--- /dev/null
+++ b/resume.html
@@ -0,0 +1,86 @@
+  
+<!DOCTYPE html>
+<html>
+    <head>
+        <title>Fotini's Resume</title>
+        <link rel="stylesheet" href="style.css">
+    </head>
+
+    <body>
+        <header>
+            
+            <nav>
+                <ul>
+                    <li><a href="#hero">Home</a></li>
+                    <li><a href="#about">About</a></li>
+                    <li><a href="#contact">Contact</a></li>
+                </ul>
+            </nav>
+        </header>
+        <main>
+            <section id="hero">
+                <div class="section-inner">
+                    <img src="images/profilepic.jpg" class="profile-img">
+                    <h1>Fotini</h1><br>
+                </div>
+            </section>
+            <section id="about">
+                <div class="section-inner">
+                    <h2 class="aboutme">About me</h2><br>
+                    <h2>Objective</h2>
+                    <p>Currently aiming on completing Code Differently's 12 week coding and programming bookcamp</p>
+                    <p>Interested in learning more about coding and programming</p>
+                    <p>As of this stage of my learning journey, I am interested in creating my own little corner on the web, executing a website that is a combination of instagram and twitter.</p></p>
+                    
+                    
+                    <h3>Professional Experience</h3>
+                    <div class="experience">
+                     <h3>Education</h3>
+                    <ul>
+                        <li>Bachelor's of Science, Accounting</li>
+               
+                    </ul>
+                    <h3>Skills</h3>
+
+                    <ul>
+                     <li>HTML, CSS, JavaSript - 2020</li>
+                    </ul>   
+                  </div>
+                </div>
+            </section>
+            <section id="contact">
+                <div class="section-inner">
+                    <h2>Contact Me</h2>
+                    <p>You can find me on:</p>
+                
+                    <ul>
+                        <li><a href="https://github.com/IamFotini">Github</a></li>
+                        <li><a href="www.linkedin.com/in/fotiniasla">LinkedIn</a></li>   
+                        <li>Or you can <a href="mailto:codingclassrelated@gmail.com"> send me an Email</a></li>
+                   </ul>
+                    
+                </div>
+            </section>
+        </main>
+        <footer>
+            © Copyright Fotini, 2020
+        </footer>
+    </body>
+</html>
+
+
+
+
+
+
+
+
+
+
+          
+           
+                    
+                    
+
+          
+    
\ No newline at end of file
diff --git a/style.css b/style.css
new file mode 100644
index 0000000..1514b5e
--- /dev/null
+++ b/style.css
@@ -0,0 +1,84 @@
+body {
+    margin-top: 50px;
+    margin: 0;
+    font-family: Helvetica Neue;
+    background-color: rgb(183, 240, 240);
+}
+
+header {
+    display: flex;
+    position: fixed;
+    top: 0;
+    left: 0;
+    right: 0;
+    height: 50px;
+    line-height: 50px;
+    background-color: rgb(137, 223, 223);
+    font-size: 2em;
+}
+
+header * {
+    display: inline;
+    height: 50px;
+}
+
+header ul {
+    padding: 0;
+}
+
+header li {
+    margin-left: 20px;
+}
+
+section {
+    height: 100vh;
+    
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    text-align: center;
+    
+    background-size: cover; /* Add this line */
+    background-position: center center; /* Add this line */
+    background-repeat: no-repeat; /* Add this line */
+    background-attachment: fixed; /* Add this line */
+}
+
+#hero .profile-img {
+    width: 200px;
+    height: 200px;
+    border-radius: 50%;
+    padding: 100px;
+    margin-top: 100px;
+}
+
+footer {
+    text-align: center;
+    padding: 50px;
+}
+
+#hero h1 {
+    font-size: 3em;
+    font-family: Helvetica Neue;
+    font-weight: 350;
+}
+
+#hero h2 {
+    font-size: 25px;
+    font-family: Helvetica Neue;
+    font-weight: 300;
+}
+
+section h2 {
+    font-size: 2.5em;
+}
+
+section h3 {
+    font-size: 1.5em;
+}
+
+header a {
+    text-decoration: none;
+    color: black;
+}
+
