diff --git a/design-files/desktop.jpg b/design-files/desktop.jpg index 136265451..ff21f08c7 100644 Binary files a/design-files/desktop.jpg and b/design-files/desktop.jpg differ diff --git a/great-idea-website/css/index.css b/great-idea-website/css/index.css index 7766e7f18..29a478a55 100644 --- a/great-idea-website/css/index.css +++ b/great-idea-website/css/index.css @@ -63,4 +63,129 @@ h1, h2, h3, h4, h5 { margin-bottom: 15px; } -/* Your code starts here! */ \ No newline at end of file +/* Your code starts here! */ +body{ + margin: auto; + width: 1000px; +} +/*Header Styling*/ +header nav{ + display: inline-block; + margin: 25px 0px 10px 15px; + width: 75%; +} +header nav a{ + margin: 0 30px; + color: grey; + text-decoration: none; + font-size: 14px; +} +/*nav bar*/ +.navbar { + overflow: hidden; + position: fixed; + top: 0; + width: 49%; + background-color: rgb(0, 0, 92); + } +.navbar:hover{ + background-color: rgb(0, 110, 255); +} +.navbar a:hover{ + color: rgb(0, 0, 92); + animation: Highlight 2s; +} +.navbar a { + float: left; + display: inline-block; + text-align: center; + text-decoration: none; + } +.logo{ + display: inline-block; + padding: 25px 15px 0px 0px; +} +/*title styling*/ +h1{ + font-size: 80px; +} +div.title{ + text-align: center; + width: 49%; + display: inline-block; + padding: 50px; +} +button{ + width: 150px; + height: 30px; + border: 1px solid black; +} +button:hover{ + animation: Highlight 10s; +} +@keyframes Highlight { + 0%{ + transform: scale(1); + } + 20%{ + transform: scale(1.2) + } + 60%{ + transform: scale(1.2) + } + 100%{ + transform: scale(1.2) + } + } +.code{ + display: inline-block; + width: 49%; + padding: 0px 50px; +} +div.fix{ + margin-top: 100px; +} +/*main section styling*/ +hr { + width:90%; + height:3px; + background:black; +} +div.feat{ + display: inline-block; + width: 40%; + margin: 30px 10px 30px 45px; +} +div.abt{ + display: inline-block; + width: 40%; + margin: 30px 10px 30px 45px; +} +.middle-img{ + width: 90%; + margin: 0px 49px 0px; +} +div.service{ + display: inline-block; + width: 29%; + margin: 30px 10px 30px 45px; +} +div.product{ + display: inline-block; + width: 29%; +} +div.vision{ + display: inline-block; + width:29%; +} +/*contact info/footer*/ +div.contact{ + width: 16%; + display: inline-block; + margin-left: 45px; + margin-top: 30px; +} +footer{ + text-align: center; + margin: 50px 0px; +} \ No newline at end of file diff --git a/great-idea-website/index.html b/great-idea-website/index.html index 92beabd65..516dba15c 100644 --- a/great-idea-website/index.html +++ b/great-idea-website/index.html @@ -15,49 +15,64 @@ - - Services - Product - Vision - Features - About - Contact - - - Innovation - On - Demand - - Get Started - - Image of a code snippet. - - Features - Aliquam elementum magna eros, ac posuere elvit tempus et. Suspendisse vel tempus odio, in interdutm nisi. Suspendisse eu ornare nisl. Nullam convallis augue justo, at imperdiet metus scelerisque quis. - - - About - Aliquam elementum magna eros, ac posuere elvit tempus et. Suspendisse vel tempus odio, in interdutm nisi. Suspendisse eu ornare nisl. Nullam convallis augue justo, at imperdiet metus scelerisque quis. - - Image of code snippets across the screen - - Services - Aliquam elementum magna eros, ac posuere elvit tempus et. Suspendisse vel tempus odio, in interdutm nisi. Suspendisse eu ornare nisl. Nullam convallis augue justo, at imperdiet metus scelerisque quis. - - - Product - Aliquam elementum magna eros, ac posuere elvit tempus et. Suspendisse vel tempus odio, in interdutm nisi. Suspendisse eu ornare nisl. Nullam convallis augue justo, at imperdiet metus scelerisque quis. - - Vision - Aliquam elementum magna eros, ac posuere elvit tempus et. Suspendisse vel tempus odio, in interdutm nisi. Suspendisse eu ornare nisl. Nullam convallis augue justo, at imperdiet metus scelerisque quis. - - Contact - 123 Way 456 Street - Somewhere, USA - 1 (888) 888-8888 - sales@greatidea.io - - Copyright Great Idea! 2018 - +
+
+ +
+
+
+
+

Innovation

+

On

+

Demand

+ +
+ Image of a code snippet. +
+
+
+
+

Features

+

Aliquam elementum magna eros, ac posuere elvit tempus et. Suspendisse vel tempus odio, in interdutm nisi. Suspendisse eu ornare nisl. Nullam convallis augue justo, at imperdiet metus scelerisque quis.

+
+
+

About

+

Aliquam elementum magna eros, ac posuere elvit tempus et. Suspendisse vel tempus odio, in interdutm nisi. Suspendisse eu ornare nisl. Nullam convallis augue justo, at imperdiet metus scelerisque quis.

+
+ Image of code snippets across the screen +
+
+

Services

+

Aliquam elementum magna eros, ac posuere elvit tempus et. Suspendisse vel tempus odio, in interdutm nisi. Suspendisse eu ornare nisl. Nullam convallis augue justo, at imperdiet metus scelerisque quis.

+
+
+

Product

+

Aliquam elementum magna eros, ac posuere elvit tempus et. Suspendisse vel tempus odio, in interdutm nisi. Suspendisse eu ornare nisl. Nullam convallis augue justo, at imperdiet metus scelerisque quis.

+
+
+

Vision

+

Aliquam elementum magna eros, ac posuere elvit tempus et. Suspendisse vel tempus odio, in interdutm nisi. Suspendisse eu ornare nisl. Nullam convallis augue justo, at imperdiet metus scelerisque quis.

+
+
+
+

Contact

+
Way 456 Street + Somewhere, USA

+
(888) 888-8888

+
sales@greatidea.io
+
+ \ No newline at end of file