diff --git a/src/about.html b/src/about.html new file mode 100644 index 0000000..c0fdf48 --- /dev/null +++ b/src/about.html @@ -0,0 +1,16 @@ + + + + + + + HTML5 Boilerplate + + + + +

Page Title

+ + + + diff --git a/src/astolfo.webp b/src/astolfo.webp new file mode 100644 index 0000000..d3d3e18 Binary files /dev/null and b/src/astolfo.webp differ diff --git a/src/blog.html b/src/blog.html new file mode 100644 index 0000000..c0fdf48 --- /dev/null +++ b/src/blog.html @@ -0,0 +1,16 @@ + + + + + + + HTML5 Boilerplate + + + + +

Page Title

+ + + + diff --git a/src/bussyair.webp b/src/bussyair.webp new file mode 100644 index 0000000..f0f3aae Binary files /dev/null and b/src/bussyair.webp differ diff --git a/src/index.html b/src/index.html index 219abea..e01fc61 100644 --- a/src/index.html +++ b/src/index.html @@ -3,14 +3,15 @@ astolfo.org +
@@ -42,124 +43,4 @@ - - - + \ No newline at end of file diff --git a/src/pillow.webp b/src/pillow.webp new file mode 100644 index 0000000..99cb803 Binary files /dev/null and b/src/pillow.webp differ diff --git a/src/plush.webp b/src/plush.webp new file mode 100644 index 0000000..d4fb000 Binary files /dev/null and b/src/plush.webp differ diff --git a/src/services.html b/src/services.html new file mode 100644 index 0000000..c0fdf48 --- /dev/null +++ b/src/services.html @@ -0,0 +1,16 @@ + + + + + + + HTML5 Boilerplate + + + + +

Page Title

+ + + + diff --git a/src/sheets.webp b/src/sheets.webp new file mode 100644 index 0000000..418b632 Binary files /dev/null and b/src/sheets.webp differ diff --git a/src/store.html b/src/store.html new file mode 100644 index 0000000..817298f --- /dev/null +++ b/src/store.html @@ -0,0 +1,39 @@ + + + + + + + store.astolfo.org + + + + +

Astolfo Store

+

+ Astolfo +

+

Only the finest goods!

+ +
+
+ Bussy Air +
+
+ Body Pillow +
+
+ Plush +
+
+ Bed Sheets +
+
+

Bussy Air

+ + + + + \ No newline at end of file diff --git a/src/styles.css b/src/styles.css new file mode 100644 index 0000000..5723984 --- /dev/null +++ b/src/styles.css @@ -0,0 +1,140 @@ +:root { + --text: black; + --accent: #ff69b4; + --accent2: #FA7DBC; + --background: #fba0e3; + --rounding: 8em; +} + +body { + padding: 0px; + margin: auto; + height: 100vh; + + background-image: url("background.jpg"); + background-repeat: no-repeat; + background-position: center; + background-size: cover; + background-attachment: fixed; + + font-family: 'Trebuchet MS', sans-serif; +} + +header { + margin: 1em; + padding: 0.5em; + padding-left: 0.5em; + padding-right: 3em; + + border-radius: var(--rounding); + box-shadow: rgba(50, 50, 93, 0.25) 0px 50px 100px -20px, rgba(0, 0, 0, 0.3) 0px 30px 60px -30px, rgba(10, 37, 64, 0.35) 0px -2px 6px 0px inset; + background-color: var(--background); + + width: fit-content; +} + +header ul { + list-style-type: none; +} + +header li{ + display: inline; +} + +.header-links { + transition-duration: 0.3s; + padding: 0.3em; + display: inline-block; + border-radius: var(--rounding); + text-decoration: none; + color: var(--text); +} + +.header-links:hover { + background-color: var(--accent); + scale: 250%; + transform: translateY(-5px) rotate(-7deg); + margin-left: 2em; + margin-right: 2em; +} + +.center { + display: block; + margin-left: auto; + margin-right: auto; + width: 50%; +} + +/* Three image containers (use 25% for four, and 50% for two, etc) */ +.column { + float: left; + width: 25%; + padding: 5px; +} + +/* Clear floats after image containers */ +.row::after { + content: ""; + clear: both; + display: table; +} + +footer { + color: var(--text); + background-color: var(--background); + display: flex; + + margin: 0px; + padding: 30px; + border-top-right-radius: var(--rounding); + border-top-left-radius: var(--rounding); + box-shadow: rgba(50, 50, 93, 0.25) 0px 50px 100px -20px, rgba(0, 0, 0, 0.3) 0px 30px 60px -30px, rgba(10, 37, 64, 0.35) 0px -2px 6px 0px inset; +} + +footer * { + padding-left: 30px; +} + +#landing-inner { + border-radius: var(--rounding); + background-color: var(--background); + width: 80vw; + margin: auto; + box-shadow: rgba(0, 0, 0, 0.06) 0px 2px 4px 0px inset; +} + +#float-header { + text-align: center; + font-size: 12vw; + align-content: center; +} + +#float-header span { + display: inline-block; + animation: float 3s ease-in-out infinite; + + color: var(--accent2); + -webkit-text-stroke: 0.01em var(--text); + + padding: 0px; + margin-left: -0.2em; +} + +@keyframes float { + 0%, 100% { + transform: translateY(0px); + } + 50% { + transform: translateY(-10px); + } +} + +@media (max-width: 1000px) { + footer { + flex-direction: column; + } + + footer marquee { + width: auto !important; + } +} \ No newline at end of file