This page contains a collection of all the CSS themes for my game's pages. It gets asked, so I'm sharing them all.
You are free to use these however you will, in as much of a messy state as some of these are...
I will be updating this page regularly whenever I customize a page and feel like it would be of interest.

Here they are...

SHARED_ANXIETIES_WITH_A_FRIEND...


This is a simple theme.
It strips out all elements from the page EXCEPT for the user description (the description about your game that you input when you're uploading), the title (header), and the download button.
Cursor is a giant mouse.
All elements are animated, including the 'download' pop up.
It features an element that is floating left to right (in this page's case a goldfish, if you download the themes the goldfish is provided in the 'images' folder).
The floating pet is ONE of the screenshots. You can upload only one, and it uses that as an animated element. I advise that you upload only one because that's how this theme is built.
The uploaded background is scaled to full size of the page. If you don't like this theme, but would like to know how to make the background scale the size of the page, you can use that much.


@import url('https://fonts.googleapis.com/css?family=Gaegu');

	body *{

	  background-size:100% 100%;

	  cursor: url('https://img.itch.zone/aW1nLzI2MTAyMzkucG5n/original/NE6WT6.png'), auto;

	}

	/*the point is to hide everything on the page, but hiding this might be a bad idea...*/
	.user_tools *{
	 visibility: hidden;
	}

	h2, .header, .page_widget{

	font-family: 'Gaegu', Verdana, Geneva, sans-serif;

	  color: white;

	  font-size: 20px;

	  text-shadow:
	   -1px -1px 0 #00E0EF,  
	    1px -1px 0 #00E0EF,
	    -1px 1px 0 #14A1AD,
	     1px 1px 0 #14A1AD;
	}

	/*header is footer :D*/
	.header{
	  position: fixed;
	  bottom: 40px;

	  left: 20%;

	  pointer-events: none;
	  background:none;

	  font-family: 'Gaegu', Verdana, Geneva, sans-serif;

	  font-size: 20px;

	animation: floating 1.5s linear infinite;
	}

	.user_formatted *{
	  position: fixed;
	  margin-left: 50%;
	  margin-right: 5%;

	  font-size: 25px;

	  animation: floating 1s linear infinite;

	}

	/*turn footer upside down*/
	.footer *{
	  font-size: 14px;
	  color: white;
	  background:none;
	  transform: rotate(180deg);
	}

	/*the buy game pop-up window*/
	.buy_game_lightbox_widget, .lightbox_widget, .buy_lightbox *{
	  background: #00E0EF;
	  color: white;
	  cursor: auto;
	  animation: floating 10s linear infinite;
	}

	.download_links:hover{
	  animation: floating .5s linear infinite;
	}

	.add_btn *{
	  background: none;
	}

	.submit_buttons *{
	  background: none;
	}

	.game_info_panel_widget, .more_information_toggle, .uploads{
	  visibility: hidden;
	  background:none;
	}

	.header_buy_row {
	  visibility: hidden;
	  background:none;
	}

	#download{
	  visibility: hidden;
	}

	/*only the download now button is visible and it's centered + hovering...*/
	.buy_row {
	  position: fixed;
	  left: 50%;
	  top: 50%;
	  min-width: 500px;
	  background:none;
	}

	.buy_message{
	  background:none;
	  visibility: hidden;
	}

	.buy_btn {
	  animation:button_spin 2000ms linear infinite;
	  background:none;
	}

	.action_btn *{
		font-size: 20px;
		background:none;
	}

	/*scrolling fish*/
	.right_col *{
	  position: absolute;
	  right: 100%;
	  width: 100%;
	  top: 40%;
	}
	.screenshot_list *{
	  animation: swim 10s linear infinite;
	}

	/*  CSS ANIMATIONS  */

	/*animation:spin 4s linear infinite;*/
	@keyframes button_spin { 
	   from{
	   transform: rotate(0deg) scale(2);
	  }to { 
	   transform: rotate(360deg) scale(2); 
	  }
	}

	@keyframes swim {
	  0% { right: 0; }
	  100% { right: -250%; }
	}

	@keyframes floating {
	    from { transform: translate(0,  0px); }
	    50%  { transform: translate(0, 10px); }
	    to   { transform: translate(0, -0px); }    
	}
	


Electric Zine Maker


banner text has interesting styling and animation
background is huge and animated to float behind everything
download now moves
cute frame around images



@import url('https://fonts.googleapis.com/css?family=Acme|Luckiest+Guy|Patrick+Hand');

.header{
	font-family: 'Luckiest Guy', sans-serif;
	font-size: 30pt;
	color: white;
	background-image: url('https://img.itch.zone/aW1nLzIwOTc1MDQucG5n/original/tpmuvL.png');
	background-color: #FF00FF;
	-webkit-text-fill-color: transparent;
	-webkit-background-clip: text;
	animation: anim_back 10s linear infinite;
}

.left_col, .column{
	font-size: 20pt;
	color: white;
}

.main{
	cursor: url('https://img.itch.zone/aW1nLzIwOTc1MDcuZ2lm/original/AbaFUs.gif') 25 25, auto;
	background-image:url('https://img.itch.zone/aW1nLzE3Mjg1MjAucG5n/original/F0P8fx.png');
	background-size: 1000% 1000%;
	animation: anim_back 30s linear infinite;
}

.wrapper{
	background-color:black;
}

.left_col *{
	font-family: 'Acme', sans-serif;
	font-size: 35px;
	color: #FFC753;
	animation: rotation 5s ease-out alternate infinite;
}

.game_comments_widget *{
	font-size: 20px;
}

.user_formatted *{
	font-family: 'Patrick Hand', sans-serif;
	font-size: 40px;
	color: #FFC753;
	
	background: linear-gradient(to right, #49FE79 5%, #FFF200 20%, #FF9AFF 40%, #49FE79 80%);
	background-size: 200% auto;

	color: #000;
	background-clip: text;
	text-fill-color: transparent;
	-webkit-background-clip: text;
	-webkit-text-fill-color: transparent;
	
	animation: rotation 1s ease-out alternate infinite;
}


.main img{
	border: 10px solid;  
	border-image:   url('https://img.itch.zone/aW1nLzE1Mzg0MDcuZ2lm/original/2AkSWw.gif');
	border-image-slice: 4;
	border-image-repeat: round;
	background-color: rgba(0, 0, 0, .7);

	animation: rotation 1s ease-out alternate infinite;
}

.buy_btn {
	animation:button_spin 1s ease-out infinite;
	background:none;
}

a:hover{
	animation: an_shake .2s linear infinite;
}

/*.game_comments_widget:hover{
	animation: an_shake .05s linear infinite;
}*/

.more_information_toggle:hover{
	animation: an_shake .2s linear infinite;
}

.main img:hover{
	animation: an_shake .2s linear infinite;
}

.download_links:hover{
	animation: an_shake .2s linear infinite;
}

/*animations*/

@keyframes button_spin { 
  0% { 
   transform: rotate(0deg) scale(1.2);
  } 20% { 
   transform: rotate(6deg) scale(1); 
  } 50% {
   transform: rotate(0deg) scale(1.2);
  } 80% {
   transform: rotate(-6deg) scale(1);
  } 100% {
   transform: rotate(0deg) scale(1.2);
  }
}

@keyframes anim_back{ 
  0% {
    background-position: 0% 50%;
  }
  50% {
    background-position: 100% 50%;
  }
  100% {
    background-position: 0% 50%;
  }
}

@keyframes an_shake {
    0% { transform: translate(1px, 1px) rotate(0deg); }
    10% { transform: translate(-1px, -2px) rotate(-1deg); }
    20% { transform: translate(-3px, 0px) rotate(1deg); }
    30% { transform: translate(3px, 2px) rotate(0deg); }
    40% { transform: translate(1px, -1px) rotate(1deg); }
    50% { transform: translate(-1px, 2px) rotate(-1deg); }
    60% { transform: translate(-3px, 1px) rotate(0deg); }
    70% { transform: translate(3px, 1px) rotate(-1deg); }
    80% { transform: translate(-1px, -1px) rotate(1deg); }
    90% { transform: translate(1px, 2px) rotate(0deg); }
    100% { transform: translate(1px, -2px) rotate(-1deg); }
}

@keyframes rotation {
  0% {
	transform: rotate(-.7deg);
  } 100% {
	transform: rotate(.7deg);
  }
}


A_DESKTOP_LOVE_STORY


links have an interesting hover effect
devlog is also themed
page is animated
heart cursor

@import url('https://fonts.googleapis.com/css?family=Staatliches|ZCOOL+KuaiLe');

body *{

  cursor: url('https://img.itch.zone/aW1nLzE3Mjg1NzMuZ2lm/original/n%2F1tD%2F.gif'), auto;

}

a{
  cursor: url('https://img.itch.zone/aW1nLzE3Mjg1NzQuZ2lm/original/YkTbnU.gif'), auto;
}

img:hover{
  cursor: url('https://img.itch.zone/aW1nLzE3Mjg1NzQuZ2lm/original/YkTbnU.gif'), auto;
}

/*.main img:hover{
  -webkit-mask-image: url('https://img.itch.zone/aW1nLzE3Mjg1ODIuZ2lm/original/HVs0bU.gif');
  mask-image: url('https://img.itch.zone/aW1nLzE3Mjg1ODIuZ2lm/original/HVs0bU.gif');
  -webkit-mask-size: 2000px 1500px;
  mask-size: 2000px 1500px;
}*/

.main img{
	 animation: an_shake 7s linear infinite; 
}

.column, .game_devlog_post_page{
  font-family: 'Staatliches', monospace;
  font-size: 30px;

  color: white;

  text-shadow:
		-1px -1px 0 #000,
		1px -1px 0 #FF33FF,
		-1px 1px 0 #000,
		1px 1px 0 #6600FF;

}

/*devlog*/
.split_columns{
  display: inline;
  background: #FDAEDD;
  padding: 20px;

  font-size: 35px;

  text-shadow:
		-1px -1px 0 #000,
		1px -1px 0 #000,
		-1px 1px 0 #000,
		1px 1px 0 #000;
}

a, h2{
  display: inline;
  background-image:url('https://img.itch.zone/aW1nLzE3Mjg0NTAucG5n/original/%2B%2BA8XY.png');
  background-color: rgba(255, 255, 255, 0);
  animation: anim_back .8s linear infinite;
}

.formatted_description{
  font-family: 'Staatliches', monospace;
  font-size: 40px;
  color: white;

  -webkit-text-stroke-width: 1px;
  -webkit-text-stroke-color: black;
}

.header{

  padding: 40px;

  font-family: 'ZCOOL KuaiLe', monospace;
  font-size: 30px;
  color: #FFD5EC;

  /*background-image:url('https://img.itch.zone/aW1nLzE3Mjg0NTAucG5n/original/%2B%2BA8XY.png');*/

  /*background-image:url('https://img.itch.zone/aW1nLzE3Mjg0NzIucG5n/original/syButB.png');*/

  background-image: url('https://img.itch.zone/aW1nLzE3Mjg0NjcucG5n/original/7HWtvF.png');

-webkit-text-fill-color: transparent;

-webkit-background-clip: text;

  animation: anim_back 5s ease infinite;

}

#inner_column{
  background-image:url('https://img.itch.zone/aW1nLzE3Mjg0NTMucG5n/original/8xq4RN.png');

background-size: 200% 100%;

  animation: anim_back 10s ease infinite;

}

.wrapper{

  /*background-image:url('https://img.itch.zone/aW1nLzE3Mjg0NTAucG5n/original/%2B%2BA8XY.png');*/

  background-image:url('https://img.itch.zone/aW1nLzE3Mjg1MjAucG5n/original/F0P8fx.png');

  /*background-image:url('https://img.itch.zone/aW1nLzE3Mjg1MjQucG5n/original/WpS%2BHd.png');*/

  /*background: linear-gradient(124deg, #FF00FF, #FFCCFF, #FF0099, #9999FF, #FF9999, #66CCFF, #FFCCCC, #FF33FF, #FF00FF);*/

  /*background-size: 1800% 1800%;*/

  background-color: #FCC5FE;
/*#FF00FF;*/

  animation: anim_back 10s ease infinite;

}

.input_row *{
  background: black;
  font-size: 20px;
}

.buy_btn {
  animation:button_spin 1.3s ease-out infinite;
  background:none;
}

.buy_btn:hover{
  cursor: url('https://img.itch.zone/aW1nLzE3Mjg1NzQuZ2lm/original/YkTbnU.gif'), auto;
}

.download_links:hover{
  animation: an_shake .1s linear infinite;
}

/*animations*/

@keyframes anim_back{ 
  0% {
    background-position: 0% 50%;
  }
  50% {
    background-position: 100% 50%;
  }
  100% {
    background-position: 0% 50%;
  }
}

/*animation:spin 4s linear infinite;*/
@keyframes button_spin { 
  0% { 
   transform: rotate(0deg) scale(1);
  } 20% { 
   transform: rotate(6deg) scale(1.5); 
  } 50% {
   transform: rotate(0deg) scale(1);
  } 80% {
   transform: rotate(-6deg) scale(1.5);
  } 100% {
   transform: rotate(0deg) scale(1);
  }
}

@keyframes an_shake {
    0% { transform: translate(1px, 1px) rotate(0deg); }
    10% { transform: translate(-1px, -2px) rotate(-1deg); }
    20% { transform: translate(-3px, 0px) rotate(1deg); }
    30% { transform: translate(3px, 2px) rotate(0deg); }
    40% { transform: translate(1px, -1px) rotate(1deg); }
    50% { transform: translate(-1px, 2px) rotate(-1deg); }
    60% { transform: translate(-3px, 1px) rotate(0deg); }
    70% { transform: translate(3px, 1px) rotate(-1deg); }
    80% { transform: translate(-1px, -1px) rotate(1deg); }
    90% { transform: translate(1px, 2px) rotate(0deg); }
    100% { transform: translate(1px, -2px) rotate(-1deg); }
}


Everything is going to be OK



header is placed as a footer, for the fire effect
all elements move
background animated fade




@import url('https://fonts.googleapis.com/css?family=Barrio');
@import url('https://fonts.googleapis.com/css?family=Life+Savers');

/* messy css written in a very very tiny css field. it's so cute. it's just a baby. */

.inner_column{
  padding: 50px;
  border: 3px solid;
  padding: 15px;    
  border-image: url('https://img.itch.zone/aW1nLzEyMTMwNjguZ2lm/original/Fr0DPe.gif');
  border-image-slice: 4;
  border-image-repeat: round;
  background-color: rgba(0, 0, 0, .7);

  box-shadow: 30px 30px 0px black;
}

.main p, h2{
  display: inline;
  background: black;
}

.user_formatted *{
  display: inline;
  background: black;
}

.wrapper{
  animation: colorloop 5s infinite;
}

.main *{
  font-family: 'Life Savers';
  text-shadow: 1.2px 1px #FF00FF;
}

.screenshot{
  animation: rotation 0.5s ease-out alternate infinite;
  border: 3px solid;
  border-image: url('https://img.itch.zone/aW1nLzEyMTMwNjguZ2lm/original/Fr0DPe.gif');
  border-image-slice: 4;
  border-image-repeat: round;
}

.main a {
  font-family: 'Barrio';
  color: black;
  display: inline;
  background: black;
  animation: colorloop 2s infinite;
}

.columns{
  animation: rotation_subtle 1s ease-out alternate infinite;
}

.buy_row, .more_information_toggle, .header_buy_row, .game_comments_widget{
  animation: floating 5s infinite;
}

.game_devlog{
  animation: floating 2s infinite;
}

.uploads{
  animation: floating 1s infinite;
}

.header{
  position: fixed;
  bottom:0;
  left:0;
  z-index: 10;
  pointer-events: none;
}

@keyframes colorloop {
  0% { background-color: #FF00FF; }
  20% { background-color: #FF99FF; }
  40% { background-color: #CC00FF; }
  60% { background-color: #CC99FF; }
  80% { background-color: #9900FF; }
  100% { background-color: #FF00FF; }
}

@keyframes rotation {
  0% {
	transform: rotate(-.7deg);
  } 100% {
	transform: rotate(.7deg);
  }
}

@keyframes rotation_subtle {
  0% {
	transform: rotate(-.02deg);
  } 100% {
	transform: rotate(.02deg);
  }
}

@keyframes floating {
    from { transform: translate(0,  0px); }
    50%  { transform: translate(0, 20px); }
    to   { transform: translate(0, 0px); }    
}


Cyberpet Graveyard



everything on the page is gone except for download now
the description text is used as a header (skull)
banner is footer
the download now page is themed really cute
not ideal, but great for a one-off type page




@import url('https://fonts.googleapis.com/css?family=Gaegu');

body *{
	
  /*background: url("https://img.itch.zone/aW1nLzEzNDEzNjEuZ2lm/original/i5bndv.gif") no-repeat center center fixed;*/
  /*background: url("https://img.itch.zone/aW1nLzEzNDUwOTUuZ2lm/original/VUP4aw.gif") no-repeat center center fixed;*/
  /*background: url("https://img.itch.zone/aW1nLzEzNDUwOTcuZ2lm/original/Lms%2FVl.gif") no-repeat center center fixed;*/
  background: url("https://img.itch.zone/aW1nLzEzNDUxMDYuZ2lm/original/cMeE6q.gif") no-repeat center center fixed;

  background-size: cover;
  background-color: black;

  cursor: url('https://img.itch.zone/aW1nLzEzNDMyOTYuZ2lm/original/qiGtZ%2F.gif'), auto;
  
  font-family: 'Gaegu', Verdana, Geneva, sans-serif;
  font-size: 40px;

  color:white;

  text-shadow:
   -1px -1px 0 #FF3DB7,  
    1px -1px 0 #FF3DB7,
    -1px 1px 0 #FF3DB7,
     1px 1px 0 #FF3DB7;
}

.right_col *{
  visibility: hidden;
  background:none;
}

.header{
  position: fixed;
  bottom: 0px;
  right: 0px;
  pointer-events: none;
  background:none;
}

.footer *{
  font-size: 20px;
  color: white;
  background:none;
}

.buy_game_lightbox_widget, .lightbox_widget, .buy_lightbox *{
  background: #FF99CC;
  color: white;
}

.add_btn *{
  background: none;
}

.submit_buttons *{
  background: none;
}

.main h2, p, img{
  background:none;
}

.game_info_panel_widget, .more_information_toggle, .uploads{
  visibility: hidden;
  background:none;
}

.header_buy_row {
  visibility: hidden;
  background:none;
}

.user_formatted *{
  position:fixed;
  top: 0px;
  left: 0px;
  background:none;
  pointer-events: none;
}

#download{
  visibility: hidden;
}

.buy_row {
  position: fixed;
  left: 50%;
  top: 50%;
  min-width: 500px;
  background:none;
}

.buy_row *{
  background:none;
}

.buy_btn {
  animation:button_spin 1.3s ease-out infinite;
  background:none;
}

.buy_message{
  background:none;
  visibility: hidden;
}

.action_btn *{
	font-size: 20px;
	background:none;
}

.user_tools *{
	background:none;
}

/*animation:spin 4s linear infinite;*/
@keyframes button_spin { 
  0% { 
   transform: rotate(0deg) scale(1.5);
  } 20% { 
   transform: rotate(6deg) scale(2); 
  } 50% {
   transform: rotate(0deg) scale(1.5);
  } 80% {
   transform: rotate(-6deg) scale(2);
  } 100% {
   transform: rotate(0deg) scale(1.5);
  }
}


Electric File Monitor



mask effect for description that is an animated rainbow
buy now shakes
mouse over shakes
comments shake on over



@import url('https://fonts.googleapis.com/css?family=Patua+One|Purple+Purse|Zilla+Slab+Highlight');

body *{
	
  /*background: url("https://img.itch.zone/aW1nLzE1Mzg0MDcuZ2lm/original/2AkSWw.gif") no-repeat center center fixed;*/

/*https://img.itch.zone/aW1nLzE1Mzg0MTEuZ2lm/original/1S%2FJXu.gif*/

  background-size: cover;
  /*background-color: black;*/

  cursor: url('https://img.itch.zone/aW1nLzEzNDMyOTYuZ2lm/original/qiGtZ%2F.gif'), auto;

}

.main *{
  font-size: 22px;
  color: #ACADDE;
font-family: 'Patua One', "Lucida Sans Unicode", "Lucida Grande", sans-serif;
}

.main a{
  color: #FF74C2;
}

.main a:hover{
  animation: an_shake .2s linear infinite;
}

#view_game_footer a{
  color: #FF74C2;
}

.header:hover{
  animation: an_shake .2s linear infinite;
}

.header *{

  font-size: 75px;

font-family: 'Purple Purse', "Lucida Sans Unicode", "Lucida Grande", sans-serif;

  text-shadow: -2px 0 #FF71C8, 0 2px #FFC753, 2px 0 #FF71C8, 0 -2px #FFC753;

  background: linear-gradient(to right, #FFC753 20%, #FF71C8 40%, #ABAEDF 60%, #FFC753 80%);
  background-size: 200% auto;

  color: #000;
  background-clip: text;
  text-fill-color: transparent;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;

}

.main img{
border: 10px solid;  
border-image:   url('https://img.itch.zone/aW1nLzE1Mzg0MDcuZ2lm/original/2AkSWw.gif');
border-image-slice: 4;
border-image-repeat: round;
background-color: rgba(0, 0, 0, .7);

}

.main img:hover{
  animation: an_shake .2s linear infinite;
}

.user_formatted *{
  font-family: 'Zilla Slab Highlight', "Lucida Sans Unicode", "Lucida Grande", sans-serif;

  font-size: 35px;
  color: #FFC753;

  padding: 10px;

  background: linear-gradient(to right, #FFC753 20%, #FF71C8 40%, #ABAEDF 60%, #FFC753 80%);
  background-size: 200% auto;

  color: #000;
  background-clip: text;
  text-fill-color: transparent;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;

  animation: an_glow 3s linear infinite;

}

.more_information_toggle:hover{
  animation: an_shake .2s linear infinite;
}

.buy_btn{
  animation: an_shake .5s linear infinite;
}

.game_comments_widget:hover{
  animation: an_shake .05s linear infinite;
}

.lightbox_widget *{
  cursor: auto;
}

.download_links:hover{
  animation: an_shake .1s linear infinite;
}

@keyframes an_glow {
  to {
  background-position: 200% center;
  }
}

@keyframes an_shake {
    0% { transform: translate(1px, 1px) rotate(0deg); }
    10% { transform: translate(-1px, -2px) rotate(-1deg); }
    20% { transform: translate(-3px, 0px) rotate(1deg); }
    30% { transform: translate(3px, 2px) rotate(0deg); }
    40% { transform: translate(1px, -1px) rotate(1deg); }
    50% { transform: translate(-1px, 2px) rotate(-1deg); }
    60% { transform: translate(-3px, 1px) rotate(0deg); }
    70% { transform: translate(3px, 1px) rotate(-1deg); }
    80% { transform: translate(-1px, -1px) rotate(1deg); }
    90% { transform: translate(1px, 2px) rotate(0deg); }
    100% { transform: translate(1px, -2px) rotate(-1deg); }
}


ARMAGAD


banner is footer (monkey)
comments are weirdly animated to discourage leaving comments
things move, strange theme, but fun
download now window looks cool



@import url('https://fonts.googleapis.com/css?family=Bangers|Bowlby+One+SC|Luckiest+Guy');

*{
  cursor: url('https://img.itch.zone/aW1nLzEyNDQxOTgucG5n/original/%2BJCV33.png'), auto;
}

.main {
  animation:colors_back 5s infinite;
}

.game_page_primary_column *{
   /*animation:anim2 5s infinite;*/
}

/*.page_widget, .header_buy_row *{
  animation:anim2 10s infinite;
}*/

#inner_column *{
  
  /*text outlines*/
  color: white;
  text-shadow:
   -1px -1px 0 #000,  
    1px -1px 0 #000,
    -1px 1px 0 #000,
     1px 1px 0 #000;

}

.community_post_form_widget, .community_post *{

  color: white;
  font-size: 40px;
  
  text-shadow:
   -1px -1px 0 black,  
    1px -1px 0 black,
    -1px 1px 0 black,
     1px 1px 0 black;

  display: inline;
  background: black;

}

.community_post_form_widget, .game_comments_widget *{
  animation:anim1 5s infinite;
}

.right_col *{
  animation:anim3 1s infinite;
}

h2, #download, .header_buy_row, .more_information_toggle, .buy_row, .uploads *{
  /*other types of text*/
  font-family: 'Bangers', monospace;

  font-size: 50px;

  color: yellow;

  -webkit-text-stroke: 1px black;
   text-shadow:
       3px 5px 0 #000,
     -2px -2px 0 #000,  
      2px -2px 0 #000,
      -2px 2px 0 #000,
       2px 2px 0 #000;

  animation: colors 2s infinite;
}

p, section, .breadcrumbs, .post_meta, .formatted_description *{
  
  font-family: 'Luckiest Guy', monospace;
  font-size: 40px;
  animation: colors_plain 10s infinite;
  
  display: inline;
  background: black;

  /*outline*/
  
 -webkit-text-stroke: 1px black;
}

h1, h, h2, h3, .button_message, .buy_message *{
  animation: colors 0.5s infinite;
  font-size: 50px;
  color: red;
  text-shadow: none;
}

.button, buy_btn *{
  animation: colors 2s infinite;
  font-family: 'Bowlby One SC', monospace;
  color: pink;
}

.header *{
  position: fixed;
  bottom:0;
  right:0;
  z-index: 10;
  pointer-events: none;
}

@keyframes colors
{
  0%   {color: red;}
  25%  {color: orange;}
  50%  {color: red;}
  75%  {color: yellow;}
  100% {color: red;}
}

@keyframes colors_plain
{
  0%   {color: white;}
  25%  {color: orange;}
  50%  {color: white;}
  75%  {color: yellow;}
  100% {color: white;}
}

@keyframes colors_back
{
  0%   {background-color: black;}
  25%  {background-color: #000066;}
  50%  {background-color: black;}
  75%  {background-color: #330000;}
  100% {background-color: black;}
}

@keyframes anim1 {
  0% {
    transform:translateY(0px)
  } 
  50% {
    transform:translateY(120px)
  }
  100% {
    transform:translateY(0px)
  }
}

@keyframes anim2 {
  0% {
    transform:scale(1)
  } 
  50% {
    transform:scale(1.01)
  }
  100% {
    transform:scale(1)
  }
}

@keyframes anim3 {
  0% {
    transform:skewY(0deg)
  } 
  50% {
    transform:skewY(2deg)
  }
  0% {
    transform:skewY(0deg)
  }
}


GOGOFISH


strangely broken (intentional)
frame around paragraphs to make it all look windowed
download now is animated
nuclear explotion in the background



@import url('https://fonts.googleapis.com/css?family=Kirang+Haerang');

body *{
	
  background: url("https://img.itch.zone/aW1nLzEzOTQ3NzkuZ2lm/original/K8Weo7.gif") no-repeat center center fixed;

  background-size: cover;
  background-color: black;

  cursor: url('https://img.itch.zone/aW1nLzEzNDMyOTYuZ2lm/original/qiGtZ%2F.gif'), auto;
  
  font-family: 'Kirang Haerang', Verdana, Geneva, sans-serif;
  font-size: 40px;

  color: #FFF15D;

  text-shadow:
   -1px -1px 0 #AE0000,  
    1px -1px 0 #AE0000,
    -1px 1px 0 #AE0000,
     1px 1px 0 #AE0000;
}

.buy_row, .header_buy_row *{
  background: black;
}

.main a{
  color: black;

  text-shadow:
 -1px -1px 0 red,  
  1px -1px 0 yellow,
  -1px 1px 0 red,
   1px 1px 0 orange;
}

.user_formatted *{
  padding: 10px;

  border: 3px solid;  
  border-image:   url('https://img.itch.zone/aW1nLzEzOTQ3NzYuZ2lm/original/joMfZ0.gif');
  border-image-slice: 4;
  border-image-repeat: round;
  background-color: rgba(0, 0, 0, .7);
  box-shadow: 30px 30px 0px black;

  background: black;
}

.buy_btn {
  animation:button_spin 1.3s ease-out infinite;
}

.main img{
border: 3px solid;  
border-image:   url('https://img.itch.zone/aW1nLzEzOTQ3NzYuZ2lm/original/joMfZ0.gif');
border-image-slice: 4;
border-image-repeat: round;
background-color: rgba(0, 0, 0, .7);
box-shadow: 30px 30px 0px black;
}

.buy_game_lightbox_widget, .buy_form *{
  background: black;
}

.buy_game_lightbox_widget h2{
  background: black;
}

.add_btn *{
  background: none;
}

.choose_payment *{
  background: none;
}

/*animation:spin 4s linear infinite;*/
@keyframes button_spin { 
  0% { 
   transform: rotate(0deg) scale(1.5);
  } 20% { 
   transform: rotate(6deg) scale(2); 
  } 50% {
   transform: rotate(0deg) scale(1.5);
  } 80% {
   transform: rotate(-6deg) scale(2);
  } 100% {
   transform: rotate(0deg) scale(1.5);
  }
}


FR2OGGY (ONLY ONE SURVIVES)



banner is footer (lava)
background is lava
comments are really large (intentional to make commenting hard)
fun font use to make it kind of like a horror movie poster




@import url('https://fonts.googleapis.com/css?family=Creepster|Fontdiner+Swanky');

*{
  cursor: url('https://img.itch.zone/aW1nLzEyNDQxOTgucG5n/original/%2BJCV33.png'), auto;
}

* a{
cursor: pointer;
}

#wrapper *{
  font-size: 50px;
  font-family: 'Creepster', monospace;
  text-shadow: 1px 1px 1px yellow, 1px 2px orange, 1px 3px red, 3px 4px 1px black, 0px 0px 4px black;

}


.buy_btn{
 font-family: monospace;
  cursor: pointer;
}


.header{
  position: fixed;
  bottom: -30px;
  left:0;
background-image: url("https://img.itch.zone/aW1nLzEyNDQyOTEuZ2lm/original/cBh%2FCf.gif");
  width: 100%;
  z-index: 10;
  pointer-events: none;
}

.column{
  animation: rotation_subtle 2s ease-out alternate infinite;
}

.screenshot {
  /*first set of border*/
outline: 3px solid #0000AE;
box-shadow: 0px 0px 0px 5px #A9A9A9;
/*funky set of border*/
border: 2px solid white;
border-image-slice: 1;
border-image-repeat: round;

animation: rotation_subtle .5s ease-out alternate infinite;
}

.header_buy_row *{
  animation: rotation .1s ease-out alternate infinite;
color: yellow;

font-size: 70px;
}

.footer{
  color: orange;
}

@keyframes rotation {
  0% {
	transform: rotate(-.7deg);
  } 100% {
	transform: rotate(.7deg);
  }
}


@keyframes rotation_subtle {
  0% {
	transform: rotate(-.2deg);
  } 100% {
	transform: rotate(.2deg);
  }
}


A very STINKY mystery FILE



probably one of my weirdest
comments are a carousel! hop on for the ride! commenters love it!
page is swinging
download now is rotating
has attracted flies



h1{
  background-image: url("https://img.itch.zone/aW1nLzExNjMxNDAuZ2lm/original/AZPcV9.gif");
  filter: invert(100%);
}

.header{
  width: 540px;
  height: 90px;
  animation: spin 5s infinite linear;
  transform-origin: 45% 50%;
  padding: 90px;
}

.buy_btn{
  width: 200px;
  height: 90px;
  animation: spin 3s infinite linear;
  transform-origin: 50% 50%;
   z-index: 5;
}

.screenshot_list{
  animation: spin 15s infinite linear;
  filter: blur(2px) grayscale(.5) opacity(0.5);
}

.wrapper{
  animation: rocking 5s infinite linear;
  background-color: rgba(255, 255, 255, .1);

height: 100%;

  background-image: url("https://img.itch.zone/aW1nLzExNjMxNDAuZ2lm/original/AZPcV9.gif");

  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;

}

.inner_column{
  /*transparent*/
  background-color: rgba(255, 255, 255, 0.7);
/*fly gif border*/
 border: 50px solid transparent;
    border-image: url(https://img.itch.zone/aW1nLzExNjMxNDAuZ2lm/original/AZPcV9.gif) 40%;
}

.game_comments_widget{
  width: 500px;
  height: 200px;
  animation: spin 15s infinite linear;
  transform-origin: 50% 50%;
}

@keyframes spin {
    from {transform:rotate(0deg);}
    to {transform:rotate(360deg);}
}

@keyframes rocking {
  0% {
	transform: rotate(2deg);
  } 50% {
	transform: rotate(-2deg);
  } 100% {
	transform: rotate(2deg);
}


HELP ME



as the title implies
things are upside down
generally weird and intentionally broken




@import url('https://fonts.googleapis.com/css?family=Barrio');
@import url('https://fonts.googleapis.com/css?family=Life+Savers');

.wrapper *{
  transform: scale(-1);
  padding: 18px;
}

.inner_column{
padding: 150px;
}

#download{
  transform: scale(20);
padding:50px;
}

.buy_row *{
 transform: scale(1);
  padding: 50px;
}


.user_formatted *{
  box-shadow: 50px 10px 0px #fa5ced;
  padding: 50px;
  transform: scale(1);
}



.main *{
  font-family: 'Life Savers';
}

.main a {
  font-family: 'Barrio';
  color: #f994ef;
}

.game_comments_widget * {
  font-size: 20px;
  transform: scale(1);
  transition: all 5ms;
}

.game_comments_widget:hover{
  /*transform: scale(-1);
  transition: all 5ms;*/
}

.main a:hover{
  color: #FFFFFF;
  transition: all 30ms;
}

.button *{
  transform: scale(1);
  transition: all 30ms;
}

.button:hover{
  transform: scale(-1.2);
  transition: all 10ms;
}