:root {
  --black: #5b3a53 ;
  --dark:  #a63356 ;
  --med:  #ef5077 ;
  --light:  #fdc6d3  ;
  --white:  #fff ;
  --blackrgb: 91, 58, 83, ;
  --darkrgb:  166, 51, 86, ;
  --medrgb:  239, 80, 119, ;
  --lightrgb:  253, 198, 211,  ;
  --whitergb:  255, 232, 225, ;
}

.half {
  width:50%;
}

.graphic {
  display:flex;
  width:100%;

}

.mm {

}

.blinkies {
  box-shadow: inset 2px 2px 10px rgba(255,255,255,.1), inset -5px -8px 8px rgba(0,0,0,.2);
  outline:none;
  border:1px solid dodgerblue;
  background:lightskyblue;
  float:right;
  padding:1em;
}

.stamps {
 box-shadow: inset 2px 2px 10px rgba(255,255,255,.1), inset -5px -8px 8px rgba(0,0,0,.2);
  padding:1em;
   float:left;
    outline:none;
    border:1px solid hotpink;
}

article .stamps img {
  height:56px;
  width:99px;
}

article .blinkies img {
  height:20px;
  width:150px;
}

.misc {
  margin:1em auto;
  display:block;
 box-shadow: inset 2px 2px 10px rgba(255,255,255,.1), inset -5px -8px 8px rgba(0,0,0,.2);
  outline:none;
  border:1px solid orange;
  background:lightyellow;
  padding:1em;
}


summary {
  margin-bottom:10px;
}


main {
flex:1 1 65%
}

h1 {
  font-weight:bolder;
  position:relative;
  z-index:10;
  text-shadow: rgb(253, 198, 211) 2px 0px 0px, rgb(253, 198, 211) 1.75517px 0.958851px 0px, rgb(253, 198, 211) 1.0806px 1.68294px 0px, rgb(253, 198, 211) 0.141474px 1.99499px 0px, rgb(253, 198, 211) -0.832294px 1.81859px 0px, rgb(253, 198, 211) -1.60229px 1.19694px 0px, rgb(253, 198, 211) -1.97998px 0.28224px 0px, rgb(253, 198, 211) -1.87291px -0.701566px 0px, rgb(253, 198, 211) -1.30729px -1.5136px 0px, rgb(253, 198, 211) -0.421592px -1.95506px 0px, rgb(253, 198, 211) 0.567324px -1.91785px 0px, rgb(253, 198, 211) 1.41734px -1.41108px 0px, rgb(253, 198, 211) 1.92034px -0.558831px 0px;
  }

#main {
  max-width:90%
}

#container {
  padding:50px;
  padding-top:100px
}
aside.top {
  display:flex;
  flex-flow:row wrap;
  position:relative;
  align-items:center;
  padding:0px 10%;
;}

.tilt:hover {
  transform:rotate(3deg) }


  aside.top article.paper {
    flex:1 2 40%; }
    aside.top article.paper:nth-of-type(even) {
      margin-right:100px }
.above {
  max-width:100% }

.pinboard {
  background-image:url('https://gummywormhydra.online/gift/17th/g/linen-pink.jpg') !important;
  display:flex;
  flex-flow:row wrap;
  width:100%;
  padding:60px 30px;
  outline:60px var(--med) groove;
  outline-offset:-60px;
  position:relative;
  align-items:flex-start
-webkit-box-shadow: inset 0px 0px 30px 12px rgba(166,51,86,0.45);
-moz-box-shadow: inset 0px 0px 30px 12px rgba(166,51,86,0.45);
box-shadow: inset 0px 0px 30px 12px rgba(166,51,86,0.45);
border: 60px solid transparent; 
border-image-source: url('https://gummywormhydra.online/gift/17th/g/lacewhite.png');
border-image-slice: 84;
border-image-repeat: round;
border-image-outset:1;
}


article {
  flex:2 1 40%;
  width:fit-content;
  max-width:100%
}

