diff --git a/index.html b/index.html index d01f779ff..a6fcfcfba 100644 --- a/index.html +++ b/index.html @@ -3,9 +3,70 @@ + + + Document + - +
+

Daniel Rau

+ +
+
+
+

Daniel Rau

+

My Projects

+
+
+
+
+
+
+
+
+
+
+
+
+

Generic text about trees!

+
+
+

Generic text about trees!

+
+
+

Generic text about trees!

+
+
+
+
+
+
+
+
+
+
+
+
+

Generic text about trees!

+
+
+

Generic text about trees!

+
+
+

Generic text about trees!

+
+
+ \ No newline at end of file diff --git a/style/index.css b/style/index.css index 440e53514..9797838d8 100644 --- a/style/index.css +++ b/style/index.css @@ -1 +1,227 @@ -/* Add CSS styling here */ \ No newline at end of file +/* Add CSS styling here */ +html, body, div, span, applet, object, iframe, +h1, h2, h3, h4, h5, h6, p, blockquote, pre, +a, abbr, acronym, address, big, cite, code, +del, dfn, em, img, ins, kbd, q, s, samp, +small, strike, strong, sub, sup, tt, var, +b, u, i, center, +dl, dt, dd, ol, ul, li, +fieldset, form, label, legend, +table, caption, tbody, tfoot, thead, tr, th, td, +article, aside, canvas, details, embed, +figure, figcaption, footer, header, hgroup, +menu, nav, output, ruby, section, summary, +time, mark, audio, video { + margin: 0; + padding: 0; + border: 0; + font-size: 100%; + font: inherit; + vertical-align: baseline; +} +/* HTML5 display-role reset for older browsers */ +article, aside, details, figcaption, figure, +footer, header, hgroup, menu, nav, section { + display: block; +} +body { + line-height: 1; +} +ol, ul { + list-style: none; +} +blockquote, q { + quotes: none; +} +blockquote:before, blockquote:after, +q:before, q:after { + content: ''; + content: none; +} +table { + border-collapse: collapse; + border-spacing: 0; +} + +/* ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^CSS RESET^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ */ + +/* GENERAL STYLING */ +html{ + font-size:62.5%; + font-family: 'Oxygen', sans-serif; + color: #fefae0; +} + +body{ + font-size: 2rem; + line-height: 1.5; + background-color: #283618; + +} + +a{ + text-decoration: none; + font-size: 2rem; + color: #fefae0; +} + +img{ + border: 5px solid black; + +} + +p{ + font-size: 2rem; +} + +/* HEADER STYLING */ + +header{ + padding: 1%; + display: flex; + justify-content: space-between; +} + +body { + font-size: 1.6rem; +} + + +nav { + width: 25%; + display: flex; +} + +nav a{ + background-color: #bc6c25; + color: #fefae0; + padding: 1% 5%; + border: 3px solid black; +} + +.headername{ + font-size: 2.2rem; +} + +.home{ + background-color: black; +} + +/* MAIN TITLE STYLING */ + +.maintitle{ + display:flex; + justify-content: center; + margin: 5% 10%; + padding: 10%; + background-image: url(https://images.unsplash.com/photo-1629829386095-535f462b59e3?ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&ixlib=rb-1.2.1&auto=format&fit=crop&w=634&q=80); + background-repeat: no-repeat; + background-size: cover; +} + +.bigname { + color: snow; +} + +h1{ + font-size: 4.5rem; + +} + +h3{ + display: flex; + border: 3px solid black; + justify-content: center; + background-color: black; +} + + +/* PROJECT GALLERY STYLING */ + +.projectgallery1{ + display: flex; + justify-content: space-evenly +} + +.projectgallery1 div{ + width: 30%; + height: 50vh; + border: 5px solid black; +} + +.projectgallery1text{ + display: flex; + justify-content: space-around; +} + + +.projectgallery2{ + display: flex; + justify-content: space-evenly +} + +.projectgallery2 div{ + width: 30%; + height: 50vh; + border: 5px solid black; +} + +.projectgallery2text{ + display: flex; + justify-content: space-around; +} + + +/* GALLERY IMAGE STYLING */ + +.first{ + background-image: url(https://images.unsplash.com/photo-1511497584788-876760111969?ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&ixlib=rb-1.2.1&auto=format&fit=crop&w=1489&q=80); + background-repeat: no-repeat; + background-position: center; +} + +.second{ + background-image: url(https://images.unsplash.com/photo-1476231682828-37e571bc172f?ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&ixlib=rb-1.2.1&auto=format&fit=crop&w=967&q=80); + background-repeat: no-repeat; + background-position: center; +} + +.third{ + background-image: url(https://images.unsplash.com/photo-1534269222346-5a896154c41d?ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&ixlib=rb-1.2.1&auto=format&fit=crop&w=1050&q=80); + background-repeat: no-repeat; + background-position: center; +} + +.fourth{ + background-image: url(https://images.unsplash.com/photo-1621848296279-7751546e9acc?ixlib=rb-1.2.1&ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&auto=format&fit=crop&w=1068&q=80); + background-repeat:no-repeat; + background-position: fixed; +} + +.fifth{ + background-image: url(https://images.unsplash.com/photo-1599220144359-d4b723bd476d?ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&ixlib=rb-1.2.1&auto=format&fit=crop&w=634&q=80); + background-repeat: no-repeat; + background-position: center; +} + +.sixth{ + background-image: url(https://images.unsplash.com/photo-1486162928267-e6274cb3106f?ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&ixlib=rb-1.2.1&auto=format&fit=crop&w=634&q=80); + background-repeat: no-repeat; + background-position: center; +} + +/* FOOTER STYLING */ + +footer{ + background-color: #bc6c25; + padding: 2%; +} + +footer div{ + display: flex; + justify-content: center; + background-color: #606c38; + margin-left:45%; + margin-right:45%; + padding: 1%; +} \ No newline at end of file