CodeYourFuture · diegoharera · Jun 30, 2022
diff --git a/README copy.md b/README copy.md
@@ -0,0 +1,27 @@
+# HTML/CSS Project
+
+## Setup
+
+First step is to fork this repo into your own Github account - if you don't remember how, then refer back Lesson 0 contents.
+
+## Homework
+
+Create a new webpage on a subject that you're interested in (maybe the same topic you used for your Codepen submission).
+
+The page should **NOT** use any framework like Bootstrap.
+
+It should include the following elements:
+
+- The `.html` page and a linked `.css` file applies a consistent color scheme to links and text on your page.
+- A page header with a title and description for the site.
+- An articles section with three articles, each including a title, summary and a link.
+- A page footer containing info about you or the site.
+- Proper use of the semantic HTML tags we discussed.
+- Research the `:first-child` pseudo-class and use it to style the first article so that it stands out from the others.
+- Use this website [Lorem Ipsum](http://www.lipsum.com/) to generate random blocks of contents to fill your website.
+- **Commit often (with good meaningful commit messages), and Push to Github regularly.**
+- Use the sketch below to guide you towards the layout and content you are trying to achieve. _Please note that this is just a sketch - you can choose the colours, fonts and images that you want to use in the page._
+
+  <a href="blog-sketch-week-1.png" target="blank">
+    <img src="blog-sketch-week-1.png" style="border: 1px solid #bababa;">
+  </a>
diff --git a/legend cut 3.PNG b/legend cut 3.PNG
diff --git a/legendcuts.png b/legendcuts.png
diff --git a/loco1.PNG b/loco1.PNG
diff --git a/loco2.PNG b/loco2.PNG
diff --git a/loco3.PNG b/loco3.PNG
diff --git a/loco4.PNG b/loco4.PNG
diff --git a/nivea.png b/nivea.png
diff --git a/week1.css b/week1.css
@@ -0,0 +1,272 @@
+
+header {
+ overflow: hidden;
+background-color: black;   
+margin-top: 50px;
+margin-left: 150px;
+margin-right: 150px;
+}
+
+body {
+margin:0;
+padding:0;
+background-color: rgb(236, 241, 240);
+background-image: url(jpg); 
+}
+
+video {
+width: 700px;
+height: 800px;
+}
+
+
+img { 
+width: 300px;
+height: 250px;
+margin-top: 20px;
+}
+
+ul { 
+display: flex;
+list-style: none;
+float: right;
+padding: 0px;
+}
+
+li a {
+color: rgb(245, 239, 239);
+text-decoration: none;
+padding: 10px;
+overflow: hidden;
+}
+
+li a:hover {
+color: rgb(14, 14, 15);
+background-color: rgb(243, 56, 4);
+padding: 27px; 
+width: 15px;     
+}
+
+.logo { 
+font-size: 50px; 
+}
+.part1 {
+   box-sizing: border-box;
+   margin-top: 30px;
+}
+h2{
+  margin-left: 550px;
+  margin-top: 60px;
+  color: orangered;  
+}
+.diva1 {
+text-align: center;
+font-size:x-large;
+margin-top: 70px;
+}
+.number1 {
+ margin-top: 50px;
+font-style: inherit;
+box-shadow: 5px 3px 5px 3px ;
+width:1000px;
+margin-left: 250px;
+}
+.diva2 {
+text-align: end; 
+}
+.para1 {
+   width: 500px;
+   margin-top: 100px;
+   margin-left: 900px;
+
+}
+.picture1 {
+ width: 400px;
+ height: 500px;
+ margin-top: -400px;
+
+}
+.button1 {
+ margin-left: 1200px;
+ margin-bottom: 40px;
+
+}
+ .butt {
+width: 200px;
+background-color: orangered;
+box-sizing: content-box;
+font-style: italic;
+
+
+ }
+ .part2 {
+ background-color: black;
+ height: 500px;
+
+ }
+ .service { 
+ color: aliceblue;
+ text-align: center;
+ padding-top: 80px;
+ text-transform: uppercase;
+ font-size: xx-large;
+ margin-left: 500px;
+
+ }
+ .service1 {
+ margin-top: 250px;
+ padding: 0px;  
+ }
+
+ em{ 
+   color: aqua;
+
+ }
+
+ .precing12 {
+  margin-left:500px;
+ }
+ .pricing2 {
+   color: aqua;
+   text-align: center;
+   padding-top: 100px;
+
+
+ }
+
+ .image2 {
+  width: 350px;
+  height: 400px;
+  margin-left: 200px;
+  margin-bottom: 30px;
+  margin-top: -280px;
+ }
+ .para12 {
+   margin-left: 300px;
+
+ }
+
+ .para2 {
+  margin-left: 200px;
+  text-align: center;
+  color: aliceblue;
+ }
+
+ .burundi1{
+   margin-left: 860px;
+   margin-top: -150px;
+
+ }
+ .burundi{
+  width: 100px;
+  height: 50px;
+  color: orangered;
+  background-color: black;
+  border-color: orangered;
+
+ }
+
+ .south1 {
+   margin-left: 750px;
+   margin-top: -50px;
+   border: 1px solid;
+
+
+ }
+
+ .south {
+   width: 100px;
+  height: 50px;
+  color: orangered;
+  background-color: black;
+  border-color: orangered;
+ }
+
+ .burundi:hover {
+
+   background-color: orangered;
+   color: black;
+ }
+
+ .south:hover {
+
+   background-color: orangered;
+   color: black;
+ }
+
+ .garelie{
+  text-align: center;
+  background-color: orangered;
+  width: 300px;
+  margin-left: 600px;
+  margin-top: 50px;
+ }
+ .some image{
+   text-align: center;
+
+ }
+
+ .some{
+   padding-top: 100px;
+  text-align: center;
+  font-size: xx-large;
+
+ }
+ .loco1{
+   margin-left: 200px;
+   margin-top: 10px;
+
+
+ }
+ .locopc1{
+
+   width: 300px;
+   height: 440px;
+   margin-top: 50px;
+ }
+ .loco2{
+   text-align: center;
+   margin-top: -400px;
+
+ }
+ .locopc2{
+
+   width: 300px;
+   height: 400px;
+  margin-bottom: -30px;
+
+ }
+
+ .loco3{
+text-align: end;
+margin-top: -400px;
+margin-right: 200px;
+ }
+
+ .locopc3{
+
+   width: 300px;
+   height: 400px;
+  margin-bottom: -30px;
+
+ }
+ .loco4{
+   text-align: center;
+   margin-top: 100px;
+    }
+
+    .locopc4{
+      margin-bottom: 30px;
+      width: 1200px;
+      height: 500px;
+    }
+
+    footer{
+      background-color: black;
+      text-align: center;
+    }
+    .intro1{
+      color: black;
+      background-color: black;
+     margin-right: 500px;
+    }