main img {
  max-width:60%;
}

h4 a {
  color:var(--dark);
  padding:5px 8px !important;
  border-radius:0 !important;
  }
  
  h4 a:hover {
    mix-blend-mode:multiply;
    color:var(--black) !important;
    background:var(--light) !important;
    }


@media screen and (max-width:800px ) {
#container {
  padding:0px;
  padding-top:100px;
}
#main {
  max-width:100%;
  }
  
.pinboard {
  padding:10px;
  margin:0px;
  width:100%;
}

article.paper {
  background-size:cover;
  max-height:2400px;}
article {
  flex:1 1 100% !important }

aside.top article, details.postit {
  width:100%;
  flex:1 1 100% }
}



* {
  box-sizing: border-box;
  scrollbar-color: var(--med) transparent;
  max-width:100vw;
}

body {
  background:url('https://gummywormhydra.online/gift/17th/g/dots.png'), url('https://gummywormhydra.online/gift/17th/g/floralembroidery-light2.png');
  background-attachment: fixed;
  font-family: 'Latin Modern Mono', monospace;
  letter-spacing:-0.3px;
  font-size:15px;
  line-height:1.2em;
  color:var(--black);
  max-width:100vw;
  overflow-x:hidden
}
  
.bg-typewriter {
   background:url('https://gummywormhydra.online/gift/17th/g/typewriter%20(1).png') repeat-x fixed !important;
}

.bg-grid {
    background:url('https://gummywormhydra.online/gift/17th/g/grid.png') repeat !important;
}

.bg-pinkwall {
    background:url('https://gummywormhydra.online/gift/17th/g/pinkwall.png') repeat !important;
}

.bg-fabric {
  background:url('https://gummywormhydra.online/gift/17th/g/pinkfloral.png') fixed top left !important;
  background-size:auto, 150px
}

.bg-scroll {
  background-attachment:scroll;
  background-repeat:repeat
}
.bg-white article, article.bg-white {
  background:var(--white);
  border-color:var(--light)
}
.bg-white a {
  text-decoration-color:var(--med)
}
.bg-white a:hover {
  background:var(--light)
}

.bg-dark article:not(article.bg-dark article), article.bg-dark {
  background:var(--black);
  color:var(--white);
  border-color:var(--dark)
}

.bg-plain {
  background-image:url('https://gummywormhydra.online/gift/17th/g/blank.png') !important;
  background-position: top;
}

.bg-lined {
  background-image:url('https://gummywormhydra.online/gift/17th/g/lined.png') !important;
  background-position:center;
}
.bg-flowerdeco {
  background-image:url('https://gummywormhydra.online/gift/17th/g/flowerdeco.png') !important;
}

.bg-field {
  background-image:url('https://gummywormhydra.online/gift/17th/g/field.png') !important;
}

.bg-handmade {
  background-image:url('https://gummywormhydra.online/gift/17th/g/handmade-white.png') !important;
}
.bg-recycled {
  background-image:url('https://gummywormhydra.online/gift/17th/g/recycled-pink.png') !important;
}

.bg-pumpkin {
  background-image:url('https://gummywormhydra.online/gift/17th/g/pumpkin.png') !important;
}
.bg-fleckedpink {
    background-image:url('https://gummywormhydra.online/gift/17th/g/flecked-lightpink.png') !important;
    background-repeat:repeat}
.bg-floraldark {
    background-image:url('https://gummywormhydra.online/gift/17th/g/floralembroidery-dark.png') !important;
    background-repeat:repeat;
    }


article.paper, .paper article {
  border:none;
  outline:none;
  box-shadow:none;
  background-color:transparent;
  background-size:cover;
  background-repeat:repeat-y;
  margin-bottom:-50px;
  padding:100px;
}

.shadow {
  filter: drop-shadow(1px 3px 5px rgba(66, 18, 47, 0.42)); }
  
