Tejas1510 · Tejas1510 · Oct 1, 2020 · Oct 1, 2020
diff --git a/Awesome-portfolio/image/App.png b/Awesome-portfolio/image/App.png
diff --git a/Awesome-portfolio/image/Code.png b/Awesome-portfolio/image/Code.png
diff --git a/Awesome-portfolio/image/Web.png b/Awesome-portfolio/image/Web.png
diff --git a/Awesome-portfolio/image/cloud.png b/Awesome-portfolio/image/cloud.png
diff --git a/Awesome-portfolio/image/computer.png b/Awesome-portfolio/image/computer.png
diff --git a/Awesome-portfolio/image/favicon.ico b/Awesome-portfolio/image/favicon.ico
diff --git a/Awesome-portfolio/image/gt.png b/Awesome-portfolio/image/gt.png
diff --git a/Awesome-portfolio/image/mountain.png b/Awesome-portfolio/image/mountain.png
diff --git a/Awesome-portfolio/index.html b/Awesome-portfolio/index.html
@@ -0,0 +1,127 @@
+<!DOCTYPE html>
+<html lang="en" dir="ltr">
+  <head>
+    <meta charset="utf-8">
+    <title>Goransh Todwal</title>
+    <!-- Bootstrap Css Connectivity url -->
+  <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/css/bootstrap.min.css" integrity="sha384-Vkoo8x4CGsO3+Hhxv8T/Q5PaXtkKtu6ug5TOeNV6gBiFeWPGFN9MuhOf23Q9Ifjh" crossorigin="anonymous">
+
+
+    <link rel="stylesheet" href="style.css">
+
+    <link rel="icon" href="image/favicon.ico">
+    <!-- Bootstrap javacript-jquery Connectivity url -->
+  <script src="https://code.jquery.com/jquery-3.4.1.slim.min.js" integrity="sha384-J6qa4849blE2+poT4WnyKhv5vZF5SrPo0iEjwBvKU7imGFAV0wwj1yYfoRSJoZ+n" crossorigin="anonymous"></script>
+<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/umd/popper.min.js" integrity="sha384-Q6E9RHvbIyZFJoft+2mJbHaEWldlvI9IOYy5n3zV9zzTtmI3UksdQRVvoxMfooAo" crossorigin="anonymous"></script>
+<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/js/bootstrap.min.js" integrity="sha384-wfSDF2E50Y2D1uUdj0O3uMBJnjuUD4Ih7YwaYd1iqfktj0Uod8GCExl3Og8ifwB6" crossorigin="anonymous"></script>
+
+  </head>
+  <body>
+    <section  id="title">
+
+  <div class="container-fluid">
+
+    <!-- Nav Bar -->
+
+    <nav class="navbar navbar-expand-lg navbar-light" style="background-color: #E4F9F5;">
+
+      <a class="navbar-brand" href=""><i>Gt-Web designer</i></a>
+
+      <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarTogglerDemo02">
+          <span class="navbar-toggler-icon"></span>
+      </button>
+
+      <div class="collapse navbar-collapse" id="navbarTogglerDemo02">
+
+        <ul class="navbar-nav ml-auto">
+          <li class="nav-item">
+            <a class="nav-link" href="#footer">Contact</a>
+          </li>
+          <li class="nav-item">
+            <a class="nav-link" href="#pricing">Skills</a>
+          </li>
+          <li class="nav-item">
+            <a class="nav-link" href="#cta">About me</a>
+          </li>
+        </ul>
+</div>
+</div>
+
+    </nav>
+
+
+
+<div class="top-container">
+    <img class="cloud1" src="image/cloud.png" alt="cloud1">
+  <h1>I'm Goransh Todwal</h1>
+    <p class="p1top"> a <span><b>Web</b></span> designer</p>
+    <img class ="cloud2" src="image/cloud.png" alt="cloud2">
+    <img class="mountain" src="image/mountain.png" alt="mountain">
+    </div>
+    </section>
+
+
+            <div class="middle-container">
+              <div id="cta">
+
+
+                  <div class="profile">
+                        <img class="myimg" src="image/gt.png" alt="my-image">
+                        <h2>Hello.</h2>
+                        <p class="intro">I'm pursuing btech Arya College of Engineering and It.<br>
+                          I'm a web designer and App developer.</p>
+                        </div>
+                        </div>
+<hr width="30%">
+  <div id="pricing">
+        <div class="skills">
+          <h2>My Skills</h2>
+          <div class="skill-row">
+            <img class="web" src="image/Web.png" alt="web designing">
+            <div class="webdes">
+          <h3 class="h31" >Design and Development</h3>
+            <p class="p1">I like Web designing and i make a own websites through web designing</p>
+            </div>
+          </div>
+          <div class="skill-row">
+            <img class ="app" src="image/App.png" alt="App development">
+            <div class="appdev">
+            <h3>App Development</h3>
+            <p class="p2">I also like App Development and I really like to designing a App</p>
+              </div>
+        </div>
+        <div class="skill-row">
+          <img class="code" src="image/Code.png" alt="Coding">
+          <div class="codedes">
+              <h3>Coding</h3>
+              <p>Coding is My Art I like Code Coding is really Enjoyable and fun. </p>
+                </div>
+
+        </div>
+        </div>
+
+
+        </div>
+        <hr width="30%">
+
+
+
+
+
+          <div class="bottom-container">
+          <h2> Get In Touch</h2>
+          <p>If you have a project that you want to get started, think you need my help with something or<br>
+             just fancy saying hey, then get in touch.</p>
+          <a class="btn" <a href="mailto:[email protected]">Contact me</a>
+        <div id="footer">
+
+          <div class="last">
+            <a href="https://www.instagram.com">instagram</a>
+            <a href="https://www.facebook.com">facebook</a>
+            <a href="https://www.linkedin.com">linkedin</a>
+            <p class="lastp">© 2020 todwalgoransh53. All rights reserved</p>
+  </div>
+  </div>
+      </div>
+  </body>
+</html>
diff --git a/Awesome-portfolio/style.css b/Awesome-portfolio/style.css
@@ -0,0 +1,164 @@
+body
+{
+  text-align: center;
+  margin: 0;
+  /* font-family: 'Montserrat',sans-serif; */
+  line-height: 2;
+}
+#title
+{
+  background-color: #E4F9F5;
+}
+.navbar-light .navbar-brand
+{
+  color:#7892c2;
+}
+.navbar-brand
+{
+font-size: 2rem;
+font-weight: bold;
+font-family: cursive;
+}
+.navbar
+{
+  margin: 0;
+}
+.top-container
+{
+  background-color: #E4F9F5;
+  text-align: center;
+  font-family: 'Sacramento',cursive;
+  line-height: 2;
+}
+.cloud2
+{
+  position: absolute;
+  margin-left: -100px;
+}
+.cloud1
+{
+  margin-top: 10px;
+  margin-left: 500px;
+}
+.myimg
+{
+  padding: 50px;
+  height: 300px;
+}
+.skill-row
+{
+  width: 50%;
+  margin: 100px auto;
+  text-align: left;
+  line-height: 2;
+}
+.web
+{
+  height: 200px;
+
+}
+.app
+{
+  height: 200px;
+
+}
+.code
+{
+  height: 200px;
+
+}
+.btn {
+	box-shadow: 0px 0px 0px 2px #9fb4f2;
+	background:linear-gradient(to bottom, #7892c2 5%, #476e9e 100%);
+	background-color:#7892c2;
+	border-radius:18px;
+	border:3px solid #4e6096;
+	display:inline-block;
+	cursor:pointer;
+	color:#ffffff;
+	font-family:Arial;
+	font-size:22px;
+	padding:12px 20px;
+	text-decoration:none;
+	text-shadow:-1px 5px 0px #283966;
+  margin-bottom: 40px;
+}
+.btn:hover {
+	background:linear-gradient(to bottom, #476e9e 5%, #7892c2 100%);
+	background-color:#476e9e;
+}
+.btn:active {
+	position:relative;
+	top:1px;
+}
+.last
+{
+  background-color: #66BFBF;
+  height: 200px;
+  padding: 50px 0px 20px;
+
+}
+a{
+  margin:10px 20px;
+  padding-bottom: 100px;
+  text-decoration: none;
+}
+a:hover
+{
+  color:#EAF6F6;
+}
+h1
+{
+  color:#66BFBF;
+}
+h3
+{
+  color:#66BFBF;
+}
+h2
+{
+  color:#66BFBF;
+}
+.p1top
+{
+  color:#66BFBF;
+
+}
+
+.mountain
+{
+  height:300px;
+}
+
+h2:hover{
+
+  color:darkblue;
+}
+h3:hover{
+  color:#ff0000;
+}
+.lastp
+{
+  font-size: 13px;
+  color:grey;
+}
+.webdes
+{
+  float: right;
+}
+.appdev
+{
+  float: left;
+}
+.codedes
+{
+  float: right;
+}
+.app
+{
+  margin-left: 50px;
+}
+.code
+{
+  margin-left: 50px;
+}