diff --git a/css/Style.css b/css/Style.css
new file mode 100644
index 0000000000000000000000000000000000000000..e9d494659be481f4372d20b635a98870bdfaad2d
--- /dev/null
+++ b/css/Style.css
@@ -0,0 +1,297 @@
+/*-------------------------*/
+/*----------Reset----------*/
+/*-------------------------*/
+
+
+html {
+	font-family: sans-serif;
+	-webkit-text-size-adjust: 100%;
+	-ms-text-size-adjust:     100%;
+}
+
+body {
+	margin: 0;
+}
+
+img {
+	display: block;
+	border: 0;
+	width: 100%;
+	height: auto;
+}
+
+/*------------------------*/
+/*----------Text----------*/
+/*------------------------*/
+
+body,
+button,
+input,
+select,
+textarea {
+	color: #404040;
+	font-family: 'Helvetica', Arial, sans-serif;
+	font-size: 18px;
+	line-height: 1.5;
+}
+
+a { color: inherit; } 
+
+h1,
+h2,
+h3 {
+	margin: 0;
+	padding: 1em 0;
+}
+
+h1/*header*/{
+	text-align: right;
+	font-size: 1em;
+	text-decoration: none;
+	text-shadow: 0px 1px 3px rgba(0, 0, 0, 1);
+}
+
+h2/*main*/{
+	text-align: center;
+	text-decoration: underline;
+}
+
+h3/*footer*/{
+	text-align: left;
+		font-size: 0.8em;
+	text-decoration: none;
+	text-shadow: 0px 1px 3px rgba(0, 0, 0, 1);
+}
+
+h4{
+	text-align: center;
+	text-decoration: underline;
+}
+
+
+
+
+.paragraph1{
+	margin: 2%;
+
+}
+.paragraph2{
+	margin: 2%
+
+}
+.p3{
+	margin: 2%;
+	background-color: rgb(189, 231, 189);
+}
+
+ul1 {
+    list-style-type: none;
+    margin: 0;
+    padding: 0;
+	overflow: hidden;
+	position: -webkit-sticky; /* Safari */
+    position: sticky;
+    top: 0;
+   
+}
+
+li1 {
+	padding-right: 1%;
+	float: right;
+	
+}
+
+li1 a {
+    display: block;
+    color: white;
+    text-align: center;
+	padding: 14px 16px;
+	font-size: 1.3em;
+	text-decoration: none;
+	text-shadow: 0px 1px 3px rgba(0, 0, 0, 1);
+	
+}
+
+li1 a:hover:not(.active) {
+    background-color: #557c1f
+}
+
+.active {
+    background-color: #4CAF50;
+}
+
+input[type=submit] {
+    background-color: #88bd2c;
+    color: rgb(0, 0, 0);
+    padding: 12px 20px;
+     
+    cursor: pointer;
+   
+}
+
+input[type=submit]:hover {
+    background-color: #688f23;
+}
+
+/*---------------------------*/
+/*----------General----------*/
+/*---------------------------*/
+
+.site {
+	background: #f1f1f1;
+	min-height: 100vh;
+}
+
+.header,
+.navigation,
+.content,
+.footer {
+	padding: 0;
+	
+}
+
+.content {
+	background: white;
+	border-left: 1px solid black;
+	border-right: 1px solid black;
+
+
+}
+.header {
+	background: #88bd2c;
+	color: white;
+}
+
+.navigation {
+	background:  #688f23;
+}
+
+
+
+.footer {
+	
+	background: #8e8e8e;
+	color: white;
+}
+
+
+/*---------------------------*/
+/*----------Images----------*/
+/*---------------------------*/
+
+.logo_img{
+	padding-left: 10%;
+	float: left; /*not sure how to move it along without stretching coloumn*/
+	
+}
+
+.picture1{     
+	float: right;
+		}
+
+
+
+.picture2{
+	grid-column: 4/5; 
+	grid-row: 3/4;
+	display: block;
+	border: 0;
+	width: 100%;
+	height: auto;
+		}
+
+.picture3{
+    float: right;
+    height: 15%;
+    width: 15%;
+      
+    margin: 10px;
+    padding-top: 1px;
+    padding-left: 1px;
+    padding-right: 1px;
+    padding-bottom: 1px;
+     	}
+.picture3 img{
+    border-radius: 50%;
+			}
+
+.picture4{
+	float: right;
+	height:  20%;
+	width: 20%;
+  
+	margin: 2%;
+	padding-top: 1px;
+	padding-left: 1px;
+	padding-right: 1px;
+	padding-bottom: 1px;
+			}
+
+
+/*-----------------------------------------------------------------------------------------------*/
+/*----------Displays grids on anything with the min width of 700px , most modern phones----------*/
+/*-----------------------------------------------------------------------------------------------*/
+
+
+@media screen and (min-width: 700px) {
+	@supports (display: grid) {
+
+		.site {
+			display: grid;
+			grid-template-columns: 1fr repeat(6, minmax(auto, 10em)) 1fr;
+			   
+			grid-template-rows: [row1-start] minmax(1em, auto) [row2-start] minmax(1em, auto) [row3-start] 1fr	[row4-start] auto;
+			}
+
+		.header,
+		.navigation,
+		.footer {
+            grid-column-start:1;
+			grid-column-end: 9;
+			border-bottom: 1px solid black;
+
+		}
+		
+		.header{
+			padding-right: 10%;
+		}
+
+
+		.navigation{
+			
+			grid-row-start: 2/3;
+			border-bottom: 1px solid black;
+			display: inline-block;
+			padding-right: 8%;
+
+		}
+
+
+
+		.content {
+			grid-column: 2/8;
+			grid-row: 3/4;
+			margin: 15px;
+			border-top: 1px solid black;
+			border-bottom: 1px solid black;
+		}
+
+	
+
+		
+
+
+		.footer{
+			grid-row: 4/5;
+			border-top: 1px solid black;
+			padding-left: 10%;
+				}
+
+
+
+
+
+
+	}
+
+}
\ No newline at end of file