article.paper.bg-paper {
 background: url('https://gummywormhydra.online/gift/17th/g/lined.png') fixed top left; 
 background-repeat:repeat;
}


article.paper {
  border-radius:0;
  padding:50px;
  min-height:auto;
  margin:20px
}

.paper.small {
  flex:1 4 30%
}

.paper.photo {
  padding:0px !important;
  min-height:auto !important;
  min-width:350px;
  background-image:none !important;
}

.paper.photo a {
  background:var(--white);
  float:right
}

.paper.photo img, .paper.polaroid img {
  width:100%;
max-width:100% !important;
object-fit:contain
}

.paper.photo.smallphoto {
flex:1 4 20%;
min-width:150px;
margin:0;
padding:0
}
img.smallphoto {
  min-width:150px;
  max-width:100%;
  margin:10px 0px;
  max-height:350px;
  min-height:200px !important;
  object-fit:contain
}

.papers .paper:nth-of-type(odd) {
  background-image:url('https://gummywormhydra.online/gift/17th/g/flecked-lightpink.png');
  background-position: top;
}

.papers .paper:nth-of-type(even){
  background-image:url('https://gummywormhydra.online/gift/17th/g/lined.png');
  background-position:center;
}
.papers .paper:nth-of-type(3n) {
  background-image:url('https://gummywormhydra.online/gift/17th/g/flowerdeco.png');
}

.papers .paper:nth-of-type(5n){
  background-image:url('https://gummywormhydra.online/gift/17th/g/grid.png');
    top:10px;
    transform:rotate(1deg)
}
.papers .paper:nth-of-type(6n) {
  background-image:url('https://gummywormhydra.online/gift/17th/g/recycled-white.png');
}
.papers .paper:nth-of-type(7n) {
  background-image:url('https://gummywormhydra.online/gift/17th/g/handmade-purple.png');
    top:-10px
}
.papers .paper:nth-of-type(8n) {
  background-position:bottom;
  background-image:url('https://gummywormhydra.online/gift/17th/g/recycled-lightorange.png')
}
.papers .paper:nth-of-type(9n) {
  background-image:url('https://gummywormhydra.online/gift/17th/g/typewriter%20(1).png')
}

.papers .paper:nth-of-type(odd) {
  transform:rotate(.5deg);
}
.papers .paper.taped:first-of-type {
  transform:rotate(2deg);
}
.papers .paper:nth-of-type(3n) {
  transform:rotate(1deg);
}
.papers .paper:nth-of-type(5n) {
  transform:rotate(-2deg);
}

.paper.polaroid {
  max-width:400px;
  background:#fff;
  padding:30px;
  font-size:1.1em;
  text-align:center;
  transform:rotate(0deg) !important
}


.taped::before {
  background-image:url('https://gummywormhydra.online/gift/17th/g/hillhousepink.png');
  background-repeat:no-repeat;
  display:block;
  content:" ";
  position:absolute;
  height:50px;
  width:150px;
background-size:contain;
  top:-20px;
  left:40%
}
.extra.small.taped::before {
  top:-30px;
  left:-30px;
  transform:rotate(-25deg)
}


.taped:nth-of-type(4n)::before, article.taped ~ div article.taped:nth-of-type(6n)::before, .small:nth-of-type(odd) .taped:nth-of-type(even)::before {
        background-image:url('https://gummywormhydra.online/gift/17th/g/typewriter.png');left:20px }

.taped:nth-of-type(8n)::before, .taped:nth-of-type(6n)::before {
      background-image:url('https://gummywormhydra.online/gift/17th/g/scallop.png'); left:30%}

.taped:nth-of-type(odd)::before {
          background-image:url('https://gummywormhydra.online/gift/17th/g/hearts.png');
        right:20px }

        .taped:nth-of-type(3n)::before {
    background-image:url('https://gummywormhydra.online/gift/17th/g/batsbrown.png'); left:10%  }
    
  .taped:nth-of-type(5n)::before {
      background-image:url('https://gummywormhydra.online/gift/17th/g/cherryblossoms.png'); left:60%}

