body,html{
	color: #fff;
	font-family: 'Work Sans', sans-serif;
	font-size:14px;
	margin: 0px;
	overflow: hidden;
	width:100%;height:100%;

}
body{
	background-color:#eee;
}
div,img,input,textarea,canvas{
	box-sizing:border-box;
}
.rel{
	position:relative;
	width:100%;height:100%;
}
.centerxy,.centerx,.centery{
	position:absolute;
}
input:focus,
select:focus,
textarea:focus,
button:focus {
    outline: none;
}
textarea {
  resize: none;
}


#container{
	width:100%;max-width:480px;min-width:340px;
	height:100%;
	overflow: hidden;
	margin: 0px auto;
	padding:5px 10px;
}
	#topUI{
		width:100%;
		height:auto; 
	}
		#canvas_container{
			position: relative;
		}
			#canvas_warning{
				width: 100%; height:32px;
				text-align: center;
				position: absolute;
				z-index: 1111;
				left:0px;
				top: calc(50% - 16px);
				background-color: #000;
				color:#fff;
				padding:5px;
				font-size:18px;font-weight:600;
				display: none;
			}
			.canvas_grid_button{

			}
			#canvas_grid_toggle{
				background-image: url('imgs/tpgrid.png');
				background-size: 40px;
				background-position: -11px -11px;
				position: absolute;
				z-index:900;
				top:6px;left:6px;
				width:20px;height:20px;
				cursor: pointer;
				border:1px solid #333;
				/* border-radius: 50%;
				overflow: hidden; */
			}
			#canvas_3dtext{
				cursor:crosshair;
				background-image: url('imgs/trans_grid3_light.png');
				background-size: 160px;
				border:1px solid #000;
			}
			#material_type_overlay{
				position: absolute;
				width:260px;height:24px;
				z-index:1111;
				bottom:24px;
				left:calc(50% - 130px);
				color:#fff;font-size:20px;font-weight:900;
				text-align: center;
				display: none;
				background-color: #000;
			}
		.main_ui{
			width: 100%;
		}
		#ui_row_header{ /*message*/
			height:0px;
			margin-top:5px;
		}
			#textarea_message{
				width:100%;height:auto;
				font-size:10px;color:#000;font-weight:300;
				font-style: italic;
			}
		#ui_row_input{ /*write*/
			height: 90px;
		}
			#textarea_input{
				font-family: 'Work Sans', sans-serif;
				width: calc(70% - 8px);
				height:80px;
				overflow:hidden;
				font-size:16px;font-weight:700;
				line-height:20px;
				display:block;float:left;
				text-align:center;
				padding:5px;
				border:thin solid #000;
				color:#000;
				background-color:#fff;
				margin-left:3px;
				-webkit-box-shadow: -3px 3px 0px 0px rgba(0,0,0,0.75);-moz-box-shadow: -3px 3px 0px 0px rgba(0,0,0,0.75);box-shadow: -3px 3px 0px 0px rgba(0,0,0,0.75);
			}
			.textarea_focus{
				background-color:#000;
				color:#fff;
			}
			#button_update_text{
				display:block;float:right;
				width:calc(30% - 5px);
				height:58px;
				background-color:#fff;
				text-align:center;
				padding:5px;
				color:#000;
				font-size:16px;font-weight:700;
				cursor:pointer;
				border:thin solid #000;
				-webkit-box-shadow: -3px 3px 0px 0px rgba(0,0,0,0.75);-moz-box-shadow: -3px 3px 0px 0px rgba(0,0,0,0.75);box-shadow: -3px 3px 0px 0px rgba(0,0,0,0.75);
			}
			#button_update_text:hover{
				-webkit-animation: bg-rainbow .25s infinite; 
				-ms-animation: bg-rainbow .25s infinite;
				animation: bg-rainbow .25s infinite;
			}
			#button_clear_text{
				display:block;float:right;
				width:calc(30% - 5px);
				height:22px;
				background-color:#fff;
				text-align:center;
				padding:2px;
				color:#000;
				font-size:12px;font-weight:300;
				cursor:pointer;
				border:thin solid #000;
				-webkit-box-shadow: -3px 3px 0px 0px rgba(0,0,0,0.75);-moz-box-shadow: -3px 3px 0px 0px rgba(0,0,0,0.75);box-shadow: -3px 3px 0px 0px rgba(0,0,0,0.75);
			}
			#button_clear_text:hover{
				-webkit-animation: bg-rainbow .25s infinite; 
				-ms-animation: bg-rainbow .25s infinite;
				animation: bg-rainbow .25s infinite;
			}
		#ui_row_materials{ 
			width:100%;height:30px;
			margin-top: -18px;
		}
			#material_types{
				margin-left:100px; /*set by js*/
				position: relative;
			}
				.material_type{
					position: absolute;
					z-index:900;
					width: 26px;height: 26px;
					border-radius: 50%;
					background-color: #fff;
					border: 1px solid #000;
					overflow: hidden;
					-webkit-box-shadow: -2px 2px 0px 0px rgba(0,0,0,0.75);-moz-box-shadow: -2px 2px 0px 0px rgba(0,0,0,0.75);box-shadow: -2px 2px 0px 0px rgba(0,0,0,0.75);
					cursor: pointer;
				}
				.material_img{
					width: 100%;height: 100%;
					width: 24px;height: 24px;
				}
				.material_type_active{
					
				}
				#material_standard{top:0px;left:0px;}
				#material_toon{top:0px;left:34px;}
				#material_outlineStandard{top:0px;left:68px;}
				#material_outlineCartoon{top:0px;left:102px;}
				#material_outlineOnly{top:0px;left:136px;}
				

		#ui_row_settings{ /*settingds*/
			height:218px;
			margin-top:5px;
			overflow: hidden;
		}
			#settings_container{
				display:block;float:right;
				width:calc(100% - 3px);
				height:210px;
				background-color:#fff;
				text-align:center;
				padding:8px 4px;
				color:#000;
				font-size:12px;font-weight:400;
				border:thin solid #000;
				margin-left: 3px;
				-webkit-box-shadow: -3px 3px 0px 0px rgba(0,0,0,0.75);-moz-box-shadow: -3px 3px 0px 0px rgba(0,0,0,0.75);box-shadow: -3px 3px 0px 0px rgba(0,0,0,0.75);
			}
				.settings_page{
					width:100%;height:160px;
					/* border:1px solid #333; */
					/* border:1px solid #f00; */
					overflow: hidden;
					margin-top:10px;
					display: none;
				}
				#settings_page_basic{
					display: block;
				}
					.settings_column{
						height:138px;width:49%;
						
						/* padding:5px; */
						/* background-color: #eee; */
					}
					.settings_column_left{
						display: block;float: left;
						padding:0px 5px 0px 10px;
					}
					.settings_column_right{
						display: block;float: right;
						padding:0px 10px 0px 5px;
					}
					.settings_row{
						width:100%;
						height:40px;
					}
				#settings_dots{

				}
					.settings_dot{
							
					}
				.settings_arrow{

				}
				#settings_arrow_left{

				}
				#settings_arrow_right{
					
				}
				#settings_menu{
					width: calc(100% + 5px);
					height:30px;
					margin-left: -3px;
					margin-top:-6px;
				}
					.setting_switch{ /*basic, motion, craze, lighting*/
						width: calc(20% - 4px);
						height:auto;
						display: block;float: left;
						color:#fff;font-size:14px;font-weight:400;
						margin:2px;
						padding:3px;
						background-color: #fff;
						border: 1px solid #000;
						color:#000;
						cursor: pointer;
					}
					.setting_switch:hover{
						-webkit-animation: bg-rainbow .25s infinite; 
						-ms-animation: bg-rainbow .25s infinite;
						animation: bg-rainbow .25s infinite;
					}
					.setting_switch_active{
						background-color: #000;
						border: 1px solid #000;
						color:#fff;
						font-weight:700;
					}
					.setting_switch_active:hover{
						-webkit-animation: nothing .25s infinite !important; 
						-ms-animation: nothing .25s infinite !important;
						animation: nothing .25s infinite !important;
					}
		#ui_row_export{ /*export*/
			height:32px;
		}
			.button_export{
				display: block;float: left;
				width: calc(50% - 4px); margin:2px;
				background-color:#fff;
				text-align:center;
				padding:6px 2px;
				color:#000;
				font-size:12px;
				font-weight:500;
				cursor:pointer;
				border:thin solid #000;
				-webkit-box-shadow: -2px 2px 0px 0px rgba(0,0,0,1);-moz-box-shadow: -2px 2px 0px 0px rgba(0,0,0,1);box-shadow: -2px 2px 0px 0px rgba(0,0,0,1);
				cursor: pointer;
				height:27px;overflow: hidden;
				opacity: 0.4;
			}
			.button_export:hover{
				opacity: 1;
			}
			.button_export_selected{
				opacity: 1;
			}
			.export_icon{
				width:11px;height:11px;
			}
		#ui_row_format3d{ /*quality*/
			height:50px;display: none;
		}
			.button_format3d{
				display: block;float: left;
				width: calc(33.3% - 4px); margin:2px;
				background-color:#fff;
				text-align:center;
				padding:6px 2px;
				color:#000;
				font-size:12px;
				font-weight:500;
				cursor:pointer;
				border:thin solid #000;
				-webkit-box-shadow: -2px 2px 0px 0px rgba(0,0,0,1);-moz-box-shadow: -2px 2px 0px 0px rgba(0,0,0,1);box-shadow: -2px 2px 0px 0px rgba(0,0,0,1);
				opacity:0.4;
				cursor: pointer;
			}
			.button_format3d:hover{
				opacity: 1;
			}
		#ui_row_quality{ /*quality*/
			height:50px;
		}
			.button_quality{
				display: block;float: left;
				width: calc(33.3% - 4px); margin:2px;
				background-color:#fff;
				text-align:center;
				padding:6px 2px;
				color:#000;
				font-size:12px;
				font-weight:500;
				cursor:pointer;
				border:thin solid #000;
				-webkit-box-shadow: -2px 2px 0px 0px rgba(0,0,0,1);-moz-box-shadow: -2px 2px 0px 0px rgba(0,0,0,1);box-shadow: -2px 2px 0px 0px rgba(0,0,0,1);
				opacity:0.4;
				cursor: pointer;
			}
			.icon_quality{
				width:10px;height:10px; 
				border-radius: 50%; overflow: hidden;
				border: 1px solid #000;
			}
			.button_quality_sub{
				font-size:8px;font-weight:300;opacity:1;
			}
			.button_quality:hover{
				opacity: 1;
			}
			.button_quality_selected{
				opacity:1;
			}
		#ui_row_create{ /*create*/
			height:90px; /* set with js*/
		}
			#button_create_sticker{
				width: calc(100% - 3px);
				height:55px; /*set by js */
				background-color:#fff;
				text-align:center;
				padding:3px;
				color:#000;font-size:22px;font-weight:700;
				cursor:pointer;
				border:thin solid #000;
				margin-left:3px;
				-webkit-box-shadow: -3px 3px 0px 0px rgba(0,0,0,0.75);-moz-box-shadow: -3px 3px 0px 0px rgba(0,0,0,0.75);box-shadow: -3px 3px 0px 0px rgba(0,0,0,0.75);
			}
			#button_create_sticker:hover{
				-webkit-animation: bg-rainbow .25s infinite; 
				-ms-animation: bg-rainbow .25s infinite;
				animation: bg-rainbow .25s infinite;
			}	

	#bottomUI{
		display: none;
	}
		#ui_container_left{
			width:170px;height:700px;
			display: block;float: left;
			background-color:#fff;
		}
			#ui_container_left_content{
				padding:8px;
				height:auto;
			}
		#ui_container_right{
			width:170px;height:700px;
			display: block;float: right;
			background-color:#fff;
		}
			#ui_container_right_content{
				padding:8px;
				height:auto;
			}











