html {
  scrollbar-color: #f83852 #6f1f4d;
  scroll-behavior: smooth;
}
body {
  background-color:#f2e5de;
  text-align:center;
  color:#6f1f4d;
  font-family: 'Bild Variable Web'; 
  font-variation-settings: 'XHGT' 0;
  list-style-position:inside;
  font-size: 200%;
  /* -webkit-font-smoothing:none; */
  margin: 0;
  padding: 0;
}
@font-face {
  src: url('DetectiveCookie-Regular.woff') format("woff"),
    url('DetectiveCookie-Regular.woff2') format("woff2");
  font-family: 'Detective Cookie';
  font-style: normal;
}
@font-face {
  src: url('BildVariableV5[XHGT,wdth,wght].woff2') format("woff2"),
    url('BildVariableV5[XHGT,wdth,wght].woff') format("woff");
  font-family: 'Bild Variable Web';
  font-style: normal;
  font-weight: 100 900;
}
@keyframes bounce {
  from {
    font-weight: 100;
    font-stretch: 100%;
  }
  to {
    font-weight:700;
    font-stretch: 77%;
  }
}
.breathe {
  animation: bounce 2s ease-out infinite alternate-reverse;
  /* font-size: 125%; */
}
h1 {
  font-weight:560;
}
a {
  color:#f83852;
  text-decoration:none;
}
a:hover {
  text-decoration:underline;
  text-decoration-thickness: 3px;
}
li {
  text-align:left;
}



small {
  font-size: 70%;
  opacity: 50%;
}
ul {
  margin: 0 auto 0 0;
  width:auto;
  display:inline-block;
  font-size: 95%;
  /* min-width: 450px; */
}

h1 {
  margin-bottom: 0;
}
h2 {
  margin-bottom: 10px;
  font-style: normal;
  font-weight: 500;
}
h3 {
  margin: 5px;
  font-style: normal;
  font-weight: 500;
}
p {
  margin-left: auto;
  margin-right: auto;
}

p.normal, .bodytext {
  max-width: 680px;
  padding-left: 20px;
  padding-right: 20px;
}
section.bodytext {
  /* width:100%; */
  margin:auto;
}
.bodytext div p {
  text-align:left;
  font-size: 100%;
}

b {
  font-weight: 550;
}




nav {
  display: flex;
  justify-content: center;

  background-color: #6f1f4d;
  color: #f2e5de;
  font-size: 80%;
  white-space: nowrap;
}
nav div {
  padding: 10px;
  flex: 0;
}
.n-quick {
  flex: 1;
  text-align: right;
}
.n-protos {
  background-image: url('grainy.png');
  background-color: #1b1b1b;
}
.n-protos a {
  color: #fff;
}
.n-wc2 {
  background-color: #73738b;
}
.n-wc2 a {
  font-family: 'Linux Libertine', 'Georgia', 'Times', 'Source Serif Pro', serif;
  color: #fff;
}
.n-quack {
  background-color: #fff;
  padding-bottom: 0;
}
.n-quack a {
  color: #000;
  font-family: "Detective Cookie";
  font-size:140%;
  /* font-family: "Verdana", "Deja Vu Sans", sans-serif; */
}
.n-rice {
  font-stretch: 90%;
  background-color: #FF6B6B;
  font-weight: 500;
}
.n-rice a {
  color: #fff;
}
.n-rice sup {
  font-size: 70%;
  font-weight: 600;
}
.n-contact {
  background-color: #6f1f4d;
  flex: 1;
  text-align: left;
  font-weight: 500;
}
.n-contact a {
  color: #f2e5de;
}
.n-contact a:hover {
  color: #f83852;
}
@media screen and (max-width: 835px) {
  nav {
    font-size: 60%;
    flex-wrap: wrap;
  }
  nav div {
    padding: 3px 30px;
    flex: 1;
  }
  .n-quick {
    text-align: center;
  }
  .n-contact {
    text-align: center;
  }
}


.home {
  text-align:left;
  /* margin: 30px auto 30px 30px; */
  margin: 30px 30px 20px;
  position:absolute;
}
.home a {
  border-radius: 67px;
  background-color: #f83852;
  display:inline-block;
  padding: 10px 20px;
  font-weight: 500;
  color: #f2e5de;
}
@media screen and (max-width: 1100px) {
  .home {
    position:relative;
  }
}


.kanji {
  margin: 0 auto;
  font-family: "M PLUS 2", sans-serif;
  font-optical-sizing: auto;
  font-style: normal;
}

