
  @font-face { 
	font-family: "DelaGothicOne"; 
	src: url("./fonts/DelaGothicOne-Regular.ttf") format("truetype"), 
	font-weight: normal;
	font-style: normal; 
	font-display: swap; 
}

@font-face {
  font-family: "Excalibur";
  src: url("./fonts/Excalibur Nouveau.ttf") format("truetype");
  font-weight: normal;
	font-style: normal; 
	font-display: swap; 
}

@font-face {
  font-family: "MagicRetro";
  src: url("./fonts/Magic Retro.ttf") format("truetype");
  font-weight: normal;
	font-style: normal; 
	font-display: swap; 
}

@font-face {
  font-family: "FinalPixel";
  src: url("./fonts/Final-Fantasy.ttf") format("truetype");
  font-weight: normal;
	font-style: normal; 
	font-display: swap; 
}

@font-face {
  font-family: "finalf";
  src: url("./fonts/finalf.ttf") format("truetype");
  font-weight: normal;
	font-style: normal; 
	font-display: swap; 
}

@font-face {
  font-family: "Comicoro";
  src: url("./fonts/Comicoro.ttf") format("truetype");
  font-weight: normal;
	font-style: normal; 
	font-display: swap; 
}

@font-face {
  font-family: "Curvilingus";
  src: url("./fonts/Curvilingus.0tf") format("opentype");
  font-weight: normal;
	font-style: normal; 
	font-display: swap; 
}



:root {
  --berry: #F15060;
  --red: #FD733A;
  --citrus: #FEB511;
  --field: #01A95C;
  --mint: #82D8D5;
  --sea: #00838B;
  --navy: #3E5589;
  --white: #F5F0DF;
}


a:link {
  text-decoration: none;
  color:var(--navy);
  font-weight:600;
}

a:visited {
  text-decoration: none;
  color:var(--navy);
}


a.wow:link { text-decoration: none; }

a.wow::before {
transform: scaleX(0);
transform-origin: bottom right;
}

a.wow:hover::before {
transform: scaleX(1);
transform-origin: bottom left;
}

a.wow::before {
content: " ";
display: block;
position: absolute;
top: 0; right: 0; bottom: 0; left: 0;
inset: 0 0 0 0;
background:rgba(255, 242, 0, 0.3);
  border:1px solid rgba(254, 181, 17, 0.8);
z-index: 1;
transition: transform .5s ease;
}

a.wow {
position: relative;
}


.text{
  font-size:1em;
}

.text:link { text-decoration: none; }

.text::before {
transform: scaleX(0);
transform-origin: bottom right;
}

.text:hover::before {
transform: scaleX(1);
transform-origin: bottom left;
}

.text::before {

content: " ";
display: block;
position: absolute;
top: 0; right: 0; bottom: 0; left: 0;
inset: 0 0 0 0;
background-color:rgba(255, 242, 0, 0.3);
  border:1px solid rgba(254, 181, 17, 0.8);
z-index: -1;
transition: transform .5s ease;
}

.text {
position: relative;
}   


.column {
  float: left;
  width: 25%;
}

/* Clear floats after the columns */
.row:after {
  content: "";
  display: table;
  clear: both;
}

figure{margin:0}.tmblr-iframe{position:absolute;max-width:70%;}.tmblr-iframe.hide{display:none}.tmblr-iframe--amp-cta-button{bottom:10px;left:50%;position:fixed;transform:translateX(-50%);visibility:hidden;z-index:100}.tmblr-iframe--amp-cta-button.tmblr-iframe--loaded{animation:iframe-app-cta-transition .2s ease-out;visibility:hidden}

.tumblr_body .tumblr_post tumblr_text_post{
  width:340px;
}

.tumblr_posts{
  max-width:340px;
}

post_media_photo image{
  max-width: 100%;
  height: auto;
}

b{
  font-weight:700;
  color: black;
  text-shadow: -1px 0 white, 0 1px white, 1px 0 black, 0 -1px white, 2px 2px 1px rgba(90,255,255,0.5), 2px -1px 1px rgba(225,0,255,0.5), -2px -2px 1px rgba(255,255,0,0.5);
}

i{
  font-weight:600;
  font-style: oblique;
  color: var(--red);
}


strong {
  font-weight:600;
  color: var(--);
}


em {
  font-weight:600;
  color: var(--);
}

mark {
}

small {
}

del {
}

ins {
}

sub {
}

sup {
}



