@import: url(styles/goblin-hole-primary-stylesheet.css);

.box {
  min-height: 300px;
  min-width: 300px;
  padding: 50px;
  background-color: transparent;
  align-items: space-evenly;
  resize: both;

  }
  
/* resized to 120p sq */

.border-120 {
  border: 30px solid, transparent;
  border-image-slice: 50 fill;
  border-image-width: 50px;
  border-image-repeat: stretch stretch;
  }

.trunc-pyramid {
  border-image-source: url(/assets/borderbutts/120/trunc-pyramid.png);
  }

.square-ruby {
  border-image-source: url(/assets/borderbutts/120/square-ruby.png)
  }

.square-grellow {
  border-image-source: url(/assets/borderbutts/120/square-grellow.png);
  }

.slime-ring {
  border-image-source: url(/assets/borderbutts/120/slime-ring.png)
  }

.slime-porthole {
  border-image-source: url(/assets/borderbutts/120/slime-porthole.png);
  }

.round-lilac {
  border-image-source: url(/assets/borderbutts/120/round-lilac.png);
  }

.round-green {
  border-image-source: url(/assets/borderbutts/120/round-green.png);
  }

.blue-screen {
  border-image-source: url(/assets/borderbutts/120/blue-screen.png);
  }

.chaos-gingh {
  border-image-source: url(/assets/borderbutts/120/chaos-gingh.png);
  border-image-repeat: round round;
  }
  
.green-platform {
  border-image-source: url(/assets/borderbutts/120/green-platform.png);
  }

.psych-porthole {
  border-image-source: url(/assets/borderbutts/120/psych-porthole.png);
  }
  
.psych-ring {
  border-image-source: url(/assets/borderbutts/120/psych-ring.png);
  }
  
.round-aqua {
  border-image-source: url(/assets/borderbutts/120/round-aqua.png);
  }
  
.round-blue {
  border-image-source: url(/assets/borderbutts/120/round-blue.png);
  }

body {
  margin: 10%;
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  flex-basis: auto;
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  flex-basis: auto;
  gap: .25em;
  background-image: 
    linear-gradient(
    to top right,
    var(--goblinseggblue),
    var(--shinygooblue),
    var(--gooblue)), 
    linear-gradient(
    120deg,
    var(--okayorange),
    var(--deadtech),
    var(--grumbleberry)), 
    linear-gradient(
    to bottom right,
    var(--isitgrey),
    var(--soapflower),
    var(--shinygooblue));
  background-repeat: no-repeat;
  background-attachment: fixed;
  background-blend-mode: hard-light;
  background-color: var(--duskycove);
  
}
