/* page scss*/
/* Front page -- Golden Ratio Page 04
 * Description: Golden Ratio.
 * Author(s): Andreas Ua'Siaghail,
 * Dependencies:   reset              
 * Date:   2017, update May 15 2024           */
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: inherit;
  font-size: 100%;
  vertical-align: baseline; }

html {
  line-height: 1; }

ol, ul {
  list-style: none; }

table {
  border-collapse: collapse;
  border-spacing: 0; }

caption, th, td {
  text-align: left;
  font-weight: normal;
  vertical-align: middle; }

q, blockquote {
  quotes: none; }

q:before, q:after, blockquote:before, blockquote:after {
  content: "";
  content: none; }

a img {
  border: none; }

article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section, summary {
  display: block; }

.unregistered-only, .registered-only {
  display: none; }

body.registered a.registered-only, body.registered abbr.registered-only, body.registered acronym.registered-only, body.registered audio.registered-only, body.registered b.registered-only, body.registered basefont.registered-only, body.registered bdo.registered-only, body.registered big.registered-only, body.registered br.registered-only, body.registered canvas.registered-only, body.registered cite.registered-only, body.registered code.registered-only, body.registered command.registered-only, body.registered datalist.registered-only, body.registered dfn.registered-only, body.registered em.registered-only, body.registered embed.registered-only, body.registered font.registered-only, body.registered i.registered-only, body.registered img.registered-only, body.registered input.registered-only, body.registered keygen.registered-only, body.registered kbd.registered-only, body.registered label.registered-only, body.registered mark.registered-only, body.registered meter.registered-only, body.registered output.registered-only, body.registered progress.registered-only, body.registered q.registered-only, body.registered rp.registered-only, body.registered rt.registered-only, body.registered ruby.registered-only, body.registered s.registered-only, body.registered samp.registered-only, body.registered select.registered-only, body.registered small.registered-only, body.registered span.registered-only, body.registered strike.registered-only, body.registered strong.registered-only, body.registered sub.registered-only, body.registered sup.registered-only, body.registered textarea.registered-only, body.registered time.registered-only, body.registered tt.registered-only, body.registered u.registered-only, body.registered var.registered-only, body.registered video.registered-only, body.registered wbr.registered-only {
  display: inline; }

body.registered address.registered-only, body.registered article.registered-only, body.registered aside.registered-only, body.registered blockquote.registered-only, body.registered center.registered-only, body.registered dir.registered-only, body.registered div.registered-only, body.registered dd.registered-only, body.registered details.registered-only, body.registered dl.registered-only, body.registered dt.registered-only, body.registered fieldset.registered-only, body.registered figcaption.registered-only, body.registered figure.registered-only, body.registered form.registered-only, body.registered footer.registered-only, body.registered frameset.registered-only, body.registered h1.registered-only, body.registered h2.registered-only, body.registered h3.registered-only, body.registered h4.registered-only, body.registered h5.registered-only, body.registered h6.registered-only, body.registered hr.registered-only, body.registered header.registered-only, body.registered hgroup.registered-only, body.registered isindex.registered-only, body.registered menu.registered-only, body.registered nav.registered-only, body.registered noframes.registered-only, body.registered noscript.registered-only, body.registered ol.registered-only, body.registered p.registered-only, body.registered pre.registered-only, body.registered section.registered-only, body.registered summary.registered-only, body.registered ul.registered-only {
  display: block; }

body.unregistered a.unregistered-only, body.unregistered abbr.unregistered-only, body.unregistered acronym.unregistered-only, body.unregistered audio.unregistered-only, body.unregistered b.unregistered-only, body.unregistered basefont.unregistered-only, body.unregistered bdo.unregistered-only, body.unregistered big.unregistered-only, body.unregistered br.unregistered-only, body.unregistered canvas.unregistered-only, body.unregistered cite.unregistered-only, body.unregistered code.unregistered-only, body.unregistered command.unregistered-only, body.unregistered datalist.unregistered-only, body.unregistered dfn.unregistered-only, body.unregistered em.unregistered-only, body.unregistered embed.unregistered-only, body.unregistered font.unregistered-only, body.unregistered i.unregistered-only, body.unregistered img.unregistered-only, body.unregistered input.unregistered-only, body.unregistered keygen.unregistered-only, body.unregistered kbd.unregistered-only, body.unregistered label.unregistered-only, body.unregistered mark.unregistered-only, body.unregistered meter.unregistered-only, body.unregistered output.unregistered-only, body.unregistered progress.unregistered-only, body.unregistered q.unregistered-only, body.unregistered rp.unregistered-only, body.unregistered rt.unregistered-only, body.unregistered ruby.unregistered-only, body.unregistered s.unregistered-only, body.unregistered samp.unregistered-only, body.unregistered select.unregistered-only, body.unregistered small.unregistered-only, body.unregistered span.unregistered-only, body.unregistered strike.unregistered-only, body.unregistered strong.unregistered-only, body.unregistered sub.unregistered-only, body.unregistered sup.unregistered-only, body.unregistered textarea.unregistered-only, body.unregistered time.unregistered-only, body.unregistered tt.unregistered-only, body.unregistered u.unregistered-only, body.unregistered var.unregistered-only, body.unregistered video.unregistered-only, body.unregistered wbr.unregistered-only {
  display: inline; }