section.pk {
  background-image: url('grainy.png');
  background-color: #1b1b1b;
  color: #fff;
  text-align:center;
  /* width:100%; */
}
.pk h2 {
  padding: 20px;
}
.pk h2 > mark {
  background-color: #00B35D;
  color: white;
  display: inline-block;
  padding: 0 20px 5px;
  border-radius: 30px;
  mix-blend-mode:plus-lighter;
}
.pk h2 > mark a {
  color: white;
  text-decoration: underline;
  text-decoration-thickness: 4px;
  text-underline-offset: 4px;
}
.pk h2 > mark a:hover {
  color: black;
}



.two {
  display:flex;
  flex-wrap:wrap;
}
.two > div {
  flex: 1
}
.two > div:nth-child(1) {
  text-align: center;
  /* margin-left: 20px; */
}
.two > div:nth-child(2) {
  text-align: left;
  min-width:440px;
  margin-right:20px;
  margin-left:10px;
  padding: 10px;
  display: flex;
  flex-direction:column;
  justify-content: center;
  flex-wrap:wrap;
}
.two img {
  max-height:300px;
  width:auto;
  height:auto;
  max-width:100%;
  min-width:300px;
  transition: all 0.2s ease-in-out;
}
.two img:hover {
  opacity: 80%;
}
.two p {
  margin: 5px;
}


.me-wide {
  max-height:none !important;
}
.me-narrow {
  max-height:450px !important;
  display: none;
}
@media screen and (max-width: 950px) {
  .me-wide {
    height: 300px;
    width:auto;
  }
}
@media screen and (max-width: 950px) {
  .me-wide {
    display:none;
  }
  .me-narrow {
    display:inline;
  }
  nav a:hover {
    text-decoration-thickness: 2px;
    text-underline-offset: 2px;
  }
}
/* .notallowed {
  cursor: not-allowed;
} */

.protos {
  background-image: url('grainy.png');
  background-color: #1b1b1b;
  color: #fff;
}
.protos .link {
  background-color: #ddd;
  color: #000;
  display: inline-block;
  padding: 5px 20px 5px;
  border-radius: 67px;
  mix-blend-mode:plus-lighter;
  margin: 0px 10px 10px;
  font-weight: 500;
}
.protos .link:hover {
  background-color: #7f7f7f;
}
.protos small {
  mix-blend-mode:plus-lighter;
}


