@font-face {
    font-family: 'authentic_sans90';
    src: url('authenticsans-90-webfont.woff2') format('woff2'),
         url('authenticsans-90-webfont.woff') format('woff');
    font-weight: normal;font-style: normal;}
@font-face {
    font-family: 'authentic_sanscondensed_90';
    src: url('authenticsans-condensed-90-webfont.woff2') format('woff2'),
         url('authenticsans-condensed-90-webfont.woff') format('woff');
    font-weight: normal;font-style: normal;}
button {
  background-color: rgba(136, 139, 47, 1);
  color: rgba(220, 216, 215, 1);
  border-radius: 10px;border-color: rgba(178, 135, 190, 1);}
button:hover {color: rgba(229, 169, 49, 1);}
body {
  font-family: 'authentic_sans90', sans-serif;
  font-size: 16px;
  color: rgba(220, 216, 215, 1);
  background-color: rgba(168, 165, 150, 1);
  margin: 0;padding:0;
  background-image: url("background.png");
  background-position: center;
  background-repeat: no-repeat;
  background-size: 100% 100%;
  background-attachment: fixed;}
a {color: rgba(220, 216, 215, 1);
text-decoration: none;}
.hiatus {
  background-color: grey;
  width: 100%;
  height: 100%;
  z-index: 1000;
  position: fixed;
  text-align: center;
  padding-top: 10%;
}
.back {width:25%;}
.hardlink {color: #6C5D2D;text-decoration: underline;}
.white {color: rgba(220, 216, 215, 1);
text-decoration: none;}
.condensed {font-family: 'authentic_sanscondensed_90', sans-serif;
  font-size: 14px;}
.pink {color: rgba(202, 52, 142, 1);}
.yellow {color: rgba(229, 169, 49, 1);}
#one {color: rgba(229, 169, 49, 1);cursor: pointer;}
#main, #standards, #archive, #special, #all{cursor: pointer;}
.greenbox {position: fixed;top:0;
  width: 2rem;height: 100vh;
  background-color: rgba(136, 139, 47, 1);}
.greentext {
  font-family: 'authentic_sanscondensed_90', sans-serif;
  font-size: 14px;
  writing-mode: vertical-rl;
  -webkit-writing-mode: vertical-rl;
  -ms-writing-mode: vertical-rl;
  height: 100%;
  float:left;
  padding-left: .5rem;}
.greenlink {padding-top: 1rem;}
.cart {float:left;padding-top: 2rem;}
.about {float: left;padding-top: 2rem;cursor: pointer;}
.links {float: right;padding-bottom: 1rem;cursor: pointer;}
.greybox{position: fixed;
  height: 100vh;
  background-color:rgba(131, 130, 138, 0.7);
  margin-left: 4rem;}
.title {font-family: Garamond, serif;font-size: 27px;
  color: rgba(229, 169, 49, 1);
  padding-top: 2rem;padding-left: .5rem;}
.desc {font-family: 'authentic_sanscondensed_90', sans-serif;font-size: 14px;
  padding-top: 2rem;
  padding-left: .5rem;
  padding-right: .5rem;}
.showme {padding-top: 2rem;padding-left: .5rem;}
.showmegrid1 {padding-top: 1rem;display: grid;
  grid-template-columns: repeat(1, 1fr);
  padding-left: .5rem;}
.showmegrid2 {padding-top: 0rem;margin-top:0;display: grid;
  grid-template-columns: repeat(1, 1fr);
  padding-left: .5rem;}
.allgrid {position: absolute;top: 2rem;right: 2rem;
  display: grid;grid-template-columns: repeat(2, 1fr);
  grid-gap: 2rem;width: calc(100% - 22rem);
  padding-bottom: 2rem;display: none;}
.allgrid img {display: block;width: 100%;float: right;z-index: -1;}
.oneoffsgrid {position: absolute;top: 2rem;right: 2rem;
  display: grid;grid-template-columns: repeat(2, 1fr);
  grid-gap: 2rem;width: calc(100% - 22rem);
  padding-bottom: 2rem;}
.oneoffsgrid img {display: block;width: 100%;float: right;z-index: -1;}
.altgrids {position: absolute;top: 2rem;right: 2rem;
  display: grid;grid-template-columns: repeat(2, 1fr);
  grid-gap: 2rem;width: calc(100% - 22rem);
  padding-bottom: 2rem;
  display: none;}
.altgrids img {display: block;width: 100%;float: right;z-index: -1;}
.available {position: relative;}
.sold {position: relative;}
.textbox {opacity: 0;z-index: 1;transition: .3s ease;
  position: absolute;bottom: 0;
  padding: .5rem;width: calc(100% - 1rem);
  background-color: rgba(202, 52, 142, .7)}
.price {float: left;}
.purchase {float: right;}
.soldtext {border-radius: 10px;float:right;
background-color: rgba(178, 135, 190, 1);
padding-left: 5px;padding-right: 5px;
padding-bottom: 3px; padding-top: 3px;font-family: 'authentic_sanscondensed_90', sans-serif;
font-size: 14px;}
.available:hover .textbox {opacity: 1;}
.sold:hover .textbox {opacity: 1;}
.aboutshape {width: 75vw;height: 25vh;
  position: absolute;
  top: calc(50% - 12.5vh);left: calc(12.5vw);
  border-radius: 37.5vw / 12.5vh;
  background: #B287BE;
  transform: rotate(-12deg);display:none;}
.abouttext {width: 200px; height: calc(200px - 1rem); position: absolute;
  top: calc(50% - 100px);left: calc(50% - 100px);
  color: rgba(5, 4, 9, 1);border: 1px solid #1385A2;display: none;
text-align: center;font-family: 'authentic_sanscondensed_90', sans-serif;
padding-top: 1rem;}
.loungetext {font-size: 14px;
  padding-top: 4rem;padding-left: 22rem;display: none;}
.loungegrid {font-family: 'authentic_sanscondensed_90', sans-serif;
  font-size: 14px;position: absolute;
  top: 2rem;right: 2rem;
  display: grid;grid-template-columns: repeat(2, 1fr);
  border: none;display: none;}
.loungegrid div {width: 50px;height: 50px;}
.july20 {background-color: rgba(154, 0, 0, 1);}
.august20 {background-color: rgba(116, 116, 138, 1);}
.sept20 {background-color: rgba(8, 20, 18, 1);}
.oct20 {background-color: rgba(233, 222, 217, 1);}
.nov20 {background-color: rgba(163, 159, 176, 1);}
.dec20 {background-color: rgba(210, 212, 194, 1);}
.jan21 {background-color: rgba(111, 36, 234, 1);}
.feb21 {background-color: rgba(167, 51, 15, 1);}
.march21 {background-color: rgba(180, 208, 92, 1);}
.april21 {background-color: rgba(129, 99, 75, 1);}
.may21 {background-color: rgba(193, 199, 195, 1);}

.loungelink {color: rgba(220, 216, 215, 1);text-decoration: none;}
.snipcart-checkout{
  font-family: 'authentic_sanscondensed_90', sans-serif;
  font-size: 14px;
  writing-mode: vertical-rl;
  -webkit-writing-mode: vertical-rl;
  -ms-writing-mode: vertical-rl;
  cursor: pointer;
  text-decoration: underline;}
.snipcart-items-count {
  padding-top: .5rem;cursor: pointer;
  text-decoration: underline;}

@media screen and (max-width:767px) {
  .back {width:40%;}
.snipcart-checkout{
  writing-mode: horizontal-tb;
  -webkit-writing-mode: horizontal-tb;
  -ms-writing-mode: horizontal-tb;}
.snipcart-items-count {padding-left: .5rem;}

.greybox {top: 2rem;height: auto;width: 100vw;
    margin-left: 0;z-index: 1;}
.title {padding-top: .25rem;float: left;}
.desc {padding-top: .25rem;
padding-right: .5rem;padding-left: 1rem;
float: right;font-size: 12px;
width: 40%;}
.greenbox {top: 0;height: 2rem;width: 100vw;z-index: 1;}
 .greentext {
   padding-top: .45rem;
   writing-mode: horizontal-tb;
   -webkit-writing-mode: horizontal-tb;
   -ms-writing-mode: horizontal-tb;
   width: 100%;}
.greenlink {padding-left: .5rem;}
.cart {padding-top: 0rem;}
.about {padding-top: 0rem;padding-left: 2rem;}
.links {padding-bottom: 0rem;margin-right: 1rem;}
.showme {clear: left;padding-top: 0;}
.showmegrid1 {
  padding-top: .1rem;padding-left: 0rem;padding-right: 0rem;
  margin-left: 1rem;margin-right: 1rem;
  grid-template-columns: repeat(3,1fr);
  grid-row-gap: .5rem;font-size: 14px;text-align: left;}
.showmegrid2 {
  padding-top: .1rem;margin-bottom: .1rem;
  padding-left: 0rem;padding-right: 0rem;
  margin-left: 1rem;margin-right: 1rem;
  grid-template-columns: repeat(2,1fr);
  grid-row-gap: .5rem;
  font-size: 14px;text-align: left;}
#one, #archive {text-align: left;}
#main, #special, #all {text-align: center;}
#archive {text-align: right;}
.loungegrid {
  grid-template-columns: repeat(6, 50px);
  grid-template-rows: repeat(2, 50px);
  top: 75%;right: 2rem;}
.loungelink {color: rgba(202, 52, 142, 1);}
.loungetext {text-align:center;padding-left: 1rem;padding-top: 9rem;}
.aboutshape {display:none;
  width: 90vw;height: 30vh;
  top: calc(50% - 15vh);left: 1rem;
  border-radius: 45vw / 15vh;
  background: #B287BE;transform: rotate(-15deg);}
  .abouttext {width: 200px; height: calc(200px - 1rem); position: absolute;
    top: calc(50% - 100px);left: calc(50% - 100px);
    color: rgba(5, 4, 9, 1);border: 1px solid #1385A2;display: none;
  text-align: center;font-family: 'authentic_sanscondensed_90', sans-serif;
  padding-top: 1rem;}
.oneoffsgrid {top: 10rem;left: 1rem;
  display: grid;grid-template-columns: repeat(1, 1fr);
  grid-gap: 2rem;width: calc(100vw - 2rem);
  padding-bottom: 4rem;z-index: 0;}
.altgrids {top: 10rem;left: 1rem;
  display: grid;grid-template-columns: repeat(1, 1fr);
  grid-gap: 2rem;width: calc(100vw - 2rem);
  padding-bottom: 4rem;
  z-index: 0;display: none;}
.allgrid {top: 10rem;left: 1rem;
  display: grid;grid-template-columns: repeat(1, 1fr);
  grid-gap: 2rem;width: calc(100vw - 2rem);
  padding-bottom: 4rem;
  z-index: 0;display: none;}
.textbox {opacity: 1;}
}


@media screen and (max-width:321px) {
  .desc {font-size: 10px;padding-top: .2rem;}
  .loungegrid {grid-template-columns: repeat(6, 30px);
    grid-template-rows: repeat(2, 30px);
    top: 85%; right: 22%;}
    .loungelink {font-size: 0px;width: 30px;}
   .about {padding-top: 0rem;padding-left: 1rem;}
   .showmegrid {  grid-template-columns: .75fr 1fr 1fr;}
   .loungegrid div {width: 30px; height: 30px;}


}

@media screen and (width:360px) {
  .desc {padding-top: .2rem;
  padding-right: 0;padding-left: .5rem;
  float: left;font-size: 12px;}
}
