* { margin: 0; padding 0; }

html { font-size: 10px; }

.page { background: green; text-align:center;}

.sh { color:#adcbed; font-size:6rem; font-family:arial,helvetica; margin: }
.toggle1 { display:inline; }
.toggle2 { display:none; }


.top { color:yellow; font-weight:normal; font-size:4rem; font-family:arial,helvetica; margin: }

.note {color:#adcbed; font-size:3rem; font-family:arial,helvetica; }
.notew {color:white; font-size:3rem; font-family:arial,helvetica; }
.note a {color:#adcbed; text-decoration:none; }

.logo-mask {
  -webkit-mask-image: url(/images/sh-smooth.svg);
  mask-image: url(/images/sh-smooth.svg);
  mask-size: contain;
  mask-repeat: no-repeat;
  vertical-align:middle;
}

p {
  line-height: 4rem; padding-bottom: 2rem;
}

.break { clear:both; }

.wrap { padding:0 2rem 0 2rem; text-align:left; }

section:nth-of-type(1) {
  background-color: #004000
}

section:nth-of-type(2) {
  background-color: #008000
}

.section-divider {
  aspect-ratio: 959/127;
  background: no-repeat center;
  background-size: cover;
}

.wave-1 {
  background-image: url(/images/wave-1.svg);
}


@media only screen and (max-width : 820px) {
  .toggle1 { display:none; }
  .toggle2 { display:inline; }
  .logo-mask { vertical-align:sub; max-width:350px; }
  .note a { font-size: 2.5rem; }
}