#donate_container{
	display: none;
	position:absolute;z-index:2222;
	top:0px;left:0px;
	width:100%;height:100%;
	font-family: Arial, Helvetica, sans-serif;
	font-weight: 800;
	color:#000;
	background: rgb(233,233,233);
	background: radial-gradient(circle, rgba(255,255,255,1) 0%, rgba(210,210,210,1) 100%);
}
#donate_hypno{
	background-image: url('imgs/hypno360.gif'); 
	background-position: center;
	-webkit-background-size: cover;
	background-size: cover;
	position:absolute;z-index:3333;
	top:0px;left:0px;
	width:100%;height:100%;
	opacity: 0.020;
}
	#donate_buttons{
		width:360px;height:300px;
		position:absolute;z-index:4444;
		left:calc(50% - 180px);
		top:calc(50% - 150px);
	}
		.donate_button{
			margin-top:10px;margin-bottom:10px;
			width:360px;height:131px;
			/* border:2px solid #ddd; */
			cursor: pointer;
			border-radius:10px;
			padding:6px;
			box-sizing:border-box;
			background:rgba(0,0,0,0.05);
			/* background:#fff; */
		}
		.donate_button:hover{
			/* border:2px solid #ccc; */
			background:rgba(0,0,0,0.10);
		}
		#donate_pp{
		}

		#donate_vm{

		}
		.donate_img{
			width:348px;height:119px;
			pointer-events:none;
		}
	#donate_text{
		width:400px;height:auto;
		position:absolute;z-index:4444;
		left:calc(50% - 200px);
		top:30px;
		text-align:center;
		font-size:12px;line-height:16px;
	}
	#donate_skip{
		width:360px;height:auto;
		position:absolute;z-index:4444;
		left:calc(50% - 180px);
		bottom:30px;
		text-align:center;
		font-size:12px;
		opacity:0.5;
		cursor:pointer;
	}
	#donate_skip:hover{
		opacity:1.00;
	}
	@keyframes pulse2 {
		0% { transform: scale(0.9); opacity: 0.33; }
		50% { transform: scale(1); opacity: 1; }
		100% { transform: scale(0.9); opacity: 0.33; }
	}
	.pulser2{
		-webkit-animation: pulse2 0.8s infinite; 
		-ms-animation: pulse2 0.8s infinite;
		animation: pulse2 0.8s infinite; 	
	}