body.unregistered address.unregistered-only, body.unregistered article.unregistered-only, body.unregistered aside.unregistered-only, body.unregistered blockquote.unregistered-only, body.unregistered center.unregistered-only, body.unregistered dir.unregistered-only, body.unregistered div.unregistered-only, body.unregistered dd.unregistered-only, body.unregistered details.unregistered-only, body.unregistered dl.unregistered-only, body.unregistered dt.unregistered-only, body.unregistered fieldset.unregistered-only, body.unregistered figcaption.unregistered-only, body.unregistered figure.unregistered-only, body.unregistered form.unregistered-only, body.unregistered footer.unregistered-only, body.unregistered frameset.unregistered-only, body.unregistered h1.unregistered-only, body.unregistered h2.unregistered-only, body.unregistered h3.unregistered-only, body.unregistered h4.unregistered-only, body.unregistered h5.unregistered-only, body.unregistered h6.unregistered-only, body.unregistered hr.unregistered-only, body.unregistered header.unregistered-only, body.unregistered hgroup.unregistered-only, body.unregistered isindex.unregistered-only, body.unregistered menu.unregistered-only, body.unregistered nav.unregistered-only, body.unregistered noframes.unregistered-only, body.unregistered noscript.unregistered-only, body.unregistered ol.unregistered-only, body.unregistered p.unregistered-only, body.unregistered pre.unregistered-only, body.unregistered section.unregistered-only, body.unregistered summary.unregistered-only, body.unregistered ul.unregistered-only {
  display: block; }

/* Variables -- SASS */
/* Golden Ratio Page 0.0.4. */
/* Custom Properties -- CSS  */
html, * {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
  border: none;
  border-width: 0;
  /*	font-size: 16px;
	font-size: 100%;*/ }

html {
  font-size: 1.618em; }

body {
  background-image: url("../../images/texture_noise_333.png"); }

div.container {
  display: flex;
  flex-direction: row;
  align-items: stretch;
  align-content: stretch;
  width: 1024px;
  height: 100vh;
  margin: 0 auto;
  background: #eee;
  color: #fff;
  font-weight: 400;
  line-height: 1.45;
  font-family: "museo-sans",helvetica, sans-serif;
  background: #9B9B9B;
  background-image: url("../../images/noise_grey_02.png"); }

div.left, div.right {
  height: 100%;
  padding-top: 3em; }

div.left {
  width: 61.8%;
  background: #D8D8D8;
  background-image: url("../../images/noise_grey_01.png"); }

div.right {
  width: 38.2%;
  /*	background: #9B9B9B;
	background-image: url("../../images/noise_grey_02.png");*/ }

p, p.small, h3 {
  margin-left: 38.2%; }

p.small {
  font-size: .618em; }

h3 {
  font-weight: 500;
  line-height: 1.618em; }

section.sectionItem {
  /*	margin-bottom: 2em;*/ }

.right.gridRight {
  display: grid;
  grid-template-rows: repeat(1, 1fr);
  grid-template-columns: repeat(1, 1fr);
  max-height: 300px; }

.right.gridRight .sectHolder, .right.gridRight .animHolder {
  grid-row: 1 / 2;
  grid-column: 1 / 2; }

.right.gridRight .sectHolder {
  grid-template-rows: repeat(3, min-content);
  display: grid;
  gap: 1.225em; }

.right.gridRight .animHolder {
  display: grid;
  z-index: 2;
  align-self: center;
  place-items: center;
  opacity: .6;
  /*	filter: blur(3px);*/
  /*	background-color: rgba(0, 0, 0, .3);*/ }

.comingSoon {
  opacity: .2;
  filter: blur(4px); }

/* Sound Wave 01 -- as a partial */
@keyframes audio-wave {
  0% {
    height: 6px;
    transform: translateY(0px);
    background: #ff8e3a; }
  25% {
    height: 40px;
    transform: translateY(-5px) scaleY(1.7);
    background: #ed509e; }
  50% {
    height: 6px;
    transform: translateY(0px);
    background: #9c73f8; }
  100% {
    height: 6px;
    transform: translateY(0px);
    background: #0fccce; } }

.sound-wave {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: .8rem;
  width: 8rem;
  height: 2.5rem; }

.sound-wave div {
  height: 2.5rem;
  display: block;
  width: 1.2rem;
  height: 0.4rem;
  border-radius: 0.8rem;
  background: orange;
  animation: audio-wave 2.2s infinite ease-in-out; }

.sound-wave div:nth-child(2) {
  left: 11px;
  animation-delay: 0.2s; }

.sound-wave div:nth-child(3) {
  left: 22px;
  animation-delay: 0.4s; }

.sound-wave div:nth-child(4) {
  left: 33px;
  animation-delay: 0.6s; }

.sound-wave div:nth-child(5) {
  left: 44px;
  animation-delay: 0.8s; }

.sound-wave div:nth-child(6) {
  left: 55px;
  animation-delay: 1s; }

.sound-wave div:nth-child(7) {
  left: 55px;
  animation-delay: 1.2s; }