init

2025-02-23 23:29:42 -05:00
commit 7d221ecd31
10 changed files with 267 additions and 0 deletions
@@ -0,0 +1,141 @@
+body {
+    margin: 0;
+    margin-top: 50px;
+}
+
+header {
+    display: flex;
+    position: fixed;
+    top: 0;
+    left: 0;
+    right: 0;
+    height: 50px;
+    line-height: 50px;
+    background-color: aliceblue;
+    font-family: Arial, Helvetica, sans-serif;
+}
+
+header * {
+    display: inline;
+    height: 50px;
+}
+
+header ul {
+    padding: 0;
+}
+
+header li {
+    margin-left: 20px;
+}
+
+section {
+    height: 100vh;
+    border: 0px solid black;
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    text-align: center;
+}
+
+.section-inner {
+    font-size: 1.5em;
+    border-radius: 25px;
+    padding: 25px;
+    background-color: rgba(255, 255, 255, .80);
+    width: 65%;
+    font-family: Arial, Helvetica, sans-serif;
+    
+
+}
+
+#projects {
+    height: 2160px;
+}
+
+.about-text {
+    padding: 0px;
+}
+
+#about .profile-img {
+    width: 300px;
+    border-radius: 50%;
+}
+
+#about h1 {
+    font-size: 3em;
+}
+
+section h2 {
+    font-size: 2.5em;
+}
+
+section h3 {
+    font-size: 1.5em;
+}
+
+header a {
+    text-decoration: none;
+    color: black;
+}
+
+footer {
+    text-align: center;
+    padding: 50px;
+}
+
+#about {
+    background-size: cover;
+    background-position: middle;
+    background-image: url('./assets/about-background.JPG');
+}
+
+#services {
+    background-size: cover;
+    background-position: middle;
+    background-image: url('./assets/jfvalois_burrard_inlet.jpg');
+}
+
+
+#projects {
+    background-size: cover;
+    background-position: middle;
+    background-image: url('./assets/background.jpg');
+}
+
+#contact {
+    background-size: cover;
+    background-position: 75%;
+    background-image: url('./assets/background2.jpg');
+}
+
+.img {
+    width:67%;
+}
+
+.favicon {
+    height: 1em;
+
+}
+
+a:link {
+    text-decoration: none;
+    color: blue;
+    font-weight: bold;
+}
+
+
+a:visited {
+    text-decoration: none;
+    color: blue;
+    font-weight: bold;
+}
+
+
+a:hover {
+    text-decoration: none;
+}
+
+
+a:active {
+    text-decoration: none;
+}