/**{
   -moz-user-select: none;
   -khtml-user-select: none;
   -webkit-user-select: none;
   -ms-user-select: none;
   user-select: none;
}*/

#whiteout{
	position:fixed;
	z-index:9999;
	top:0px;left:0px;
	width:100%;height:100%;
	background-color:#fff;	
}

#created_by{
	width:100%;
	font-size:11px;font-weight:400;
	color:#000;
	bottom:4px;
	text-transform: uppercase;
	text-align: center;	
}

#version_top{
	font-size:10px;font-weight:400;
	color:#666;
	top:6px;
	text-transform: uppercase;
	text-align: center;	
}
#top_title{
	font-size:20px;font-weight:500;
	color:#fff;
	top:5px;	
}
a:link {text-decoration:underline;color:#000;}
a:visited {text-decoration:underline;color:#000;}
a:hover {text-decoration:underline;color:#000;}
a:active {text-decoration:underline;color:#000;}






#sorry_page{
	width:100%;height:100%;
	background-color:#eee;
	position:fixed;
	top:0px;left:0px;
	color:#aaa;
	z-index:8888;
}
	#sorry_page_content{
		width:400px;height:auto;
		text-align:center;
		color:#000;font-size:14px;
	}







#intro_page{
	width:100%;height:100%;
	background-color:#fff;
	background-image: url('imgs/bgstripes2.png');
	background-repeat: repeat;
	background-size: 32px 32px;
	position:fixed;
	top:0px;left:0px;
	color:#000;
	z-index:8888;
}
	#intro_page_copypaste{
		position: absolute;
		width:400px;height:auto;
		position: absolute;
		z-index: 8889;
		left: calc(50% - 200px);
		bottom:10px;line-height:16px;
		font-size:10px;font-weight:300;color:#000;
		text-align: center;
		opacity: 1;
	}
	#intro_page_content{
		width:360px;height:auto;
		text-align:center;
	}
	#intro_gif{
		width: 380px;height: auto;
		margin-left:-10px;
	}
	#created_by2{
		font-size:12px;font-weight:400;
		color:#000;
		text-align:center;
		margin-bottom:30px;
		margin-top:-30px;
		width:100%;height:auto;
	}
	#lets_go{
		width:360px;height:auto;
		font-size:20px;
		color:#000;
		border:2px solid #000;
		cursor:pointer;		
		font-size:20px;font-weight:500;
		box-sizing: border-box;
		padding:8px 2px;
		background-color: #fff;
	}
	#lets_go:hover{
		-webkit-animation: bg-rainbow .25s infinite; 
		-ms-animation: bg-rainbow .25s infinite;
		animation: bg-rainbow .25s infinite;		
	}