.taped:nth-of-type(7n)::before, .small:nth-of-type(even) .taped:nth-of-type(odd)::before, article.taped ~ div article.taped:first-of-type::before {
      background-image:url('https://gummywormhydra.online/gift/17th/g/daisiespink.png'); left:30%}

article.taped ~ div article.taped:nth-of-type(4n)::before {
   background-image:url('https://gummywormhydra.online/gift/17th/g/batspink.png'); left:70%
   }

aside.left article.paper {
  padding:30px }
article.paper:nth-of-type(even) {
  transform:rotate(-1deg);
  margin-left:5px;
}
article.paper:nth-of-type(3n) {
  transform:rotate(1.5deg);
  margin-left:-10px
}
article.paper.small, article.paper.extra.small {
  padding:30px;
}
article.repeat {
  background-repeat:repeat;
  background-size:contain;
   max-height:2000px
}
.scroll {
max-height:500px;
overflow:scroll}

#container {
  padding-top:80px;
  padding-bottom:50px;
  padding-left:40px;
  padding-right:150px
}



#main {
  display:flex;
  flex-flow: row wrap;
  max-width:90%;
  margin:0 auto;
  justify-content:center;
  align-items: flex-start;
  gap:20px
}

aside, main {
  display:flex;
  flex-flow:row wrap;
  align-items: flex-start;
  gap:20px
}

aside.left {
  flex:1 2 10%;
  gap:0px;
  flex-flow:row ;
  align-items: flex-start;
}
.wrap {
  flex-flow:row wrap !important
}
aside.right {
  flex:1 2 10%;

  justify-content: center;
}

#main.leftfixed aside.left {
position:fixed !important;
left:30px;
top:10px;
max-width:150px;
}


#main.leftfixed main {
 margin-left:200px 
}

main {
  flex:4 1 40%;
  min-width:300px;
}
#homenav {
  flex:1 4 20%;
  margin:0px;
  padding:20px;
  padding-bottom:0px;
}
#navimg {
  flex:1 10 50px;
}
.small {
  flex:1 2 40%
}
.extra.small {
  flex:1 3 20%
}

.extra.extra.small {
  flex:1 4 10% }
.big {
  flex:2 1 100%
}
.small > article {
  margin-bottom:20px
}

article.short {
  max-height:250px;
  overflow-y:scroll }
#navimg > img {
  max-width:100px
}
#navimg img#navall {
  display:none
}

.topbar {
  width:100%;
  height:40px;
  margin:50px auto;
  margin-top:-50px;
  top:0;
  display:flex;
  flex:row no-wrap;
  gap:30px;
  font-size:20px;
  line-height:20px;
  justify-content: flex-start;
  align-items:stretch;
  position:relative;
  z-index:-2

}
.topbar div {
  background:var(--med);
  color:var(--light);
    padding:10px;
    border-radius:25px;
    position:relative;

}


.alignbottom img, .alignbottom {
  vertical-align:bottom !important }


article {
  border:4px solid var(--white);
  outline:1.5px dashed var(--med);
  outline-offset:4px;
  background:var(--light);
  padding:35px;
  position:relative;
  margin:25px 15px;
  flex:1 1 auto;
  border-radius:10px;
  max-width:100%;
  min-width:200px;
  box-shadow:12px 12px var(--med), 14px 14px var(--white), 10px 14px var(--white), 14px 10px var(--white);
}

article article {
  margin:10px auto;
  width:90%;
  min-width:100px;
  max-width:350px;
  padding:15px;
  background:var(--white);
    box-shadow:12px 12px var(--light), 14px 14px var(--white), 10px 14px var(--white), 14px 10px var(--white);
    margin-bottom:20px;
}