.wikicamp {
  font-family: sans-serif;
  color: rgb(32, 33, 34);
  background-image: linear-gradient(180deg, #73738b 20%, #a3ccd2 100%);
  font-size: 80%;
}
.wikicamp h3 {
  font-family: 'Linux Libertine', 'Georgia', 'Times', 'Source Serif Pro', serif;
  font-size: 160%;
}
.wikicamp > div:nth-child(2) {
  background: rgba(255, 255, 255, 0.75);
  margin:20px;
  min-width:400px;
}
.wikicamp a {
  color: #0645ad;
}
.wikicamp a.wikicamp-button {
  background-image: url(https://camp2.rectangle.zone/skins/Vector/resources/skins.vector.styles.legacy/images/link-external-small-ltr-progressive.svg);
  background-position: center right;
  background-repeat: no-repeat;
  background-size: 0.857em;
  padding-right: 1em;
}
.wikicamp a:hover {
  text-decoration-thickness: initial;
}
.wikicamp a:active {
  color: #faa700;
}
.wikicamp hr {
  height: 1px;
  background-color: var(--border-color-base, #a2a9b1);
  border: 0;
  margin: 0.2em 0;
}
.wikicamp small {
  font-style:italic;
}

.wcframe-div {
  width:400px;
  height:300px;
  display:block;
  margin: 0 auto 0 auto;
  overflow-y:scroll;
  overflow-x:hidden;
  /* overflow: hidden; */
  pointer-events: none;
  scrollbar-color:initial;
  scrollbar-width: none;
  position:relative;
}
.wcframe {
  width: 1280px;
  height: 50000px;
  border: 0;
  -ms-transform: scale(0.32);
  -moz-transform: scale(0.32);
  -o-transform: scale(0.32);
  -webkit-transform: scale(0.32);
  transform: scale(0.32);
  
  -ms-transform-origin: 0 0;
  -moz-transform-origin: 0 0;
  -o-transform-origin: 0 0;
  -webkit-transform-origin: 0 0;
  transform-origin: 0 0;

  scroll-behavior: smooth;

}
.over {
  width: 400px;
  height: 0;
  position:relative;
  margin: 0 auto 0 auto;
}
.over::before {
  content: "";
  position: absolute;
  background-color: #fff0;
  z-index: 2;
  width:400px;
  height:300px;
  display:block;
  margin: 0 auto 0 auto;
  transition: all 0.2s ease-in-out;
}
.over:hover::before {
  background-color: #fff5;
}


.quack {
  background-color: #fff;
  color: #000;
  font-family: "Detective Cookie";
  font-size: 126%;
}
.quack .link {
  background-color: #4D73A2;
  color: #fff;
  display: inline-block;
  padding: 6px 18px 4px 22px;
  border-radius: 67px;
  margin: 0px 10px 10px;
  font-weight:normal !important;
}
.quack .link:hover {
  background-color: #000;
}
.quack h3 {
  font-weight: bold;
}
.quack img:hover {
  opacity: 60%;
}

.rice {
  background-color: #FF6B6B;
  color: #fff;
  font-stretch: 80%;
  font-size: 110%;
}
.rice .link {
  background-color: #fff;
  color: #FF6B6B;
  display: inline-block;
  padding: 5px 20px 5px;
  border-radius: 67px;
  margin: 0px 10px 10px;
  font-weight: 500;
}
.rice .link:hover {
  background-color: #000;
  color: #fff;
}
.rice small {
  opacity: 100%;
}
sup {
  font-size:65%;
  font-weight: 550;
}



.nowrap,
.pat {
	white-space: nowrap;
  font-weight: 500;
}
.patrons {
  font-size: 70%;
  font-style:italic;
  max-width: 700px;
  margin: 0 auto 10px;
  padding: 0 10px;
  line-height: 30px;
}

.prolific {
  display:flex;
  flex-direction:row;
  justify-content:center;
  flex-wrap:wrap;
}
.prolific > div {
  display: flex;
  flex: 1;
  flex-direction:column ;
  justify-content: center;
  margin: 10px 20px 10px;
}
.prolific img {
  width: 350px;
  display:inline-block;
  margin: 0 auto 4px;
  /* border: 0 solid #6f1f4d; */
  border-radius: 10px;
  filter:drop-shadow( 2px 2px 3px #6f1f4d55 ) contrast(1) brightness(1);
  transition: all 0.2s ease-in-out;
}
.prolific p {
  margin: 0 auto;
}
.prolific h3 {
  margin: 7px 0 0;
}
.prolific a {
  width:fit-content;
  margin: 0 auto;
}

.bfdi img:hover {
  filter:drop-shadow( 2px 2px 3px #6f1f4d55 ) contrast(1.2) brightness(1);
}
.tdbe img:hover {
  filter:drop-shadow( 2px 2px 3px #6f1f4d55 ) contrast(1) brightness(3);
}
.tdbe h3 {
  font-stretch: 60%;
}
.cc img:hover {
  filter:drop-shadow( 2px 2px 3px #6f1f4d55 ) contrast(1.7) brightness(1);
}
.brd img:hover {
  filter:drop-shadow( 2px 2px 3px #6f1f4d55 ) contrast(1.5) brightness(1);
}

.contact img {
  /* color: #f83852; */
  filter: invert(33%) sepia(56%) saturate(4804%) hue-rotate(334deg) brightness(103%) contrast(95%);
  /* thanks mrpie https://mrpie5.gitlab.io/css-filter-generator/ */
  width: 150px;
  height: 150px;
  margin:auto;
}
.contact img:hover {
  /* color: #6f1f4d; */
  filter: invert(17%) sepia(33%) saturate(2970%) hue-rotate(292deg) brightness(93%) contrast(96%);
}
.contact a {
  text-decoration: none;
}
.preferred {
  position:relative;
}
.preferred::before {
  position:absolute;
  content: "(preferred)";
  font-size: 60%;
  color: #6f1f4d;
  inset-inline-start: 42px;
  inset-block-start: 7px;
  transform: rotate(-8deg);
  font-weight: 500;
}

footer img {
  width: 20px;
  padding: 20px;
}

@media screen and (max-width: 650px) {
  .two > div:nth-child(2) {
    min-width:300px;
  }
  .wikicamp > div:nth-child(2) {
    min-width:300px;
  }
  ul {
    font-size: 5.5vw;
    margin-left: 0;
    margin-right: 0;
    padding-left: 10vw;
    min-width:initial;
  }
  .wcframe-div {
    width:300px;
    height:200px;
  }
  .wcframe {
    -ms-transform: scale(0.24);
    -moz-transform: scale(0.24);
    -o-transform: scale(0.24);
    -webkit-transform: scale(0.24);
    transform: scale(0.24);
  }
  .sticker {
    top: -1px;
    padding: 10px 20px;
    /* old  */
    position:sticky;
    display:inline-block;
    background-color: #f2e5de;
    z-index: 1;
    border-radius: 30px;
    transition: all 0.2s ease-in-out;
    filter:drop-shadow( 2px 2px 3px #6f1f4d00 );
  }
  .stacker {
    font-size: 6vw;
    padding: 10px 15px;
    margin-bottom: 0;
  }
  .sticker.stuck {
    filter:drop-shadow( 2px 2px 3px #6f1f4d55 );
  }
  .over {
    width: 300px;
  }
  .over::before {
    width:300px;
    height:200px;
  }
}
@media (min-resolution: 2x) {
  .pk, .protos, .n-protos {
    background-size: 50%
  }
}
/* @media (min-resolution: 4x) {
  .pk, .protos, .n-protos {
    background-size: 25%
  }
} */

a[href="https://camp2.rectangle.zone/wiki/User:CandiedCoder"]::after,
a[href="https://camp2.rectangle.zone/wiki/User:Alphermebo"]::after,
a[href="https://camp2.rectangle.zone/wiki/User:Bluejaaay"]::after,
a[href="https://camp2.rectangle.zone/wiki/User:CAKO"]::after,
a[href="https://camp2.rectangle.zone/wiki/User:QWillow"]::after,
a[href="https://camp2.rectangle.zone/wiki/User:Raioknight"]::after,
a[href="https://camp2.rectangle.zone/wiki/User:ThePinkHacker"]::after,
a[href="https://camp2.rectangle.zone/wiki/User:Snowphie"]::after,
a[href="https://camp2.rectangle.zone/wiki/User:ShyguyFTW_FireblastbroFTL"]::after,
a[href="https://camp2.rectangle.zone/wiki/User:Als512"]::after,
a[href="https://camp2.rectangle.zone/wiki/User:SGuySMW"]::after,
a[href="https://camp2.rectangle.zone/wiki/User:Moonlightroseslime"]::after,
a[href="https://camp2.rectangle.zone/wiki/User:GopyXP"]::after,
a[href="https://camp2.rectangle.zone/wiki/User:Scar"]::after,
a[href="https://camp2.rectangle.zone/wiki/User:Christianosc"]::after,
a[href="https://camp2.rectangle.zone/wiki/User:Ndnprct3"]::after,
a[href="https://camp2.rectangle.zone/wiki/User:Viviancherry"]::after,
a[href="https://camp2.rectangle.zone/wiki/User:PWispa"]::after,
a[href="https://camp2.rectangle.zone/wiki/User:Gunpowder"]::after,
a[href="https://camp2.rectangle.zone/wiki/User:Finkriel"]::after,
a[href="https://camp2.rectangle.zone/wiki/User:StrangelyUnknown"]::after,
a[href="https://camp2.rectangle.zone/wiki/User:DavidHolandaOne"]::after,
a[href="https://camp2.rectangle.zone/wiki/User:Orange_Pen"]::after,
a[href="https://camp2.rectangle.zone/wiki/User:EnderTheEnder"]::after,
a[href="https://camp2.rectangle.zone/wiki/User:Jacob_Fairclough"]::after,
a[href="https://camp2.rectangle.zone/wiki/User:FuzzyEpic3"]::after,
a[href="https://camp2.rectangle.zone/wiki/User:Cat_planet_cat_planet"]::after,
a[href="https://camp2.rectangle.zone/wiki/User:Flaming"]::after,
a[href="https://camp2.rectangle.zone/wiki/User:HarrowwInk"]::after,
a[href="https://camp2.rectangle.zone/wiki/User:Betamaj"]::after,
a[href="https://camp2.rectangle.zone/wiki/User:QueenOfCheetahs"]::after,
a[href="https://camp2.rectangle.zone/wiki/User:Lappisvg"]::after,
a[href="https://camp2.rectangle.zone/wiki/User:AshleyJPEG"]::after{
  background-image: url('https://rectangle.zone/subwikifiles/www/images/c/ca/Beet4s.png');
	background-size: 20px 20px;
	display: inline-block;
	width: 20px;
	height: 20px;
	vertical-align: baseline;
	content:"";
  margin-left: 0px;
  margin-right: -4px;
}