/* Transitions */

@keyframes appear
{
	0% { opacity: 0 }
	100% { opacity: 1 }
}

@-webkit-keyframes appear
{
	0% { opacity: 0 }
	100% { opacity: 1 }
}

@keyframes fade-in-out
{
	0%,100% { opacity: 0 }
	50% { opacity: 1 }
}

@-webkit-keyframes fade-in-out
{
	0%,100% { opacity: 0 }
	50% { opacity: 1 }
}

@keyframes rumble 
{
	0%, 100% {}
	50% { transform: translateY(-0.2em) }
}

@-webkit-keyframes rumble 
{
	0%, 100% {}
	50% { -webkit-transform: translateY(-0.2em) }
}

@keyframes shudder 
{
	0%, 100% {}
	50% { transform: translateX(0.2em) }
}
@-webkit-keyframes shudder 
{
	0%, 100% {}
	50% { -webkit-transform: translateX(0.2em) }
}

mark
{
	color:rgba(0,0,0,0.6);
	background-color: #ff9;
}

ins
{
	color:rgba(0,0,0,0.6);
	background-color: hsla(45,100%,90%,0.5); /* Yellowed correction fluid */
	border-radius:0.5em;
	box-shadow: 0em 0em 0.2em hsl(45,100%,80%);
	text-decoration:none;
}

del
{
	background-color: #000; /* Censored text */
	text-decoration:none;
}

/* Who am I to tell authors not to use non-standard tags? */

center
{
	text-align:center;
	margin: 0 auto;
	width: 60%;
}

blink
{
	text-decoration: none;
	animation: fade-in-out 1s steps(1,end) infinite alternate;
	-webkit-animation: fade-in-out 1s steps(1,end) infinite alternate;
}

/* Secondary text styles, for general use by Twine authors */

outline
{
	color: white;
	text-shadow: -1px -1px 0 #000, 1px -1px 0 #000, -1px 1px 0 #000, 1px 1px 0 #000;
}

shadow
{
	text-shadow: 0.08em 0.08em 0.08em #000;
}

condense
{
	letter-spacing: -0.08em;
}

expand
{
	letter-spacing: 0.1em;
}

box
{
	border: 1px solid #222;
	border-radius: 0.1em;
}

blur
{
	color:transparent;
	text-shadow: 0em 0em 0.08em #000;
}

blurrier
{
	color:transparent;
	text-shadow: 0em 0em 0.2em #000;
}

blurrier::selection {
	background-color:transparent;
	color:transparent;
}

blurrier::-moz-selection {
	background-color:transparent;
	color:transparent;
}

smear
{
	color:transparent;
	text-shadow: 0em 0em 0.02em rgba(0,0,0,0.75), -0.2em 0em 0.5em rgba(0,0,0,0.5), 0.2em 0em 0.5em rgba(0,0,0,0.5);
}

mirror
{
	display:inline-block;
	transform: scaleX(-1);
	-webkit-transform: scaleX(-1);
}

upsidedown
{
	display:inline-block;
	transform: scaleY(-1);
	-webkit-transform: scaleY(-1);
}

/* Animated effects follow */

fadein-out
{
	text-decoration: none;
	animation: fade-in-out 2s ease-in-out infinite alternate;
	-webkit-animation: fade-in-out 2s ease-in-out infinite alternate;
}

rumble 
{
	-webkit-animation: rumble linear 0.1s 0s infinite;
	animation: rumble linear 0.1s 0s infinite;
      display:inline-block;
}

shudder 
{
	-webkit-animation: shudder linear 0.1s 0s infinite;
	animation: shudder linear 0.1s 0s infinite;
      display:inline-block;
}

.modern-marquee-container {
  display: block;
  overflow: hidden;
  width: 100%;
  white-space: nowrap;
  box-sizing: border-box;
}

.modern-marquee-content {
  display: inline-block;
  padding-left: 100%;
  animation: modern-marquee-scroll 10s linear infinite;
}

@keyframes modern-marquee-scroll {
  0% { transform: translate3d(0, 0, 0); }
  100% { transform: translate3d(-100%, 0, 0); }
}