a {
  color:var(--med);
  text-decoration:underline wavy var(--light);
  text-shadow: rgb(255, 255, 255) 1px 0px 0px, rgb(255, 255, 255) 0.540302px 0.841471px 0px, rgb(255, 255, 255) -0.416147px 0.909297px 0px, rgb(255, 255, 255) -0.989992px 0.14112px 0px, rgb(255, 255, 255) -0.653644px -0.756802px 0px, rgb(255, 255, 255) 0.283662px -0.958924px 0px, rgb(255, 255, 255) 0.96017px -0.279415px 0px;

}

a:hover {
  border-radius:5px;
text-decoration:underline wavy var(--white) !important;
}

.imgs.buttons a img { transition: .2s; }
.abadge:hover, .imgs.buttons a img:hover { border-radius:8px; transition: .2s;outline:2px var(--white) solid}

a:not(.imgs a) {
    padding:0px 3px
}
a:not(.imgs a):hover {
  text-shadow:none;
    background:var(--med);
    color:var(--white);
}

a[href^="http"]:not(.imgs a, #nav a)::after, a[href^="https://"]:not(.imgs a, #nav a)::after {
  content:"\2924";
padding:0;
margin-left:2px;
display: inline-block;
font-style: normal;
font-weight:bold;
color:var(--dark);
font-family:'Apple Symbols'
}

b {
  color:var(--dark);
}
i {
  font-style:italic;
}

s {
  color:var(--dark)
}

code,textarea {
  background:var(--dark);
  color:var(--light);
  display:block;
  font-size:10px;
  width:100%;
  min-height:100px;
overflow:scroll;
margin:10px;
text-align:left;
border:1px var(--med) solid
}

u {
  background: linear-gradient(180deg, rgba(255,255,255,0) 60%, var(--white) 60%);
  text-decoration: none
}
ol, ul {
  padding-left:15px;
}

blockquote {
  font-style:italic;
  padding:10px 20px;
  margin-left:20px;
  margin-right:10px;
  background:var(--white);
  color:var(--dark);
  outline:var(--white) dashed 2px;
  outline-offset:5px;
  position:relative;
  text-align:left;
}
blockquote::before {
  content:'‟';
  color:var(--med);
  font-family:serif;
  font-size:80px;
  line-height:20px;
  position:absolute;
  left:-40px;
  top:20px;
  font-style:normal}

article.bg-white blockquote, .bg-white article blockquote {
  background:var(--light);
  color:var(--black);
  outline-color:var(--light)}

details summary:not(details.return summary, details.h2 summary) {
  display:inline-block;
  border:var(--med) 1px dashed;
  color:var(--dark);
  padding:2px 5px;

}

details.h2 summary { 
  margin:20px auto;
  font-weight:normal;
  display:block;
  width: max-content;
  background:var(--med);
  color:var(--white);
  padding:5px 10px;
  border-radius:5px;
  border:1px var(--white) dashed;
  outline:1px var(--med) dotted;
}

details.h2[open] {
  border:none;
  padding:0px;
  max-width:100%;
  text-align:center;}

details summary:hover, details[open] summary:not(details.return[open] summary) {
  font-style:italic;
  border-radius:5px;
  box-shadow:2px 2px var(--med);
}
details[open]:not(details.return[open], details.h2[open]) {
  margin-bottom:20px;
  max-width:100%;
}

hr {
  border:none;
  margin:30px auto;
  height:18px;
  width:226px;
  max-width:100%;
  background-image:url('https://gummywormhydra.online/gift/17th/g/hr-pinkheart.png');
  background-size:contain;
  background-repeat:no-repeat;
  image-rendering:pixelated;
  mix-blend-mode:multiply;
  display:block;
}

h1 {
  font-family:times new roman;
  margin:0;
  padding:0;
  font-weight:normal;
  font-size:3.8em;
  color:var(--dark);
  mix-blend-mode:multiply;
  line-height:.7em;
  padding:5px;
  z-index:1
}

article > h1:first-child {
  position:absolute;
  top:-35px;
  left:-20px;
}