#exporting_page{
	width:100%;height:100%;
	background-color:#fff;
	position:fixed;
	top:0px;left:0px;
	color:#000;
	z-index:7777;
	font-weight:600;
	font-size:14px;
	background-image: url('imgs/bgstripes2.png');
	background-repeat: repeat;
	background-size: 32px 32px;
}

	#exporting_touches{
		width:auto;height:auto;
		text-align:center;
	}
	#exporting_progress{
		width:auto;height:auto;
		text-align:center;
	}
		#progress_bar_container{
			width:200px;height:10px;
			border:thin solid #000;
			padding:2px;
			margin-top:10px;
			position: relative;
			background-color: #fff;
			border-radius:5px;
			overflow: hidden;
		}
			#progress_bar{
				width:200px;height:8px;
				background-color:#000;
				position: absolute;
				top:0px;left:0px;
			}
	#return_to_maker{
		width:360px;height:auto;
		left: calc(50% - 180px);
		bottom:10px;
		padding:10px;
		font-size:20px;
		color:#000;
		border:2px solid #000;
		cursor:pointer;
		background: #fff;
		text-align: center;
		position: absolute;
		z-index:7778;
	}
	#return_to_maker:hover{
		-webkit-animation: bg-rainbow .25s infinite; 
		-ms-animation: bg-rainbow .25s infinite;
		animation: bg-rainbow .25s infinite;			
	}
	#exporting_result{
		width: 360px;height: 500px;
		position: absolute;
		z-index:7778;
		top: calc(50% - 250px);
		left: calc(50% - 180px);
		/* border: 1px solid #000; */
	}

		#your_gif{
			margin-bottom: 5px;
			margin-top: 0px;
		}
			.gifResult{
				width:360px;height:180px;
			}
			.gifResultRatio3{ /* 3:1 */
				width:360px;height:120px;
			}
			.gifResultRatio2{ /* 2:1 */
				width:360px;height:180px;
			}
			.gifResultRatio1{
				width:360px;height:360px;
				border: 2px dashed #000;
				background-color: rgba(0,0,0,0.033);
			}
		#your_gif_info{
			font-size:9px;font-weight:400;color:#000;
			margin-top:10px;
			text-align: center;
		}
		#save_info1{
			font-size:14px;font-weight:700;color:#000;
			margin-top:-32px;
			text-align: center;
		}
		#save_info1b{
			font-size:10px;font-weight:700;color:#000;
			margin-top:25px;
			text-align: center;
		}
		#save_info2{
			font-size:9px;font-weight:300;color:#000;
			margin-top:8px;
			text-align: center;
			line-height: 12px;
		}
		#exporting_complete{
			width:auto;height:auto;	
			text-align:center;	
			margin-bottom: 10px;
			font-size:24px;font-weight:700;color:#000;
		}