.swatch {
  line-height:25px;
  width:175px;
  height:22px;
  text-align:center;
  padding:4px 0px 4px 0px;
  font-weight:600;
  border-radius:4px;
  border:1px solid black;
  box-shadow: inset 2px -1px 1px 1px rgba(90,255,255,0.3), inset -1px 1px 1px 1px rgba(255, 0, 255,0.3), inset -1px -1px 1px 1px rgba(255, 255, 0, 0.3), 1px -1px 1px 1px rgba(90,255,255,0.3), -1px 1px 1px 1px rgba(255, 0, 255,0.3), -1px -1px 1px 1px rgba(255, 255, 0, 0.3);
  }
  
  .grow {
      transition-duration: 0.5s;
      transition-property: scale;
   }
   
  .grow:hover {
      scale: 1.2;
      image-rendering: pixelated;
      transition-duration: 0.5s;
      transition-property: scale;
   }




.text{
  font-size:1em;
}

.text:link { text-decoration: none; }

.text::before {
transform: scaleX(0);
transform-origin: bottom right;
}

.text:hover::before {
transform: scaleX(1);
transform-origin: bottom left;
}

.text::before {

content: " ";
display: block;
position: absolute;
top: 0; right: 0; bottom: 0; left: 0;
inset: 0 0 0 0;
background: #FD733A;
z-index: -1;
transition: transform .5s ease;
}

.text {
position: relative;
}   


 .face {
  line-height:25px;
  background-color: var(--white);
  width:175px;
  height:22px;
  text-align:center;
  font-size:22px;
  padding:4px 0px 4px 0px;
  margin:5px 5px 5px; 5px;
  border-radius:4px;
  border:1px solid black;
  box-shadow: inset 2px -1px 1px 1px rgba(90,255,255,0.3), inset -1px 1px 1px 1px rgba(255, 0, 255,0.3), inset -1px -1px 1px 1px rgba(255, 255, 0, 0.3), 1px -1px 1px 1px rgba(90,255,255,0.3), -1px 1px 1px 1px rgba(255, 0, 255,0.3), -1px -1px 1px 1px rgba(255, 255, 0, 0.3);
  }


  h1{
	color: var(--white);
	font-family: Curvilingus;
	font-size:60px;
	font-weight:600;
	text-shadow: 2px 2px 2px rgba(90,255,255,0.3), 2px -2px 2px rgba(225,0,255,0.3), -2px -2px 2px rgba(255,255,0,0.3),
	-1px 0 black, 0 1px black, 1px 0 black, 
	0 -1px black, 1px 2px 0px #F15060, 2px 3px 0px #F15060, 3px 4px 0px #F15060, 4px 5px 0px #FD733A, 5px 6px 0px #FD733A, 6px 7px 0px #FD733A, 7px 8px 0px #FEB511, 8px 9px 0px #FEB511, 9px 10px 0px #FEB511;
}

h2{
	color: var(--white);
	font-family: Excalibur;
	font-size:38px;
	font-variant:small-caps;
	background-color:var(--red);
	border-radius:4px;
	text-shadow: -1px 0 black, 0 1px black, 1px 0 black, 0 -1px black, 1px 2px 2px rgba(90,255,255,0.3), 1px -2px 2px rgba(225,0,255,0.3), -2px -1px 2px rgba(255,255,0,0.3);
	box-shadow: 1px 2px 0px #F15060, 2px 3px 0px #F15060, 3px 4px 0px #F15060, 4px 5px 0px #FD733A, 5px 6px 0px #FD733A, 6px 7px 0px #FD733A, 7px 8px 0px #FEB511, 8px 9px 0px #FEB511, 9px 10px 0px #FEB511, 10px 11px 0px #FEB511;
	margin-bottom:-10px;
}

h3{
	color: var(--red);
	font-family: Excalibur;
	font-size:34px;
	font-variant:small-caps;
	text-shadow: -1px 0 black, 0 1px black, 1px 0 black, 0 -1px black, 2px 2px 2px rgba(90,255,255,0.3), 2px -2px 2px rgba(225,0,255,0.3), -2px -2px 2px rgba(255,255,0,0.3);
	border-bottom: 2px solid black;
	margin-bottom:10px;
}
h4{
	color: black;
	font-family: Excalibur;
	margin-top:12px;
	margin-bottom:2px;
	font-size: 26px;
	text-shadow:1px 1px 1px rgba(90,255,255,0.3), 1px -1px 1px rgba(225,0,255,0.3), -1px -1px 1px rgba(255,255,0,0.3);
}
h5 {
	font-size: 1.1em;
}
code {
  color:black;
	margin-left: 0.5em;
	line-height:23px;
	text-shadow:1px 1px 1px rgba(90,255,255,0.4), 1px -1px 1px rgba(225,0,255,0.4), -1px -1px 1px rgba(255,255,0,0.4);
	background-color: rgba(254, 181, 17, 0.2);
	font-family: "Courier", monospace;
	border:1px solid rgba(254, 181, 17, 0.8)
}
pre {
	max-width: 100%;
}
textarea {
	width: calc(100% - 1em);
	padding: 0.4em;
	min-height: 100px;
}