h1::after {
  content:"";
  display:block;
  width:70%;
  margin-left:auto;
  margin-right:-10px;
  border-bottom:3px dotted var(--med);
  mix-blend-mode:multiply;

}

h2 {
  margin:20px auto;
  font-weight:normal;
  display:block;
  width: max-content;
  background:var(--med);
  color:var(--white);
  padding:5px 10px;
  border-radius:5px;
  border:1px var(--white) dashed;
  outline:1px var(--med) dotted;
  max-width:100%;
}
h2 a {
  color:inherit }
  
  h2 a:hover {
    color:inherit;
    background:transparent;
    font-style:italic }

h3 {
  font-style:italic;
  border-radius:5px;
  box-shadow:5px 5px var(--med);
  display:table;
  margin:25px auto;
  margin-top:5px;
  border:var(--med) 1px dashed;
  color:var(--dark);
  padding:5px 10px;
  background:var(--light)
}

h4 {
  color:var(--med);
  font-size:1.2em;
  font-weight:normal;
  display:inline
}

h5 {
  background:var(--white);
color:var(--med);
display:inline-block;
padding:2px 10px;
margin:0;
transform:skew(-5deg) rotate(-2deg)
}

img {
  max-width:100%;
}
.pixel img {
  margin:5px;
  min-width:auto
}

.badges img { max-width:80px;max-height:15px }
.blinkies img { width:150px;height:20px;margin:0;padding:0 }
.badges { line-height:20px }
.blinkies { line-height:25px }
.buttons:not(.links.buttons) { line-height:35px }
.buttons img { max-width:88px;max-height:31px }
.stamps img { width:99px;height:56px; }

 .abadge {
  display:inline-block ;
  font-size:10px ;
  font-weight:bold;
text-transform:uppercase;
word-break: break-all;
color:var(--white) ;
line-height:3em;
width:88px;
  height:31px ;
  margin:0px;
  text-align:center;
  vertical-align:middle;
  padding:1px;
  background-color:var(--dark);
  transition: .2s;
  overflow:hidden
}

#statuscafe-username a {
  display:none
}
#statuscafe-username {
  display:inline
}
.pixel img {
  image-rendering:pixelated;
  vertical-align:middle;
}
.hover img:hover {
  transform:scale(200%);
  z-index:1
}

img.sticker {
    position:absolute;
}

img.sticker.top {
  height:150px;
  width:auto;
  top:-150px;
  right:0px;
  z-index:-1
}


img.sticker.rightside {
  height:130px;
  right:-50px;
  bottom:-30px;
  z-index:1
}
img.rightside.bigger {
  height:auto;width:300px;right:-230px;bottom:-20px;
}
img.rightside.big {
  height:400px;width:auto;right:-230px;bottom:-20px;
}

img.sticker.leftside {
  height:180px;
  left:-50px;
  bottom:17px;
  z-index:1
}

img.sticker.bottom {
  bottom:-10px
}

img.leftside.bigger {
  height:auto;width:300px;left:-130px;bottom:20px;max-width:20vw
}
img.sticker.tilted {
  transform:rotate(-10deg)
}
img.sticker.small {
  height:120px;
  transform:rotate(8deg)
}

img.tape {
  position:absolute;
  max-height:60px;top:-43px;right:0px;z-index:1;
  filter: drop-shadow(0px 2px 1px rgba(66, 18, 47, 0.42));
}
img.tape.bottom {
top:95%;z-index:34}
img.tape.small {
  max-height:40px;
  top:-30px;
  left:10px
}
img.tape.leftside {
  left:0px;
}
img.tape.center {
  left: 50%;
  transform: translate(-50%);
}
img.flip {
  transform:rotate(180deg);
}
img.center.flip {
    transform: translate(-50%) rotate(180deg);
}

.flex {
  display:flex;
  flex-flow:row wrap;
  max-width:100%;

}

.flex .small {
  flex:1 1 45%;
  min-width:200px;
  max-width:100%;;
  /*margin:0 auto*/
}

