css styling done?

izzyg770 · Jan 30, 2024 · d52b94e · d52b94e
1 parent 3d3c7db
commit d52b94e
Show file tree

Hide file tree

Showing 2 changed files with 95 additions and 0 deletions.
diff --git a/css/style.css b/css/style.css
@@ -0,0 +1,90 @@
+body {
+    font-family: 'Arial', Vedrana, sans-serif;
+    background-color: #000000;
+    color: #ffffff;
+    margin: 20px 20px 20px 0px;
+}
+
+h1 {
+    font-size: 42px;
+    text-align: center;
+    padding: 15px;
+}
+
+h2 {
+    font-size: 30px;
+    color: #0D0D0D;
+}
+
+p {
+    font-size: 24px;
+    padding: 10px 10px 10px 0;
+}
+
+img {
+    width: 250px;
+    display: block;
+    margin: 0 auto;
+    border: 10px dashed #ffffff;
+}
+
+div {
+    min-height: 125px;
+    padding: 20px;
+    border: 3px solid #ffffff;
+}
+
+.introduction {
+    border-radius: 15px;
+    margin-top: 15px;
+    line-height: 2;
+}
+
+.red {
+    background-color: #ff0000;
+    text-align: right;
+    margin-left: 50px;
+    border-bottom: 2px solid #ffffff;
+    border-left: 5px solid #ffffff;
+}
+
+.blue {
+    background-color: #0000ff;
+    text-align: left;
+    margin-right: 50px;
+    border-right: 5px solid #ffffff;
+    border-top: 2px solid #ffffff;
+    color: #c4c4c4;
+}
+
+.yellow {
+    background-color: #ffff00;
+    text-align: right;
+    margin-left: 50px;
+    border-bottom: 2px solid #ffffff;
+    border-left: 5px solid #ffffff;
+}
+
+.yellow p {
+    color: #707070;
+}
+
+.green {
+    background-color: #00EB00;
+    text-align: left;
+    margin-right: 50px;
+    border-right: 5px solid #ffffff;
+    border-top: 2px solid #ffffff;
+}
+
+footer {
+    background: linear-gradient(90deg, #000000 0%, #0000ff 25%, #0066ff 70%, #000000 100%);
+    border: 5px solid #ffffff;
+}
+
+footer p {
+    font-size: 20px;
+    text-align: right;
+    padding: 14px 0 15px 15px;
+    color: #ffffff;
+}
diff --git a/index.html b/index.html
@@ -3,6 +3,11 @@
 <head>
   <meta charset="UTF-8">
   <meta name="viewport" content="width=device-width, initial-scale=1.0">
+
+  <link rel="icon" type="image/x-icon" href="images/favicon.ico">
+	<link rel="stylesheet" href="css/html5reset.css">
+	<link rel="stylesheet" href="css/style.css">
+
  <title>4 Uno Rules You're Playing Wrong</title>	
 </head>	
 <body>