blockquote {
	background-color: var(--white);
	border-radius: 40px;
	color: black;
	font-weight:600;
	font-style: oblique;
	text-shadow:1px 1px 1px rgba(90,255,255,0.3), 1px -1px 1px rgba(225,0,255,0.3), -1px -1px 1px rgba(255,255,0,0.3);
	padding: 30px;
	position: relative;
	box-shadow:-2px 0 black, 0 2px black, 2px 0 black, 0 -2px black, inset 2px -2px 1px 1px rgba(90,255,255,0.3), inset -2px 2px 1px 1px rgba(255, 0, 255,0.3), inset -2px -2px 1px 1px rgba(255, 255, 0, 0.3), 2px -2px 1px 1px rgba(90,255,255,0.3), -2px 2px 1px 1px rgba(255, 0, 255,0.3), -2px -2px 1px 1px rgba(255, 255, 0, 0.3);
}

blockquote:before {
  content: "";
  width: 0px;
  height: 0px;
  position: absolute;
  border-left: 24px solid  var(--white);
  border-right: 12px solid transparent;
  border-top: 12px solid  var(--white);
  border-bottom: 20px solid transparent;
  left: 32px;
  bottom: -24px;
 
}


table {
	min-width: calc(100% - 1em);
	border: 1px solid #292929;
}
	th {
		background-color: #e7b46c;
	}
	tr:nth-child(2n){
		background-color: #f0d68d;
	}
details {
	background-color: #c1d09f;
	padding: 0.4em;
	border-radius: 16px;
	border: 1px solid #434343;
}

hr { border: 0px; height: 9px; background-image: url("img/bg_divider.png"); background-repeat: repeat-x; display: block; }

button {
  background-color: var(--white);
  border: none;
  color: black;
  text-shadow:1px 1px 1px rgba(90,255,255,0.3), 1px -1px 1px rgba(225,0,255,0.3), -1px -1px 1px rgba(255,255,0,0.3);
  text-align: center;
  font-weight:500;
  border: 1px double var(--berry);
  border-radius:40%;
  text-decoration: none;
  padding: 4px;
  display: inline-block;
  font-size: 16px;
  margin: 4px 2px;
  cursor: pointer;
}

button:hover {
  position:relative;
  opacity: 1;
  font-weight:500;
  font-style: italic;
  border: 1px solid var(--berry);
}

 .info{
width:100%;
padding:4px 7px 4px 7px;
border-radius:5px;
border:1px solid black;
font-variant:small-caps;
font-weight:600;
font-size:17px;
line-height:36px;
box-shadow: inset 2px -1px 1px 1px rgba(90,255,255,0.3), inset -1px 1px 1px 1px rgba(255, 0, 255,0.3), inset -1px -1px 1px 1px rgba(255, 255, 0, 0.3), 1px -1px 1px 1px rgba(90,255,255,0.3), -1px 1px 1px 1px rgba(255, 0, 255,0.3), -1px -1px 1px 1px rgba(255, 255, 0, 0.3);
}







.halftone {
  --mask: linear-gradient(rgb(0 0 0), rgb(0 0 0 / 0.5));
  --stop1: 3%;
  --stop2: 90%;
  
  aspect-ratio: 1;
  position: relative;
  background: white;
  filter: contrast(50);
}

.halftone::after {
  content: '';
  position: absolute;
  inset: 0;
  background-image: radial-gradient(circle at center, black var(--stop1), transparent var(--stop2));
  background-size: 1rem 1rem;
  background-repeat: round;
  background-position: center;
  mask-image: var(--mask);
}

.halftone:nth-child(even)::after {
  --bgSize: 1.4rem;
  --bgPosition: calc(var(--bgSize) / 2);
  --stop1: 3%;
  --stop2: 65%;
  
  background-image: radial-gradient(circle at center, black var(--stop1), transparent var(--stop2)), radial-gradient(circle at center, black var(--stop1), transparent var(--stop2));
  background-size: var(--bgSize) var(--bgSize);
  background-position: 0 0, var(--bgPosition) var(--bgPosition);
}