.ui_box{
	width:auto;height:auto;
}
.ui_title{
	color:#333;
	font-size:20px;
	font-weight:500;
	margin-bottom:5px;
	text-align:center;
	width:100%;height:auto;
}
.row_title{
	width:100%;height:auto;
	font-size:9px;
	font-weight: 300;
	/* font-style:italic; */
	color:#000;
	margin-bottom:1px;
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
	text-align: left;
}
.flip_mod{
	color:#333;
	/* border:1px solid #333; */
	padding:1px 4px;
	font-size:9px;
	font-weight:300;
	margin-left:4px;
	margin-bottom:2px;
	background-color: #eee;
	cursor: pointer;
}
.slider_row{
	width:100%;height:16px;
	border:1px solid #000;
	background-color: #fce5fe;
	display: block;float: left;
	margin-top:0px;
	/* overflow: hidden; */
	position: relative;
	opacity: 1;
	pointer-events: auto;
}
.slider_row_inactive{
	opacity: 0.33;
	pointer-events: none;
}
.slider{
	position:absolute;
	left:0px;top:0px;
	width: 41px;height:41px;
	/* border: 1px solid #000; */
	border:none;
	margin-top:-13px;
	overflow: hidden;
	cursor: ew-resize;
	background: none;
	/* border: none; */
	outline: none;
	background-image: url("imgs/slider.png");
	background-size: 15px 14px; background-position: 13px 13px; background-repeat: no-repeat;
    /* -webkit-touch-callout: none;-webkit-user-select: none;-khtml-user-select: none;-moz-user-select: none;-ms-user-select: none;user-select: none; */
}
.row_space{
	height:12px;
	clear:both;
}
.row_space2{
	height:15px;
	clear:both;
}
.ui_hr{
	width:97%;height:1px;
	background-color:#bbb;
	margin-top:2px;
	margin-bottom:2px;
}
#select_font{
	width:150px;height:auto;
	background-color: #fce5fe;
	border:thin solid #000;
	text-align:center;
	font-size:14px;
	border-radius:0px;
}
#picker_bg{
	width: 100%;height: 100%;
	background-color: rgba(0,0,0,0.05);
	position: absolute; z-index: 999;
	top:0px;left:0px;
	display: none;
}
#picker_text_color,#picker_line_color{
	width:100%;height:50px;
	margin:0px;outline:none;
}
#picker_line_color{
	height:25px;
}
.jscolor{	
	height:50px;
	border:thin solid #000;
	text-align:center;
}
#font_scroll{
	width: 100%;
	height: 155px;
	overflow-x: hidden; overflow-y: auto;
	padding:0px 15px;
	/* border:2px solid #ccc; */

}
	.font_select{
		width:100%;height:32px;
		padding:4px;
		overflow: hidden;
		text-align:center;
		border:thin solid #333;
		color:#333;
		margin-top:3px;
		cursor:pointer;
		background-color: #fff;
		box-sizing: border-box;
		font-size:20px;
		position: relative;
	}
	.font_language{
		position: absolute;
		bottom:2px;right:3px;
		font-size:9px;font-weight:400;color:#000;
	}
	.font_size{
		position: absolute;
		top:2px;right:3px;
		font-size:7px;font-weight:400;color:#000;
	}
	.font_glyphs{
		position: absolute;
		top:2px;left:3px;
		font-size:7px;font-weight:400;color:#000;
	}
	.font_select_img{
		width:190px;
	}
	.font_is_selected{
		color:#000;
		border:thin solid #000;
		background-color: #fce5fe;
	}











