From 430cb0f41bcd2d701e1187cfccb69d9910d39169 Mon Sep 17 00:00:00 2001 From: darrencc1 Date: Mon, 25 Mar 2024 11:37:24 -0600 Subject: [PATCH] css changes, validation, look of site --- home-network-security/styles/styles.css | 66 ++++++++++++++++++++++--- 1 file changed, 60 insertions(+), 6 deletions(-) diff --git a/home-network-security/styles/styles.css b/home-network-security/styles/styles.css index 226137f..3925842 100644 --- a/home-network-security/styles/styles.css +++ b/home-network-security/styles/styles.css @@ -6,23 +6,37 @@ header { background-color: #000000; font-family: "Kode Mono", monospace; display: grid; - grid-column: 4 / 9; + grid-column: 2 / 11; grid-row: 1 / 2; - place-items: center; + place-items: center; + padding: 25px 25px; + } header a { text-align: center; - color: #a120e2; + color: #ffffff; text-decoration: none; font-family: "Kode Mono", monospace; + text-decoration: underline; + font-size: 25px; + text-shadow:6px 6px 12px #b01e1e; +} +nav a { + text-align: center; + color: #ffffff; + text-decoration: none; + padding: 35px; + /* background-color: #504848; */ + text-shadow:6px 6px 12px #b01e1e; } nav { text-align: center; display: flex; justify-content: space-around; + text-shadow:6px 6px 12px #b01e1e; } nav a:hover{ - background-color:#a7c3d3; + background-color:#3d0e64; } @@ -36,12 +50,22 @@ footer { grid-row: 11 / 12; place-items: center; } +footer a { + text-align: center; + color: #ffffff; + text-decoration: none; + font-family: "Kode Mono", monospace; + font-size: 25px; + text-shadow:6px 6px 12px #b01e1e; + +} .home-title { background-color:#000000; text-align:center; color: #b01e1e; font-family: "Kode Mono", monospace; + text-shadow:1px 1px 2px #ffffff ; } .intro-section { @@ -53,15 +77,35 @@ footer { background-color: black; color: azure; } +.logo { + max-width: 200px; + width: 100%; + display: block; + margin: 0 auto; + box-shadow: 0 100px 200px #b01e1e; + border-radius: 40px; +} + .security-img { max-width: 100%; -} + + border: 5px solid #9234c1; + transition: transform .5s; + box-shadow: 10px 10px 20px #b01e1e; + + } +.security-img:hover, .password-table:hover { + opacity: .6; + transform: scale(1.1); + } + .passwords { background-color:#000000; text-align:center; color: #b01e1e; font-family:"Kode Mono", monospace; + text-shadow:1px 1px 2px #ffffff ; } @@ -76,7 +120,10 @@ footer { } .password-table { - max-width: 50%; + max-width: 100%; + border: 5px solid #9234c1; + transition: transform .5s; + box-shadow: 10px 10px 20px #b01e1e; } .content-2 p { @@ -127,3 +174,10 @@ footer { content: counter(list-counter) ". "; /* Display the counter */ font-weight: bold; /* Make the counter bold */ } + +p { + + + background-image: linear-gradient(to bottom right, rgb(67, 1, 1), rgb(119, 9, 9)); + padding: 4px 4px; +}