.flex .extra.small {
  flex:1 3 20%;
  margin:10px
}
article.no-shadow {
  box-shadow:none;
  width:100%;
  max-width:100%
}
.no-shadow article {
  box-shadow:none;
}

.behind {
  z-index:-4 !important
}
.above {
  z-index:100 !important
}
.rotate {
    transform:rotate(-10deg);
}
article.laceright {
  background-image:url('https://gummywormhydra.online/gift/17th/g/lace.png');
  background-repeat:repeat-y;background-position:right;padding-right:50px
}
article.laceleft {
  background-image:url('https://gummywormhydra.online/gift/17th/g/lace.png');background-repeat:repeat-y;padding-left:50px
}

.now p {
  background:var(--white);
  padding:2px 5px;
}
.now p:nth-child(odd) {
  text-align:right
}
.now p img {
  float:left }
  .now p:nth-child(even) img {
    float:right }
.now > .now.pastsongs {
display:none
}
.now.pastsongs a {
  display:block;
  width:100%;
}

#updates.index ul li:first { display:block;}
#updates.index ul { margin:0px auto;padding:0px }
#updates li { list-style:none }
#updates.index details {
  list-style: none;
  display:none;
}
#updates li b {
  background:var(--white);
  color:var(--med);
  padding:0px 5px
}
.columns {
  columns: 2;
  gap:10px;
  max-width:100%
}
.columns article, .columns li {
  break-inside:avoid
}

.center {
  text-align: center;
  margin:0 auto
}




@media screen and (max-width:1000px ) {
  .columns {
    columns: 1
  }
  
}

@media screen and (max-width: 800px) {
  article.short {
  max-height:100%;}
  article.paper, .paper article {
  background-size:contain;
  background-repeat:repeat;
}
  #container {
    padding:80px
  }
  aside.left {
    flex:1 1 100%;
    flex-flow:row wrap-reverse
  }
  aside.left > #nav, aside.left > #navimg {
    flex:1 1 100%
  }
      #main.leftfixed aside.left {
position:relative !important;
left:0px;
top:0px;
    flex:1 1 100%;
    flex-flow:row wrap-reverse;
    max-width:100%
}

article {
max-height:100%;
}

section .graphics {
  display:block !important;
}


#main.leftfixed main {
 margin-left:0px; 
}
  #nav .navcontent {
    columns:2
  }
  aside.left {
    order:1
  }
  main {
    order:2
  }
  aside.right {
    order:3
  }
  .cutout {
    position:relative;
    order:5;
    width:100%;
    text-align:center;
    margin:-10px
  }
  

 }
 @media screen and (max-width: 450px) {
   body {
  
  max-width:100vw !important;
   }
   body, .bg-typewriter {
      background-attachment:unset !important;
  background-repeat:repeat !important;
  background-size:auto !important
 }
 aside.left, aside.right {
   flex:1 1 100%;
   width:100%;
   height:auto}
   
   * {
     max-width:100vw;
     word-wrap: break-word;

     }
     img.sticker {
      max-width:15vw;
      object-fit:contain;
      }
      a img.sticker {
        position:relative ;
        margin:0 auto;
        max-width:40vw;
        top:0;bottom:0;left:0;right:0
        }
   
   h1 {
     font-size:2.5em;
     position:relative !important;
     margin:10px auto;
     margin-bottom:-10px;
}
blockquote {
  margin:0 auto }
aside, main, #main, #container {
  width:100%;
  max-width:100%;
  overflow-x:hidden;
  padding:5px;
}
#nav, #navimg {
  width:100%
}
#navimg img:not(#navimg img#navall),
.topbar {
  display:none
}
#navimg img#navall {
  display:block;
}

#nav .navcontent {
  columns:1;
  padding-top:20px;
  border-top:2px dotted var(--white);
  margin-top:20px;
}
.navcontent img {
  display:none;
}
}