#code_container{
	display: none;
	width:400px;height:200px;
	z-index:7777;
}





#coming_soon_container{
	width: 300px;height: 40px;
	font-weight:800;color:#fff;
	position: absolute; z-index: 7777;
	top: calc(50% - 20px);
	left: calc(50% - 150px);
	display: none;
	text-align: center;
	font-size:28px;
}
#coming_soon_bg{
	width: 100%;height: 100%;
	background-color: rgba(0,0,0,0.75);
	position: absolute; z-index: 7776;
	top:0px;left:0px;
	display: none;
}

.pro_overlay{
	width:240px;height:35px;padding:20px;
	position: absolute; z-index: 7777;
	border-radius: 5px;
	background-color: #fff;
	color: #111;
	font-size:12px; font-weight: 300;
}
#pro_bg{
	width: 100%;height: 100%;
	background-color: rgba(0,0,0,0.75);
	position: absolute; z-index: 7776;
	top:0px;left:0px;
	display: none;
}
#pro_info{
	display: none;
	color:#aaa;font-weight: 600;
	text-align: center;
}
#pro_info a:link {text-decoration:underline;color:#888;}
#pro_info a:visited {text-decoration:underline;color:#888;}
#pro_info a:hover {text-decoration:underline;color:#888;}
#pro_info a:active {text-decoration:underline;color:#888;}
#pro_code{
	display: none;
}
#pro_code_input{
	background-color: #eee;color:#777;font-weight: 800;
	text-transform: uppercase;
	width: 130px;
	outline:none;
	border: none;
	padding:10px;
	display: block;float: left;
}
#pro_code_submit{
	padding:10px;
	width: 60px;
	border: 1px solid #111;
	color:#111;
	cursor: pointer;
	background-color: #fff;
	text-align: center;
	display: block;float: right;
}
#pro_code_submit:hover{
	color:#fff;
	background-color: #111;
}
#pro_code_response{
	padding-top:12px;color:#ccc;font-weight: 600;
	text-align: center;
}









