diff --git a/.DS_Store b/.DS_Store new file mode 100644 index 0000000..a1db50f Binary files /dev/null and b/.DS_Store differ diff --git a/Imgs/.DS_Store b/Imgs/.DS_Store new file mode 100644 index 0000000..1f2fb87 Binary files /dev/null and b/Imgs/.DS_Store differ diff --git a/Imgs/cssgarden.png b/Imgs/cssgarden.png new file mode 100644 index 0000000..46f2f86 Binary files /dev/null and b/Imgs/cssgarden.png differ diff --git a/Imgs/gardencss.jpg b/Imgs/gardencss.jpg new file mode 100644 index 0000000..b4e60df Binary files /dev/null and b/Imgs/gardencss.jpg differ diff --git a/index.html b/index.html index 3a88ff2..b546347 100644 --- a/index.html +++ b/index.html @@ -5,8 +5,8 @@ Viking CSS Garden - - + + @@ -40,14 +40,22 @@

Norse mythology

Norse mythology has been the subject of scholarly discourse since the 17th century, when key texts were brought to the attention of the intellectual circles of Europe. By way of comparative mythology and historical linguistics, scholars have identified elements of Germanic mythology reaching as far back as Proto-Indo-European mythology. In the modern period, the Romanticist Viking revival re-awoke an interest in the subject matter, and references to Norse mythology may now be found throughout modern popular culture. The myths have further been revived in a religious context among adherents of Germanic Neopaganism.

- - From Norse Mythology +
+
+ + - From Norse Mythology + +
+
+
- +
+
+ + - diff --git a/style.css b/style.css index 64192bc..a993cbb 100644 --- a/style.css +++ b/style.css @@ -1,10 +1,132 @@ -/* ----------------------------------- * - * Your Styles Here - * ----------------------------------- */ +body { + background-color: rgb(255, 255, 255); + font-family: 'Encode Sans', sans-serif; +} +#main-header { + width: 100%; + background-image: url("Imgs/cssgarden.png"); + background-position: center; + height: 160px; +} +.site-title { + font-size: 60px; + text-align: center; + color: rgb(243, 248, 254); + text-transform: uppercase; + padding-top: 20px; + padding-bottom: 5px + border-bottom: none; +} +.img-responsive { + max-width: 100%; +} +.tagline { + font-style: italic; + position: relative; + bottom: 40px; + font-size: 20px; + font-weight: 100; + text-align: center; + color: rgb(243, 248, 254); +} - \ No newline at end of file +#main-content { + width: 60%; + float: left; + padding-left: 5%; +} + +#sidebar { + width: 22% 0%; + float: right; + padding-right: 8%; + background-color: #557292; + padding-right: 40px; +} + +.section-title, h2 { + color: #325050; + font-weight: 100; + font-family: sans-serif; + font-size: 26px +} + +.section-content, p { + font-size: 13px; + font-weight: 200; + line-height: 26px; + color: #325050; +} + + +li { + list-style: none; + border: 20px solid #557292; +} + +.section-title-sidebar { + padding-left: 50px; + color: White; +} + +a.nav-link:link, a.nav-link:visited { + width: 120px; + height: auto; + background-color: #fff; + color: #557292; + padding: 14px 25px; + text-align: center; + text-decoration: none; + display: inline-block; +} + +a.nav-link:hover, a.nav-link:active { + background-color: #557292; + border: 1px solid white; + color: White; +} + +a:link { + text-decoration: none; + color: Black; +} + +a:visited { + text-decoration: none; + color: Black; +} + +a:hover { + color: #557292; +} + +a:active { + color: #557292; +} + +.citation { + font-weight: 100; + font-family: sans-serif; +} + +#footer { + position: relative; + margin-top: -100px; + height: 100px; + clear: both; + background-color: #557292; +} + +.footer-content { + color: white; + text-align: center; + font-size: 24px; + font-weight: 100; + font-family: monospace; + padding-top: 30px; +}