Updated 26 files via CloudCannon

This commit is contained in:
CloudCannon 2020-09-18 10:06:10 +00:00
parent 61db0f8387
commit e86445f31b
26 changed files with 276 additions and 636 deletions

View file

@ -63,42 +63,22 @@
<div id="main-wrapper">
<header class="hero" style="background-image: url(/images/posts/333mix.jpg);">
<div class="textcontainer">
<h1>333mix</h1>
<p>Pignu got Chopped & Screwed by KodTreatment</p>
<p><a href="#read" class="button">Read</a></p>
<header class="hero" id="top"
style="background-image: url(/images/posts/333mix.jpg);">
</div>
<div class="imagecontainer">
<h4>333mix</h4>
</div>
<section class="splash">
<div class="container">
<div class="splash-logo">
<img src="/images/setto-logo.svg" width="240px" alt="徒 setto セット Logo" />
</div>
<div class="description" style="padding: 0;">
<h1>333mix</h1>
<p>Pignu got Chopped & Screwed by KodTreatment</p>
</div>
</div>
</section>
</header>
<section class="info" id="read">
<div class="info-pages">
@ -128,7 +108,7 @@
<div class="container">
<div class="post-nav">
<h4><a href="../unmet-dependencies/" alt="Read Unmet Dependencies" title="Read Unmet Dependencies"><span class="fas fa-arrow-left" style="font-size:3em;text-decoration: none;"></span></a></h4>
<h4><a href="/unmet-dependencies/" alt="Read Unmet Dependencies" title="Read Unmet Dependencies"><span class="fas fa-arrow-left" style="font-size:3em;text-decoration: none;"></span></a></h4>
<h3>Unmet Dependencies</h3>
<p>Proprietary tools, consultancies, remote labor... The reality in the digital industry is as hard to cope with as it is building software in Haskell. Freedom is luxury, but also a burden.

View file

@ -135,41 +135,21 @@
<div id="main-wrapper">
<header class="hero" style="background-image: url(/images/pages/creds.jpg);">
<div class="textcontainer">
<h1>Error 404 This is not a page</h1>
<p>The page you are looking for has moved to the darknet.</p>
<p><a href="/" class="button">Take me home</a></p>
<header class="hero" id="top"
style="background-image: url(/images/pages/creds.jpg);">
</div>
<div class="imagecontainer">
<h4>Error 404 This is not a page</h4>
</div>
<section class="splash">
<div class="container">
<div class="splash-logo">
<img src="/images/setto-logo.svg" width="240px" alt="徒 setto セット Logo" />
</div>
<div class="description" style="padding: 0;">
<h1>Error 404 This is not a page</h1>
<p>The page you are looking for has moved to the darknet.</p>
</div>
</div>
</section>
</header>
<!-- Footer -->

View file