/* fx _______________________________________________________________ */

@-webkit-keyframes rainbow{
  0%{color:#fcc1f3;} 20%{color:#c1c6fc;} 40%{color:#c1f6fc;} 60%{color:#c2fcc1;} 80%{color:#f9fcc1;} 100%{color:#fcd0c1;}	
}
@-ms-keyframes rainbow{
  0%{color:#fcc1f3;} 20%{color:#c1c6fc;} 40%{color:#c1f6fc;} 60%{color:#c2fcc1;} 80%{color:#f9fcc1;} 100%{color:#fcd0c1;}	
}
@keyframes rainbow{
  0%{color:#fcc1f3;} 20%{color:#c1c6fc;} 40%{color:#c1f6fc;} 60%{color:#c2fcc1;} 80%{color:#f9fcc1;} 100%{color:#fcd0c1;}
}
@-webkit-keyframes rainbow-border{
  0%{border-color:#fcc1f3;} 20%{border-color:#c1c6fc;} 40%{border-color:#c1f6fc;} 60%{border-color:#c2fcc1;} 80%{border-color:#f9fcc1;} 100%{border-color:#fcd0c1;}	
}
@-ms-keyframes rainbow-border{
  0%{border-color:#fcc1f3;} 20%{border-color:#c1c6fc;} 40%{border-color:#c1f6fc;} 60%{border-color:#c2fcc1;} 80%{border-color:#f9fcc1;} 100%{border-color:#fcd0c1;}	
}
@keyframes rainbow-border{
  0%{border-color:#fcc1f3;} 20%{border-color:#c1c6fc;} 40%{border-color:#c1f6fc;} 60%{border-color:#c2fcc1;} 80%{border-color:#f9fcc1;} 100%{border-color:#fcd0c1;}
}
@-webkit-keyframes bg-rainbow{
  0%{background-color:#fcc1f3;} 20%{background-color:#c1c6fc;} 40%{background-color:#c1f6fc;} 60%{background-color:#c2fcc1;} 80%{background-color:#f9fcc1;} 100%{background-color:#fcd0c1;}	
}
@-ms-keyframes bg-rainbow{
  0%{background-color:#fcc1f3;} 20%{background-color:#c1c6fc;} 40%{background-color:#c1f6fc;} 60%{background-color:#c2fcc1;} 80%{background-color:#f9fcc1;} 100%{background-color:#fcd0c1;}	
}
@keyframes bg-rainbow{
  0%{background-color:#fcc1f3;} 20%{background-color:#c1c6fc;} 40%{background-color:#c1f6fc;} 60%{background-color:#c2fcc1;} 80%{background-color:#f9fcc1;} 100%{background-color:#fcd0c1;}
}
.crazy_rainbow{
	-webkit-animation: rainbow .25s infinite; 
	-ms-animation: rainbow .25s infinite;
	animation: rainbow .25s infinite; 	
}







@keyframes pulse {
    0% { transform: scale(0.9); opacity: 0.33; }
    50% { transform: scale(1); opacity: 1; }
    100% { transform: scale(0.9); opacity: 0.33; }
}
.pulser{
	-webkit-animation: pulse 1.2s infinite; 
	-ms-animation: pulse 1.2s infinite;
	animation: pulse 1.2s infinite; 	
}