diff options
Diffstat (limited to 'common.css')
| -rw-r--r-- | common.css | 232 |
1 files changed, 232 insertions, 0 deletions
diff --git a/common.css b/common.css new file mode 100644 index 0000000..b222c2e --- /dev/null +++ b/common.css @@ -0,0 +1,232 @@ +body { + background-image: url(img/bg.png); + background-attachment: fixed; + background-position: center; + background-size: 100%; +} + +h1, h2, h3, h4, h5, h6 { + font-family: 'Mountains', Georgia, 'Times New Roman', Times, serif; + font-weight: bold; + color: rgb(228, 222, 210); +} + +p, li, summary, embed { + font-family: 'Nanum', Georgia, 'Times New Roman', Times, serif; + color: rgb(228, 222, 210); +} + +a { + color: #8F2037; + font-family: 'HennyPenny', Georgia, 'Times New Roman', Times, serif; +} + +a:hover { + filter: drop-shadow(0 0 5px #6b1020);; + font-style: italic; +} + +.logo { + text-align: center; + margin-top: 0px +} + +.logo a { + font-family: 'Mountains', Georgia, 'Times New Roman', Times, serif; + font-weight: bold; + color: rgb(228, 222, 210); +} + +.logo a:hover { + filter: none; +} + +.logo img { + width: 300px; + transition: 0.4s; + filter: drop-shadow(0 0 10px rgba(0,0,0,0.9)); +} + +.logo img:hover { + width: 500px; + filter: drop-shadow(0 0 10px rgba(255,255,255,0.9)); +} + +.shadow { + margin: auto; + background-color: rgba(0,0,0,0.6); + -webkit-box-shadow: 0 0 20px 20px rgba(0,0,0,0.6); + -moz-box-shadow: 0 0 20px 20px rgba(0,0,0,0.6); + box-shadow: 0 0 20px 20px rgba(0,0,0,0.6); + border-radius: 20px; + padding: 0px 30px 0px 30px; +} + +/* graphical pages */ + +.flex { + display: flex; + justify-content: center; + align-items: center; + max-height: 500px; + min-height: content; +} + +.flex a { + flex: 0 0 auto; + display: inline-block; + position: relative; + filter: none; + color: rgba(0,0,0,0); +} + +.flex a::after { + content: ""; + position: absolute; + background: rgba(0,0,0,0.6); + border-radius: 50%; + filter: blur(8px); + z-index: 0; +} + +.flex img { + display: block; + position: relative; + z-index: 1; +} + +.flex img:hover { + /*-webkit-box-shadow: 0px 20px 50px 0px rgba(255,255,255,0.9); + -moz-box-shadow: 0px 20px 50px 0px rgba(255,255,255,0.9); + box-shadow: 0px 20px 50px 0px rgba(255,255,255,0.9);*/ + filter: drop-shadow(0 0 10px rgba(255,255,255,0.9)); +} + +/* art */ + +.art-container { + display: inline-flex; + flex-wrap: wrap; + justify-content: center; + flex-grow: none; + align-items: center; + align-self: flex-start; + gap: 20px; +} + +@media (min-width: 900px) { + .art { + margin-left: 0%; + margin-right: 0%; + } + + .art-nav { + margin-left: 30%; + margin-right: 30%; + } + + .art-container { + flex-direction: row; + } + + .art-container img { + height: 300px; + width: auto; + + } +} + +@media (max-width: 400px) { + body { + margin-left: 15px; + margin-right: 15px; + font-size: 20px; + } + + .art-container { + flex-direction: column; + } + + .art-container img { + height: auto; + width: 80vw; + margin-left: 5vw; + margin-right: 5vw; + } +} + +/* fonts */ + +@font-face { + font-family: 'DynaPuff'; + src: url('fonts/DynaPuff.ttf') format('truetype'); + font-display: swap; +} + +@font-face { + font-family: 'HennyPenny'; + src: url('fonts/HennyPenny.ttf') format('truetype'); + font-display: swap; +} + +@font-face { + font-family: 'Mountains'; + src: url('fonts/MountainsofChristmas-Regular.ttf') format('truetype'); + font-display: swap; +} + +@font-face { + font-family: 'MountainsBold'; + src: url('fonts/MountainsofChristmas-Bold.ttf') format('truetype'); + font-display: swap; +} + +@font-face { + font-family: 'Nanum'; + src: url('fonts/NanumMyeongjo-Regular.ttf') format('truetype'); + font-display: swap; +} + +@font-face { + font-family: 'Nanum'; + src: url('fonts/NanumMyeongjo-Bold.ttf') format('truetype'); + font-display: swap; + font-weight: bold; +} + +@font-face { + font-family: 'NanumExtra'; + src: url('fonts/NanumMyeongjo-ExtraBold.ttf') format('truetype'); + font-display: swap; +} + +@font-face { + font-family: 'Schoolbell'; + src: url('fonts/Schoolbell.ttf') format('truetype'); + font-display: swap; +} + +@font-face { + font-family: 'SNPro'; + src: url('fonts/SNPro.ttf') format('truetype'); + font-display: swap; +} + +@font-face { + font-family: 'SNPro'; + src: url('fonts/SNPro-Italic.ttf') format('truetype'); + font-display: swap; + font-style: italic; +} + +@font-face { + font-family: 'Stylish'; + src: url('fonts/Stylish.ttf') format('truetype'); + font-display: swap; +} + +@font-face { + font-family: 'Cherry'; + src: url('fonts/CherryBombOne.ttf') format('truetype'); + font-display: swap; +}
\ No newline at end of file |