@ -1,5 +1,5 @@
{
"time": "2020-09-18T09:15:53+00:00",
"time": "2020-09-18T10:06:07+00:00",
"cloudcannon": {
"name": "cloudcannon-jekyll",
"version": "1.4.0"

View file

@ -139,41 +139,19 @@
<header class="hero" style="background-image: url(/images/pages/creds.jpg);">
<div class="textcontainer">
<h1>About</h1>
<p>WTF is 徒 setto セット and what does the funky characters mean? Why so cryptic and whodafuq?</p>
<header class="hero" id="top"
style="background-image: url(/images/pages/creds.jpg);">
</div>
<div class="imagecontainer">
<h4>About</h4>
</div>
<section class="splash">
<div class="container">
<div class="splash-logo">
<img src="/images/setto-logo.svg" width="240px" alt="徒 setto セット Logo" />
</div>
<div class="description" style="padding: 0;">
<h1>About</h1>
<p>WTF is 徒 setto セット and what does the funky characters mean? Why so cryptic and whodafuq?</p>
</div>
</div>
</section>
</header>
<section class="info" id="read">
<div class="info-pages" data-cms-content-wrapper="/_layouts/page.html">
<h2 id="set-party-gang">Set, Party, Gang</h2>

View file

@ -53,20 +53,38 @@ body { height: 100vh; width: 100%; font-family: "Poppins", "Arial", "Helvetica",
.wrapper { margin: 20px 40px; }
.hero { display: flex; flex-wrap: wrap; flex-direction: row; align-content: center; background-color: transparent; justify-content: center; background-size: cover; background-position: center; background-repeat: no-repeat; padding: 40px; position: relative; min-height: 80vh; width: 100vw; }
.hero { display: flex; flex-wrap: wrap; flex-direction: row; align-content: center; background-color: transparent; justify-content: center; background-size: cover; background-position: center; background-repeat: no-repeat; padding: 0; position: relative; min-height: 100vh; width: 100vw; }
.hero .textcontainer { background-color: var(--bg-alt); border-radius: var(--border-radius); max-width: 700px; padding: 20px 20px 40px 20px; }
.hero .textcontainer { background: #020024; background: linear-gradient(90deg, transparent 0%, var(--bg) 91%); border-radius: var(--border-radius); max-width: var(--max-width); padding: 0px 40px 40px 40px; }
.hero div { z-index: 10; }
.hero div h1, .hero div p { flex: 1 0 100%; width: 100%; z-index: 10; color: var(--fg); max-width: var(--max-width); margin-top: 40px; }
.hero div h1, .hero div p { flex: 1 0 100%; z-index: 10; color: var(--fg); max-width: var(--max-width); margin-top: 40px; }
.hero div h1 { font-size: 1.8em; }
.hero .imagecontainer { position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-image: url("../img/vignette.svg"); background-size: 240px; background-repeat: repeat-x; background-position: bottom; z-index: 1; }
.hero .imagecontainer { position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-image: url("../img/vignette.svg"); background-size: 960px; background-repeat: repeat-x; background-position: bottom; z-index: 1; }
.hero .imagecontainer h4 { width: 90vw; /* height: auto; */ /* min-height: 100px; */ line-height: 1.011em; letter-spacing: -0em; color: var(--bg); font-size: 15vw; display: inline; opacity: 1; border-radius: var(--border-radius); position: absolute; bottom: 0; transform: rotate(-3deg); overflow: hidden; background: -webkit-linear-gradient(90deg, var(--bg) 0%, var(--bg-alt) 100%); -webkit-background-clip: text; -webkit-text-fill-color: transparent; filter: blur(1px); }
.hero .splash { background-color: transparent; display: flex; flex-wrap: wrap; padding: 40px; align-items: flex-start; max-width: var(--max-width); margin: auto; }
.hero .splash .description { border-radius: var(--border-radius); background: var(--bg-alt); background: linear-gradient(90deg, transparent 0%, var(--bg) 91%); }
.hero .splash .description > * { margin: 40px !important; }
.hero .splash h1, .hero .splash h2 { font-size: 2em; }
.hero .splash p, .hero .splash h1, .hero .splash h2, .hero .splash h3, .hero .splash h4 { text-align: left; margin-top: 20px; }
.hero .splash h1:first-child { margin-top: 0; }
.hero .splash div { max-width: unset; margin: 0; flex: 1 1 300px; }
.hero .splash .splash-logo { padding: 0; margin: 0; }
@media only screen and (max-width: 759px) { .hero .splash div { min-width: 100%; padding: 20px 0; } .hero .splash .splash-logo { padding: 20px 0; } }
section { flex: 1 1 100%; background-color: var(--bg); z-index: 2; }
section .container { max-width: var(--max-width); margin: 0 auto; }
@ -77,7 +95,7 @@ section:first-of-type { -webkit-box-shadow: none; -moz-box-shadow: none; box-sha
.section-title { padding: 80px; }
footer { width: 100%; padding: 160px 20px 200px 20px; background-color: var(--fg); color: var(--bg); background-image: url("../img/vignette-footer.svg"); background-size: 400px; background-repeat: repeat-x; background-position: top; box-sizing: border-box; z-index: 2; }
footer { width: 100%; padding: 160px 20px 200px 20px; background-color: var(--fg); color: var(--bg); background-image: url("../img/vignette-footer.svg"); background-size: 200px; background-repeat: repeat-x; background-position: top; box-sizing: border-box; z-index: 2; }
footer a { color: var(--bg); }
@ -260,26 +278,6 @@ a:hover { color: var(--accent1); text-decoration-style: wavy; text-decoration-co
@media only screen and (max-width: 1000px) { .front-section:nth-child(even) .container { margin: 0 20px 0 20px; } }
.front-section:nth-of-type(2) { margin-top: 40px; }
.splash { background-color: transparent; }
.splash .container { display: flex; flex-wrap: wrap; padding: 40px; align-items: flex-start; max-width: var(--max-width); margin: auto; }
.splash .container .description { border-radius: var(--border-radius); background: var(--bg-alt); background: linear-gradient(90deg, transparent 0%, var(--bg) 91%); }
.splash .container h1, .splash .container h2 { font-size: 2em; }
.splash .container p, .splash .container h1, .splash .container h2, .splash .container h3, .splash .container h4 { text-align: left; margin-top: 20px; }
.splash .container h1:first-child { margin-top: 0; }
.splash .container div { max-width: unset; margin: 0; flex: 1 1 300px; padding: 0 0 0 80px; }
.splash .container .splash-logo { padding: 0; margin: 0; }
@media only screen and (max-width: 759px) { .splash .container div { min-width: 100%; padding: 20px 0; } .splash .container .splash-logo { padding: 20px 0; } }
#contact { padding: 20px; }
#contact > div { max-width: var(--max-width); margin: auto; padding: 40px 20px; }
@ -356,7 +354,7 @@ nav li .button { display: block; }
/* Audio Player Styles
================================================== */
/* Default / Desktop / Firefox */
.album-player { display: flex; flex-wrap: wrap; padding: 0 40px; justify-content: space-evenly; flex-direction: row-reverse; align-items: center; max-width: var(--max-width); margin: auto; }
.album-player { display: flex; flex-wrap: wrap; padding: 80px 40px 0 40px; justify-content: space-evenly; flex-direction: row-reverse; align-items: center; max-width: var(--max-width); margin: auto; }
.album-player > div { margin: 20px 0; }

File diff suppressed because one or more lines are too long

View file

@ -85,20 +85,38 @@ body { height: 100vh; width: 100%; font-family: "Poppins", "Arial", "Helvetica",
.wrapper { margin: 20px 40px; }
.hero { display: flex; flex-wrap: wrap; flex-direction: row; align-content: center; background-color: transparent; justify-content: center; background-size: cover; background-position: center; background-repeat: no-repeat; padding: 40px; position: relative; min-height: 80vh; width: 100vw; }
.hero { display: flex; flex-wrap: wrap; flex-direction: row; align-content: center; background-color: transparent; justify-content: center; background-size: cover; background-position: center; background-repeat: no-repeat; padding: 0; position: relative; min-height: 100vh; width: 100vw; }
.hero .textcontainer { background-color: var(--bg-alt); border-radius: var(--border-radius); max-width: 700px; padding: 20px 20px 40px 20px; }
.hero .textcontainer { background: #020024; background: linear-gradient(90deg, transparent 0%, var(--bg) 91%); border-radius: var(--border-radius); max-width: var(--max-width); padding: 0px 40px 40px 40px; }
.hero div { z-index: 10; }
.hero div h1, .hero div p { flex: 1 0 100%; width: 100%; z-index: 10; color: var(--fg); max-width: var(--max-width); margin-top: 40px; }
.hero div h1, .hero div p { flex: 1 0 100%; z-index: 10; color: var(--fg); max-width: var(--max-width); margin-top: 40px; }
.hero div h1 { font-size: 1.8em; }
.hero .imagecontainer { position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-image: url("../img/vignette.svg"); background-size: 240px; background-repeat: repeat-x; background-position: bottom; z-index: 1; }
.hero .imagecontainer { position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-image: url("../img/vignette.svg"); background-size: 960px; background-repeat: repeat-x; background-position: bottom; z-index: 1; }
.hero .imagecontainer h4 { width: 90vw; /* height: auto; */ /* min-height: 100px; */ line-height: 1.011em; letter-spacing: -0em; color: var(--bg); font-size: 15vw; display: inline; opacity: 1; border-radius: var(--border-radius); position: absolute; bottom: 0; transform: rotate(-3deg); overflow: hidden; background: -webkit-linear-gradient(90deg, var(--bg) 0%, var(--bg-alt) 100%); -webkit-background-clip: text; -webkit-text-fill-color: transparent; filter: blur(1px); }
.hero .splash { background-color: transparent; display: flex; flex-wrap: wrap; padding: 40px; align-items: flex-start; max-width: var(--max-width); margin: auto; }
.hero .splash .description { border-radius: var(--border-radius); background: var(--bg-alt); background: linear-gradient(90deg, transparent 0%, var(--bg) 91%); }
.hero .splash .description > * { margin: 40px !important; }
.hero .splash h1, .hero .splash h2 { font-size: 2em; }
.hero .splash p, .hero .splash h1, .hero .splash h2, .hero .splash h3, .hero .splash h4 { text-align: left; margin-top: 20px; }
.hero .splash h1:first-child { margin-top: 0; }
.hero .splash div { max-width: unset; margin: 0; flex: 1 1 300px; }
.hero .splash .splash-logo { padding: 0; margin: 0; }
@media only screen and (max-width: 759px) { .hero .splash div { min-width: 100%; padding: 20px 0; } .hero .splash .splash-logo { padding: 20px 0; } }
section { flex: 1 1 100%; background-color: var(--bg); z-index: 2; }
section .container { max-width: var(--max-width); margin: 0 auto; }
@ -109,7 +127,7 @@ section:first-of-type { -webkit-box-shadow: none; -moz-box-shadow: none; box-sha
.section-title { padding: 80px; }
footer { width: 100%; padding: 160px 20px 200px 20px; background-color: var(--fg); color: var(--bg); background-image: url("../img/vignette-footer.svg"); background-size: 400px; background-repeat: repeat-x; background-position: top; box-sizing: border-box; z-index: 2; }
footer { width: 100%; padding: 160px 20px 200px 20px; background-color: var(--fg); color: var(--bg); background-image: url("../img/vignette-footer.svg"); background-size: 200px; background-repeat: repeat-x; background-position: top; box-sizing: border-box; z-index: 2; }
footer a { color: var(--bg); }
@ -259,26 +277,6 @@ a:hover { color: var(--accent1); text-decoration-style: wavy; text-decoration-co
@media only screen and (max-width: 1000px) { .front-section:nth-child(even) .container { margin: 0 20px 0 20px; } }
.front-section:nth-of-type(2) { margin-top: 40px; }
.splash { background-color: transparent; }
.splash .container { display: flex; flex-wrap: wrap; padding: 40px; align-items: flex-start; max-width: var(--max-width); margin: auto; }
.splash .container .description { border-radius: var(--border-radius); background: var(--bg-alt); background: linear-gradient(90deg, transparent 0%, var(--bg) 91%); }
.splash .container h1, .splash .container h2 { font-size: 2em; }
.splash .container p, .splash .container h1, .splash .container h2, .splash .container h3, .splash .container h4 { text-align: left; margin-top: 20px; }
.splash .container h1:first-child { margin-top: 0; }
.splash .container div { max-width: unset; margin: 0; flex: 1 1 300px; padding: 0 0 0 80px; }
.splash .container .splash-logo { padding: 0; margin: 0; }
@media only screen and (max-width: 759px) { .splash .container div { min-width: 100%; padding: 20px 0; } .splash .container .splash-logo { padding: 20px 0; } }
#contact { padding: 20px; }
#contact > div { max-width: var(--max-width); margin: auto; padding: 40px 20px; }
@ -365,7 +363,7 @@ nav li .button { display: block; }
/* Audio Player Styles
================================================== */
/* Default / Desktop / Firefox */
.album-player { display: flex; flex-wrap: wrap; padding: 0 40px; justify-content: space-evenly; flex-direction: row-reverse; align-items: center; max-width: var(--max-width); margin: auto; }
.album-player { display: flex; flex-wrap: wrap; padding: 80px 40px 0 40px; justify-content: space-evenly; flex-direction: row-reverse; align-items: center; max-width: var(--max-width); margin: auto; }
.album-player > div { margin: 20px 0; }

File diff suppressed because one or more lines are too long

View file

@ -85,20 +85,38 @@ body { height: 100vh; width: 100%; font-family: "Poppins", "Arial", "Helvetica",
.wrapper { margin: 20px 40px; }
.hero { display: flex; flex-wrap: wrap; flex-direction: row; align-content: center; background-color: transparent; justify-content: center; background-size: cover; background-position: center; background-repeat: no-repeat; padding: 40px; position: relative; min-height: 80vh; width: 100vw; }
.hero { display: flex; flex-wrap: wrap; flex-direction: row; align-content: center; background-color: transparent; justify-content: center; background-size: cover; background-position: center; background-repeat: no-repeat; padding: 0; position: relative; min-height: 100vh; width: 100vw; }
.hero .textcontainer { background-color: var(--bg-alt); border-radius: var(--border-radius); max-width: 700px; padding: 20px 20px 40px 20px; }
.hero .textcontainer { background: #020024; background: linear-gradient(90deg, transparent 0%, var(--bg) 91%); border-radius: var(--border-radius); max-width: var(--max-width); padding: 0px 40px 40px 40px; }
.hero div { z-index: 10; }
.hero div h1, .hero div p { flex: 1 0 100%; width: 100%; z-index: 10; color: var(--fg); max-width: var(--max-width); margin-top: 40px; }
.hero div h1, .hero div p { flex: 1 0 100%; z-index: 10; color: var(--fg); max-width: var(--max-width); margin-top: 40px; }
.hero div h1 { font-size: 1.8em; }
.hero .imagecontainer { position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-image: url("../img/vignette.svg"); background-size: 240px; background-repeat: repeat-x; background-position: bottom; z-index: 1; }
.hero .imagecontainer { position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-image: url("../img/vignette.svg"); background-size: 960px; background-repeat: repeat-x; background-position: bottom; z-index: 1; }
.hero .imagecontainer h4 { width: 90vw; /* height: auto; */ /* min-height: 100px; */ line-height: 1.011em; letter-spacing: -0em; color: var(--bg); font-size: 15vw; display: inline; opacity: 1; border-radius: var(--border-radius); position: absolute; bottom: 0; transform: rotate(-3deg); overflow: hidden; background: -webkit-linear-gradient(90deg, var(--bg) 0%, var(--bg-alt) 100%); -webkit-background-clip: text; -webkit-text-fill-color: transparent; filter: blur(1px); }
.hero .splash { background-color: transparent; display: flex; flex-wrap: wrap; padding: 40px; align-items: flex-start; max-width: var(--max-width); margin: auto; }
.hero .splash .description { border-radius: var(--border-radius); background: var(--bg-alt); background: linear-gradient(90deg, transparent 0%, var(--bg) 91%); }
.hero .splash .description > * { margin: 40px !important; }
.hero .splash h1, .hero .splash h2 { font-size: 2em; }
.hero .splash p, .hero .splash h1, .hero .splash h2, .hero .splash h3, .hero .splash h4 { text-align: left; margin-top: 20px; }
.hero .splash h1:first-child { margin-top: 0; }
.hero .splash div { max-width: unset; margin: 0; flex: 1 1 300px; }
.hero .splash .splash-logo { padding: 0; margin: 0; }
@media only screen and (max-width: 759px) { .hero .splash div { min-width: 100%; padding: 20px 0; } .hero .splash .splash-logo { padding: 20px 0; } }
section { flex: 1 1 100%; background-color: var(--bg); z-index: 2; }
section .container { max-width: var(--max-width); margin: 0 auto; }
@ -109,7 +127,7 @@ section:first-of-type { -webkit-box-shadow: none; -moz-box-shadow: none; box-sha
.section-title { padding: 80px; }
footer { width: 100%; padding: 160px 20px 200px 20px; background-color: var(--fg); color: var(--bg); background-image: url("../img/vignette-footer.svg"); background-size: 400px; background-repeat: repeat-x; background-position: top; box-sizing: border-box; z-index: 2; }
footer { width: 100%; padding: 160px 20px 200px 20px; background-color: var(--fg); color: var(--bg); background-image: url("../img/vignette-footer.svg"); background-size: 200px; background-repeat: repeat-x; background-position: top; box-sizing: border-box; z-index: 2; }
footer a { color: var(--bg); }
@ -259,26 +277,6 @@ a:hover { color: var(--accent1); text-decoration-style: wavy; text-decoration-co
@media only screen and (max-width: 1000px) { .front-section:nth-child(even) .container { margin: 0 20px 0 20px; } }
.front-section:nth-of-type(2) { margin-top: 40px; }
.splash { background-color: transparent; }
.splash .container { display: flex; flex-wrap: wrap; padding: 40px; align-items: flex-start; max-width: var(--max-width); margin: auto; }
.splash .container .description { border-radius: var(--border-radius); background: var(--bg-alt); background: linear-gradient(90deg, transparent 0%, var(--bg) 91%); }
.splash .container h1, .splash .container h2 { font-size: 2em; }
.splash .container p, .splash .container h1, .splash .container h2, .splash .container h3, .splash .container h4 { text-align: left; margin-top: 20px; }
.splash .container h1:first-child { margin-top: 0; }
.splash .container div { max-width: unset; margin: 0; flex: 1 1 300px; padding: 0 0 0 80px; }
.splash .container .splash-logo { padding: 0; margin: 0; }
@media only screen and (max-width: 759px) { .splash .container div { min-width: 100%; padding: 20px 0; } .splash .container .splash-logo { padding: 20px 0; } }
#contact { padding: 20px; }
#contact > div { max-width: var(--max-width); margin: auto; padding: 40px 20px; }
@ -355,7 +353,7 @@ nav li .button { display: block; }
/* Audio Player Styles
================================================== */
/* Default / Desktop / Firefox */
.album-player { display: flex; flex-wrap: wrap; padding: 0 40px; justify-content: space-evenly; flex-direction: row-reverse; align-items: center; max-width: var(--max-width); margin: auto; }
.album-player { display: flex; flex-wrap: wrap; padding: 80px 40px 0 40px; justify-content: space-evenly; flex-direction: row-reverse; align-items: center; max-width: var(--max-width); margin: auto; }
.album-player > div { margin: 20px 0; }

File diff suppressed because one or more lines are too long

View file

@ -85,20 +85,38 @@ body { height: 100vh; width: 100%; font-family: "Poppins", "Arial", "Helvetica",
.wrapper { margin: 20px 40px; }
.hero { display: flex; flex-wrap: wrap; flex-direction: row; align-content: center; background-color: transparent; justify-content: center; background-size: cover; background-position: center; background-repeat: no-repeat; padding: 40px; position: relative; min-height: 80vh; width: 100vw; }
.hero { display: flex; flex-wrap: wrap; flex-direction: row; align-content: center; background-color: transparent; justify-content: center; background-size: cover; background-position: center; background-repeat: no-repeat; padding: 0; position: relative; min-height: 100vh; width: 100vw; }
.hero .textcontainer { background-color: var(--bg-alt); border-radius: var(--border-radius); max-width: 700px; padding: 20px 20px 40px 20px; }
.hero .textcontainer { background: #020024; background: linear-gradient(90deg, transparent 0%, var(--bg) 91%); border-radius: var(--border-radius); max-width: var(--max-width); padding: 0px 40px 40px 40px; }
.hero div { z-index: 10; }
.hero div h1, .hero div p { flex: 1 0 100%; width: 100%; z-index: 10; color: var(--fg); max-width: var(--max-width); margin-top: 40px; }
.hero div h1, .hero div p { flex: 1 0 100%; z-index: 10; color: var(--fg); max-width: var(--max-width); margin-top: 40px; }
.hero div h1 { font-size: 1.8em; }
.hero .imagecontainer { position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-image: url("../img/vignette.svg"); background-size: 240px; background-repeat: repeat-x; background-position: bottom; z-index: 1; }
.hero .imagecontainer { position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-image: url("../img/vignette.svg"); background-size: 960px; background-repeat: repeat-x; background-position: bottom; z-index: 1; }
.hero .imagecontainer h4 { width: 90vw; /* height: auto; */ /* min-height: 100px; */ line-height: 1.011em; letter-spacing: -0em; color: var(--bg); font-size: 15vw; display: inline; opacity: 1; border-radius: var(--border-radius); position: absolute; bottom: 0; transform: rotate(-3deg); overflow: hidden; background: -webkit-linear-gradient(90deg, var(--bg) 0%, var(--bg-alt) 100%); -webkit-background-clip: text; -webkit-text-fill-color: transparent; filter: blur(1px); }
.hero .splash { background-color: transparent; display: flex; flex-wrap: wrap; padding: 40px; align-items: flex-start; max-width: var(--max-width); margin: auto; }
.hero .splash .description { border-radius: var(--border-radius); background: var(--bg-alt); background: linear-gradient(90deg, transparent 0%, var(--bg) 91%); }
.hero .splash .description > * { margin: 40px !important; }
.hero .splash h1, .hero .splash h2 { font-size: 2em; }
.hero .splash p, .hero .splash h1, .hero .splash h2, .hero .splash h3, .hero .splash h4 { text-align: left; margin-top: 20px; }
.hero .splash h1:first-child { margin-top: 0; }
.hero .splash div { max-width: unset; margin: 0; flex: 1 1 300px; }
.hero .splash .splash-logo { padding: 0; margin: 0; }
@media only screen and (max-width: 759px) { .hero .splash div { min-width: 100%; padding: 20px 0; } .hero .splash .splash-logo { padding: 20px 0; } }
section { flex: 1 1 100%; background-color: var(--bg); z-index: 2; }
section .container { max-width: var(--max-width); margin: 0 auto; }
@ -109,7 +127,7 @@ section:first-of-type { -webkit-box-shadow: none; -moz-box-shadow: none; box-sha
.section-title { padding: 80px; }
footer { width: 100%; padding: 160px 20px 200px 20px; background-color: var(--fg); color: var(--bg); background-image: url("../img/vignette-footer.svg"); background-size: 400px; background-repeat: repeat-x; background-position: top; box-sizing: border-box; z-index: 2; }
footer { width: 100%; padding: 160px 20px 200px 20px; background-color: var(--fg); color: var(--bg); background-image: url("../img/vignette-footer.svg"); background-size: 200px; background-repeat: repeat-x; background-position: top; box-sizing: border-box; z-index: 2; }
footer a { color: var(--bg); }
@ -259,26 +277,6 @@ a:hover { color: var(--accent1); text-decoration-style: wavy; text-decoration-co
@media only screen and (max-width: 1000px) { .front-section:nth-child(even) .container { margin: 0 20px 0 20px; } }
.front-section:nth-of-type(2) { margin-top: 40px; }
.splash { background-color: transparent; }
.splash .container { display: flex; flex-wrap: wrap; padding: 40px; align-items: flex-start; max-width: var(--max-width); margin: auto; }
.splash .container .description { border-radius: var(--border-radius); background: var(--bg-alt); background: linear-gradient(90deg, transparent 0%, var(--bg) 91%); }
.splash .container h1, .splash .container h2 { font-size: 2em; }
.splash .container p, .splash .container h1, .splash .container h2, .splash .container h3, .splash .container h4 { text-align: left; margin-top: 20px; }
.splash .container h1:first-child { margin-top: 0; }
.splash .container div { max-width: unset; margin: 0; flex: 1 1 300px; padding: 0 0 0 80px; }
.splash .container .splash-logo { padding: 0; margin: 0; }
@media only screen and (max-width: 759px) { .splash .container div { min-width: 100%; padding: 20px 0; } .splash .container .splash-logo { padding: 20px 0; } }
#contact { padding: 20px; }
#contact > div { max-width: var(--max-width); margin: auto; padding: 40px 20px; }
@ -365,7 +363,7 @@ nav li .button { display: block; }
/* Audio Player Styles
================================================== */
/* Default / Desktop / Firefox */
.album-player { display: flex; flex-wrap: wrap; padding: 0 40px; justify-content: space-evenly; flex-direction: row-reverse; align-items: center; max-width: var(--max-width); margin: auto; }
.album-player { display: flex; flex-wrap: wrap; padding: 80px 40px 0 40px; justify-content: space-evenly; flex-direction: row-reverse; align-items: center; max-width: var(--max-width); margin: auto; }
.album-player > div { margin: 20px 0; }

File diff suppressed because one or more lines are too long

View file

@ -139,41 +139,19 @@
<header class="hero" style="background-image: url(/images/pages/arget-zvhhkivur9m-unsplash.jpg);">
<div class="textcontainer">
<h1>Cookies & Privacy policy</h1>
<p>Privacy is important, therefor 徒 setto セット respects it!</p>
<header class="hero" id="top"
style="background-image: url(/images/pages/arget-zvhhkivur9m-unsplash.jpg);">
</div>
<div class="imagecontainer">
<h4>Cookies & Privacy policy</h4>
</div>
<section class="splash">
<div class="container">
<div class="splash-logo">
<img src="/images/setto-logo.svg" width="240px" alt="徒 setto セット Logo" />
</div>
<div class="description" style="padding: 0;">
<h1>Cookies & Privacy policy</h1>
<p>Privacy is important, therefor 徒 setto セット respects it!</p>
</div>
</div>
</section>
</header>
<section class="info" id="read">
<div class="info-pages" data-cms-content-wrapper="/_layouts/page.html">
<p>To improve our marketing efforts, we at Basspistol sometimes place small data files called cookies on your device. However this site will work perfectly without them. We do however use anonymised analytics of the site-usage regardless of cookies (see bellow if you want to opt out of this too) This usage-data contain no identifiable information.</p>

View file

@ -125,59 +125,23 @@
<script src="/assets/js/jquery-3.5.1.min.js"></script>
<header class="hero" style="background-image: url(/images/posts/1-grandma-got-the-ssh-keys.jpeg);">
<div class="textcontainer">
<h1>Granny is a cyborg now</h1>
<p>Jazzy Cybersoul with a hint of 303 baselines.</p>
<p><a href="#play" class="button">Listen</a></p>
<header class="hero" id="top"
style="background-image: url(/images/posts/1-grandma-got-the-ssh-keys.jpeg);">
</div>
<div class="imagecontainer">
<h4>Granny is a cyborg now</h4>
</div>
<section class="splash">
<div class="container">
<div class="splash-logo">
<img src="/images/setto-logo.svg" width="240px" alt="徒 setto セット Logo" />
</div>
<div class="description" style="padding: 0;">
<h1>Granny is a cyborg now</h1>
<h4>by <strong>徒 Setto セット</strong></h4>
<p>Jazzy Cybersoul with a hint of 303 baselines.</p>
</div>
</div>
</section>
</header>
<section>
<section id="play">
<div class="album-player">
<!-- HERE BEGINS MADNESS -->
@ -352,7 +316,7 @@
<div class="container">
<div class="post-nav">
<h4><a href="../darkweb/" alt="Read Darkweb" title="Read Darkweb"><span class="fas fa-arrow-left" style="font-size:3em;text-decoration: none;"></span></a></h4>
<h4><a href="/darkweb/" alt="Read Darkweb" title="Read Darkweb"><span class="fas fa-arrow-left" style="font-size:3em;text-decoration: none;"></span></a></h4>
<h3>Darkweb</h3>
<p>As dystopian as the present might seem on-line, there is always room for the strange in the cypher...</p>

View file

@ -125,59 +125,23 @@
<script src="/assets/js/jquery-3.5.1.min.js"></script>
<header class="hero" style="background-image: url(/images/darkweb.jpg);">
<div class="textcontainer">
<h1>Darkweb</h1>
<p>As dystopian as the present might seem on-line, there is always room for the strange in the cypher...</p>
<p><a href="#play" class="button">Listen</a></p>
<header class="hero" id="top"
style="">
</div>
<div class="imagecontainer">
<h4>Darkweb</h4>
</div>
<section class="splash">
<div class="container">
<div class="splash-logo">
<img src="/images/setto-logo.svg" width="240px" alt="徒 setto セット Logo" />
</div>
<div class="description" style="padding: 0;">
<h1>Darkweb</h1>
<h4>by <strong>徒 Setto セット</strong></h4>
<p>As dystopian as the present might seem on-line, there is always room for the strange in the cypher...</p>
</div>
</div>
</section>
</header>
<section>
<section id="play">
<div class="album-player">
<!-- HERE BEGINS MADNESS -->
@ -421,7 +385,7 @@
4:41
| <strong>Cyber Soul</strong></p>
<p>2019</p>
<p><a href="../albums/darkweb/1-swipe/" class="button"><span class="fas fa-play"></span> Play</a></p>
<p><a href="/albums/darkweb/1-swipe/" class="button"><span class="fas fa-play"></span> Play</a></p>
</div>
</section>
@ -436,7 +400,7 @@
4:45
| <strong>Cypher Rap</strong></p>
<p>2019</p>
<p><a href="../albums/darkweb/2-darkweb/" class="button"><span class="fas fa-play"></span> Play</a></p>
<p><a href="/albums/darkweb/2-darkweb/" class="button"><span class="fas fa-play"></span> Play</a></p>
</div>
</section>
@ -451,7 +415,7 @@
4:42
| <strong>Cyber Soul</strong></p>
<p>2019</p>
<p><a href="../albums/darkweb/3-swipe-instrumental-/" class="button"><span class="fas fa-play"></span> Play</a></p>
<p><a href="/albums/darkweb/3-swipe-instrumental-/" class="button"><span class="fas fa-play"></span> Play</a></p>
</div>
</section>
@ -466,7 +430,7 @@
4:44
| <strong>Cypher Rap</strong></p>
<p>2019</p>
<p><a href="../albums/darkweb/4-darkweb-instrumental-/" class="button"><span class="fas fa-play"></span> Play</a></p>
<p><a href="/albums/darkweb/4-darkweb-instrumental-/" class="button"><span class="fas fa-play"></span> Play</a></p>
</div>
</section>
@ -484,7 +448,7 @@
<div class="container">
<div class="post-nav">
<h4><a href="../satoshi-mon-ami/" alt="Read Satoshi Mon Ami" title="Read Satoshi Mon Ami"><span class="fas fa-arrow-left" style="font-size:3em;text-decoration: none;"></span></a></h4>
<h4><a href="/satoshi-mon-ami/" alt="Read Satoshi Mon Ami" title="Read Satoshi Mon Ami"><span class="fas fa-arrow-left" style="font-size:3em;text-decoration: none;"></span></a></h4>
<h3>Satoshi Mon Ami</h3>
<p>The 2 tracks of laid back cloud rap are tales of daily digital life-struggles. When day-to-day communication blurs the line between the virtual and real.</p>

View file

@ -139,35 +139,17 @@
<header class="hero" style="background-image: url(/images/pages/jack-hamilton-CMnNiQBkwBI-unsplash.jpg);">
<div class="textcontainer">
<h1>Discography</h1>
<p>Collection of music releases published by 徒 setto セット over the years.</p>
<header class="hero" id="top"
style="background-image: url(/images/pages/jack-hamilton-CMnNiQBkwBI-unsplash.jpg);">
</div>
<div class="imagecontainer">
<h4>Discography</h4>
</div>
<section class="splash">
<div class="container">
<div class="splash-logo">
<img src="/images/setto-logo.svg" width="240px" alt="徒 setto セット Logo" />
</div>
<div class="description" style="padding: 0;">
<h1>Discography</h1>
<p>Collection of music releases published by 徒 setto セット over the years.</p>
</div>
</div>
</section>
</header>
@ -176,10 +158,6 @@
<section class="news" style="margin:0;">
<div style="background-image:url(../images/posts/final-pingnucover1220x1200.jpg"></div>

View file

@ -6,7 +6,7 @@
<atom:link href="https://setto.basspistol.com/rss.xml" rel="self" type="application/rss+xml" />
<link>https://setto.basspistol.com</link>
<description>Set, Party, Gang! &amp;#35;Cybersoul.</description>
<lastBuildDate>Fri, 18 Sep 2020 09:15:53 +0000</lastBuildDate>
<lastBuildDate>Fri, 18 Sep 2020 10:06:07 +0000</lastBuildDate>
<language>en-US</language>
<sy:updatePeriod>hourly</sy:updatePeriod>
<sy:updateFrequency>1</sy:updateFrequency>

Binary file not shown.

After

Width:  |  Height:  |  Size: 98 KiB

View file

@ -38,7 +38,7 @@
<title>Yo, web-TV crib! ゲットー・スービド | 徒 setto セット</title>
<meta name="title" content="Yo, web-TV crib! ゲットー・スービド | 徒 setto セット" />
<meta name="description" content="The music of To Setto Setto is a cypher cloud jam induced by popcorn chewing threads in obscure chat-rooms." />
<meta name="dc.date.modified" scheme="ISO8601" content="2020-09-18T09:15:28+00:00" />
<meta name="dc.date.modified" scheme="ISO8601" content="2020-09-18T10:06:04+00:00" />
<meta name="robots" content="index" />
<link rel="canonical" href="https://setto.basspistol.com/" />
@ -73,14 +73,14 @@
<meta property="og:url" content="https://setto.basspistol.com/" />
<meta property="og:site_name" content="徒 setto セット" />
<meta property="og:type" content="webpage" />
<meta property="article:published_time" content="2020-09-18T09:15:28+00:00" />
<meta property="og:image" content="https://setto.basspistol.com/images/pages/pingu.jpg" />
<meta property="article:published_time" content="2020-09-18T10:06:04+00:00" />
<meta property="og:image" content="https://setto.basspistol.com/images/posts/Screenshot_20200918_112312.jpg" />
<!-- Twitter Card -->
<meta name="twitter:card" content="summary" />
<meta name="twitter:title" content="Yo, web-TV crib! ゲットー・スービド | 徒 setto セット" />
<meta name="twitter:description" content="The music of To Setto Setto is a cypher cloud jam induced by popcorn chewing threads in obscure chat-rooms." />
<meta name="twitter:image" content="https://setto.basspistol.com/images/pages/pingu.jpg" />
<meta name="twitter:image" content="https://setto.basspistol.com/images/posts/Screenshot_20200918_112312.jpg" />
@ -96,7 +96,7 @@
"https://twitter.com/ToSettoSetto","https://instagram.com/ToSettoSetto","https://mastodon.art/@tosettosetto"
],
"logo": "https://setto.basspistol.com/siteicon.png",
"image": "https://setto.basspistol.com/images/pages/pingu.jpg",
"image": "https://setto.basspistol.com/images/posts/Screenshot_20200918_112312.jpg",
"description": "Set, Party, Gang! &amp;#35;Cybersoul.",
"address": {
"@type": "PostalAddress",
@ -140,12 +140,12 @@
<header class="hero" id="top"
style="">
style="background-image: url(/images/posts/Screenshot_20200918_112312.jpg);">
<div class="imagecontainer">
<h4>Yo, web-TV crib! ゲットー・スービド</h4>
</div>
<section class="splash">
<div class="container">
<div class="splash">
<div class="splash-logo">
<img src="/images/setto-logoicon.svg" width="240px" alt="徒 setto セット Logo" />
</div>
@ -155,7 +155,7 @@
<p>The music of To Setto Setto is a cypher cloud jam induced by popcorn chewing threads in obscure chat-rooms.</p>
</div>
</div>
</section>
</header>
@ -646,8 +646,8 @@ _paq.push(['enableLinkTracking']);
<div class="fullscreen-bg">
<video autoplay muted loop poster="/images/pages/pingu.jpg" class="fullscreen-bg__video">
<source src="/videos/pingu.mp4" type="video/mp4">
<video autoplay muted loop poster="/images/posts/Screenshot_20200918_112312.jpg" class="fullscreen-bg__video">
<source src="/videos/37th--chamber.mp4" type="video/mp4">
</video>
</div>

View file

@ -139,44 +139,22 @@
<header class="hero" style="background-image: url(/images/pages/phone.jpg);">
<div class="textcontainer">
<h1>Links</h1>
<p>Venture outside of your daily web-routine, read about some real projects. These links are way more than just Friends and Resources</p>
<header class="hero" id="top"
style="background-image: url(/images/pages/phone.jpg);">
</div>
<div class="imagecontainer">
<h4>Links</h4>
</div>
<section class="splash">
<div class="container">
<div class="splash-logo">
<img src="/images/setto-logo.svg" width="240px" alt="徒 setto セット Logo" />
</div>
<div class="description" style="padding: 0;">
<h1>Links</h1>
<p>Venture outside of your daily web-routine, read about some real projects. These links are way more than just Friends and Resources</p>
</div>
</div>
</section>
</header>
<section class="front-section">
<div style="background-image:url(/images/links/cropped-logo_alsenet_pv-1-e1466347695561.png)">

View file

@ -125,59 +125,23 @@
<script src="/assets/js/jquery-3.5.1.min.js"></script>
<header class="hero" style="background-image: url(/images/posts/1-ep-life-of-a-dudelini.jpeg);">
<div class="textcontainer">
<h1>Live with hardware</h1>
<p>There is a weird meta-core to anything social exchange on internet that I can't get my finger on. Assumptions and projections that I think partially stem from the lack in body language</p>
<p><a href="#play" class="button">Listen</a></p>
<header class="hero" id="top"
style="background-image: url(/images/posts/1-ep-life-of-a-dudelini.jpeg);">
</div>
<div class="imagecontainer">
<h4>Live with hardware</h4>
</div>
<section class="splash">
<div class="container">
<div class="splash-logo">
<img src="/images/setto-logo.svg" width="240px" alt="徒 setto セット Logo" />
</div>
<div class="description" style="padding: 0;">
<h1>Live with hardware</h1>
<h4>by <strong>徒 Setto セット</strong></h4>
<p>There is a weird meta-core to anything social exchange on internet that I can't get my finger on. Assumptions and projections that I think partially stem from the lack in body language</p>
</div>
</div>
</section>
</header>
<section>
<section id="play">
<div class="album-player">
<!-- HERE BEGINS MADNESS -->
@ -359,7 +323,7 @@
<div class="container">
<div class="post-nav">
<h4><a href="../cyber-grany/" alt="Read Granny is a cyborg now" title="Read Granny is a cyborg now"><span class="fas fa-arrow-left" style="font-size:3em;text-decoration: none;"></span></a></h4>
<h4><a href="/cyber-grany/" alt="Read Granny is a cyborg now" title="Read Granny is a cyborg now"><span class="fas fa-arrow-left" style="font-size:3em;text-decoration: none;"></span></a></h4>
<h3>Granny is a cyborg now</h3>
<p>Jazzy Cybersoul with a hint of 303 baselines.</p>

View file

@ -139,41 +139,19 @@
<header class="hero" style="background-image: url(/images/pages/4-darkweb-instrumental-.jpeg);">
<div class="textcontainer">
<h1>Web-Log</h1>
<p>Ramblings, announcenments and thoughts going on in the 徒 setto セット Cypher. In written form intertwined with audio</p>
<header class="hero" id="top"
style="background-image: url(/images/pages/4-darkweb-instrumental-.jpeg);">
</div>
<div class="imagecontainer">
<h4>Web-Log</h4>
</div>
<section class="splash">
<div class="container">
<div class="splash-logo">
<img src="/images/setto-logo.svg" width="240px" alt="徒 setto セット Logo" />
</div>
<div class="description" style="padding: 0;">
<h1>Web-Log</h1>
<p>Ramblings, announcenments and thoughts going on in the 徒 setto セット Cypher. In written form intertwined with audio</p>
</div>
</div>
</section>
</header>
<section>
<h2>Latest News</h2>
</section>

View file

@ -125,59 +125,23 @@
<script src="/assets/js/jquery-3.5.1.min.js"></script>
<header class="hero" style="background-image: url(/images/posts/1-k-as-tu-fait-de-nous-.jpeg);">
<div class="textcontainer">
<h1>Satoshi Mon Ami</h1>
<p>The 2 tracks of laid back cloud rap are tales of daily digital life-struggles. When day-to-day communication blurs the line between the virtual and real.</p>
<p><a href="#play" class="button">Listen</a></p>
<header class="hero" id="top"
style="">
</div>
<div class="imagecontainer">
<h4>Satoshi Mon Ami</h4>
</div>
<section class="splash">
<div class="container">
<div class="splash-logo">
<img src="/images/setto-logo.svg" width="240px" alt="徒 setto セット Logo" />
</div>
<div class="description" style="padding: 0;">
<h1>Satoshi Mon Ami</h1>
<h4>by <strong>徒 Setto セット</strong></h4>
<p>The 2 tracks of laid back cloud rap are tales of daily digital life-struggles. When day-to-day communication blurs the line between the virtual and real.</p>
</div>
</div>
</section>
</header>
<section>
<section id="play">
<div class="album-player">
<!-- HERE BEGINS MADNESS -->
@ -383,7 +347,7 @@
5:05
| <strong>Cyber Soul</strong></p>
<p>2018</p>
<p><a href="../albums/satoshi-mon-ami/1-k-as-tu-fait-de-nous-/" class="button"><span class="fas fa-play"></span> Play</a></p>
<p><a href="/albums/satoshi-mon-ami/1-k-as-tu-fait-de-nous-/" class="button"><span class="fas fa-play"></span> Play</a></p>
</div>
</section>
@ -398,7 +362,7 @@
3:06
| <strong>Cyber Soul</strong></p>
<p>2018</p>
<p><a href="../albums/satoshi-mon-ami/2-r-ve-de-toi/" class="button"><span class="fas fa-play"></span> Play</a></p>
<p><a href="/albums/satoshi-mon-ami/2-r-ve-de-toi/" class="button"><span class="fas fa-play"></span> Play</a></p>
</div>
</section>

View file

@ -74,7 +74,7 @@
</url>
<url>
<loc>https://setto.basspistol.com/</loc>
<lastmod>2020-09-18T09:15:28+00:00</lastmod>
<lastmod>2020-09-18T10:06:04+00:00</lastmod>
</url>
<url>
<loc>https://setto.basspistol.com/links/</loc>

View file

@ -125,61 +125,25 @@
<script src="/assets/js/jquery-3.5.1.min.js"></script>
<header class="hero" id="top"
style="">
<div class="imagecontainer">
<h4>Unmet Dependencies</h4>
</div>
<section class="splash">
<div class="container">
<div class="splash-logo">
<img src="/images/setto-logo.svg" width="240px" alt="徒 setto セット Logo" />
</div>
<div class="description" style="padding: 0;">
<h1>Unmet Dependencies</h1>
<h4>by <strong>徒 setto セット</strong></h4>
<p>Proprietary tools, consultancies, remote labor... The reality in the digital industry is as hard to cope with as it is building software in Haskell. Freedom is luxury, but also a burden.
<header class="hero" style="background-image: url(/images/posts/final-pingnucover1220x1200.jpg);">
<div class="textcontainer">
<h1>Unmet Dependencies</h1>
<p>Proprietary tools, consultancies, remote labor... The reality in the digital industry is as hard to cope with as it is building software in Haskell. Freedom is luxury, but also a burden.
Open your mind, open the source!</p>
</div>
</div>
<p><a href="#play" class="button">Listen</a></p>
</section>
</div>
<div class="imagecontainer">
<h4>Unmet Dependencies</h4>
</div>
</header>
<section>
<section id="play">
<div class="album-player">
<!-- HERE BEGINS MADNESS -->
@ -382,7 +346,7 @@ Open your mind, open the source!</p>
5:13
| <strong>Cybersoul</strong></p>
<p>2020</p>
<p><a href="../albums/unmet-dependencies/1-dependency-error/" class="button"><span class="fas fa-play"></span> Play</a></p>
<p><a href="/albums/unmet-dependencies/1-dependency-error/" class="button"><span class="fas fa-play"></span> Play</a></p>
</div>
</section>
@ -397,7 +361,7 @@ Open your mind, open the source!</p>
3:42
| <strong>Cybersoul</strong></p>
<p>2020</p>
<p><a href="../albums/unmet-dependencies/2-pingnu/" class="button"><span class="fas fa-play"></span> Play</a></p>
<p><a href="/albums/unmet-dependencies/2-pingnu/" class="button"><span class="fas fa-play"></span> Play</a></p>
</div>
</section>
@ -415,7 +379,7 @@ Open your mind, open the source!</p>
<div class="container">
<div class="post-nav">
<h4><a href="../live-with-hardware/" alt="Read Live with hardware" title="Read Live with hardware"><span class="fas fa-arrow-left" style="font-size:3em;text-decoration: none;"></span></a></h4>
<h4><a href="/live-with-hardware/" alt="Read Live with hardware" title="Read Live with hardware"><span class="fas fa-arrow-left" style="font-size:3em;text-decoration: none;"></span></a></h4>
<h3>Live with hardware</h3>
<p>There is a weird meta-core to anything social exchange on internet that I can't get my finger on. Assumptions and projections that I think partially stem from the lack in body language</p>

View file

@ -139,41 +139,19 @@
<header class="hero" style="background-image: url(/images/pages/kaur-kristjan-cppf4w5pb1c-unsplash.jpg);">
<div class="textcontainer">
<h1>Webcreds</h1>
<p>Information and credit regarding authors of tools, content and code used to build this website.</p>
<header class="hero" id="top"
style="background-image: url(/images/pages/kaur-kristjan-cppf4w5pb1c-unsplash.jpg);">
</div>
<div class="imagecontainer">
<h4>Webcreds</h4>
</div>
<section class="splash">
<div class="container">
<div class="splash-logo">
<img src="/images/setto-logo.svg" width="240px" alt="徒 setto セット Logo" />
</div>
<div class="description" style="padding: 0;">
<h1>Webcreds</h1>
<p>Information and credit regarding authors of tools, content and code used to build this website.</p>
</div>
</div>
</section>
</header>
<section class="info" id="read">
<div class="info-pages" data-cms-content-wrapper="/_layouts/page.html">
<h2 id="cms">CMS</h2>