body {
	font-family: Futura, "Trebuchet MS", Arial, sans-serif;
	font-weight: 200;
	background: linear-gradient(rgba(255,0,0,0),rgba(255,0,0,0)), url('images/bg.jpg');
	background-position: 30% 30%;
	background-size: 100%;
}

h1.titleText {
	font-size: 3em;
	font-family: 'Indie Flower', cursive;
	font-weight: 700;
}

h3.aboutTitle {
	font-size: 1.5em;
	font-family: 'Indie Flower', cursive;
	font-weight: 700;
}

h4.signupTitle {
	font-size: 1.2em;
	font-family: 'Indie Flower', cursive;
	font-weight: 700;
}

h4.signupTitle2 {
	font-size: 1em;
	font-family: Arial;
	font-weight: 700;
	font-style: italic;
}

div.centered {
	position: absolute;
	width: 40%;
	top: 5%;
	left: 30%;
    text-align: center;
	background: rgba(204,204,255,1); /* teal color in musefor.me is: rgba(9,102,115,1)*/
	border: 2px solid rgba(110,110,110,1); /* previous rgba(161,161,161,1)*/
	padding: 5px 20px; 
	border-radius: 10px;
	box-shadow: 3px 3px 1px rgba(130,130,130,1); /* previous rgba(153,153,153,1)*/
	/*z-index: 2;*/
}
    
div.aboutArea {
	position: absolute;
	width: 20%;
	top: 7%;
	left: 2%;
	z-index: 2;
	text-align: left;
	
	background: rgba(204,204,255,1); /* purplish color #ccccff rgba(204,204,255,1)*/
	border: 2px solid rgba(110,110,110,1); /* previous rgba(161,161,161,1)*/
	padding: 5px 20px;
	border-radius: 10px;
	box-shadow: 3px 3px 1px rgba(130,130,130,1); /* previous rgba(153,153,153,1)*/
}

textarea.story {
	position: relative;
	width: 80%;
	border-radius: 10px;
	-moz-border-radius: 10px;
	-webkit-border-radius: 10px;
	-khtml-border-radius: 10px;
	border-width: 5px;
	border-color: #2F4F4F;
	outline: none;
	/*z-index: 3;*/
}

/* Sharing Area */
div.sharing {
	position: absolute;
	width: 20%;
	top: 7%;
	right: 2%;
	z-index: 15;
	text-align: center;
	
	background: rgba(204,204,255,1); /* purplish color #ccccff rgba(204,204,255,1)*/
	border: 2px solid rgba(110,110,110,1); /* previous rgba(161,161,161,1)*/
	padding: 5px 20px;
	border-radius: 10px;
	box-shadow: 3px 3px 1px rgba(130,130,130,1); /* previous rgba(153,153,153,1)*/
}

button.example {
	-webkit-transition: all 0s ease-out;
	-moz-transition: all 0s ease-out;
	-o-transition: all 0s ease-out;
	-ms-transition: all 0s ease-out;
	transition: all 0s ease-out;
	height: 35px;
	display: block;
	font-family: Arial, "Helvetica", sans-serif;
	font-size: 14px;
	color: #fff;
	text-decoration: none;
	text-align: center;
	text-shadow: 0px -1px 0px rgba(0,0,0,0.4);
	padding: 4px 20px 0;
	margin: 10px auto;
	left: 30px;
	position: relative;
	cursor: pointer;
	border: none;
	border-top-right-radius: 5px;
	border-bottom-right-radius: 5px;
	outline: none;
}

button.facebook {
	border-left: solid 1px #2E4476;
	background: #3B5999;
	-webkit-box-shadow: 0px 5px 0px 0px #2E4476;
	box-shadow: 0px 5px 0px 0px #2E4476;
}

button.twitter {
	border-left: solid 1px #269BD0;
	background: #46C1F6;
	-webkit-box-shadow: 0px 5px 0px 0px #269BD0;
	box-shadow: 0px 5px 0px 0px #269BD0;
}

button.twitterlink {
	border-left: solid 1px #269BD0;
	background: #46C1F6;
	-webkit-box-shadow: 0px 5px 0px 0px #269BD0;
	box-shadow: 0px 5px 0px 0px #269BD0;
}

button.google {
	border-left: solid 1px #C02B21;
	background: #DE463B;
	-webkit-box-shadow: 0px 5px 0px 0px #C02B21;
	box-shadow: 0px 5px 0px 0px #C02B21;
}

button.email {
	border-left: solid 1px #813781;
	background: #A948A9;
	-webkit-box-shadow: 0px 5px 0px 0px #813781;
	box-shadow: 0px 5px 0px 0px #813781;
}

button.reddit {
	border-left: solid 1px #294C5D;
	background: #36647A url("http://www.reddit.com/static/spreddit14.gif") no-repeat;
	/*
	Figuring out the colors...
	Original:
	#A948A9
	rgb(169,72,169)
	#813781
	rgb(129,55,129)
	
	Ratio is 1.3
	
	New:
	#36647A
	rgb(54,100,122)
	#294C5D
	rgb(41,76,93)
	*/
	-webkit-box-shadow: 0px 5px 0px 0px #294C5D;
	box-shadow: 0px 5px 0px 0px #294C5D;
}

button.example:active {
	top: 3px;
}

button.facebook:active {
	-webkit-box-shadow: 0px 2px 0px 0px #2E4476;
	box-shadow: 0px 2px 0px 0px #2E4476;
}

button.twitter:active {
	-webkit-box-shadow: 0px 2px 0px 0px #269BD0;
	box-shadow: 0px 2px 0px 0px #269BD0;
}

button.twitterlink:active {
	-webkit-box-shadow: 0px 2px 0px 0px #269BD0;
	box-shadow: 0px 2px 0px 0px #269BD0;
}

button.google:active {
	-webkit-box-shadow: 0px 2px 0px 0px #C02B21;
	box-shadow: 0px 2px 0px 0px #C02B21;
}

button.email:active {
	-webkit-box-shadow: 0px 2px 0px 0px #813781;
	box-shadow: 0px 2px 0px 0px #813781;
}

button.reddit:active {
	-webkit-box-shadow: 0px 2px 0px 0px #294C5D;
	box-shadow: 0px 2px 0px 0px #294C5D;
}

button.example:before {
	content: "0";
	width: 35px;
	height: 25px;
	display: block;
	position: absolute;
	padding-top: 10px;
	line-height: 20px;
	top: 0px;
	margin-left: -54px;
	font-size: 16px;
	font-weight: bold;
	border-top-left-radius: 5px;
	border-bottom-left-radius: 5px;
}

button.facebook:before {
	border-right: solid 1px #2E4476;
	background: #3B5999;
	-webkit-box-shadow: 0px 5px 0px 0px #2E4476;
	box-shadow: 0px 5px 0px 0px #2E4476;
}

button.twitter:before {
	border-right: solid 1px #269BD0;
	background: #46C1F6;
	-webkit-box-shadow: 0px 5px 0px 0px #269BD0;
	box-shadow: 0px 5px 0px 0px #269BD0;
}

button.twitterlink:before {
	border-right: solid 1px #269BD0;
	background: #46C1F6;
	-webkit-box-shadow: 0px 5px 0px 0px #269BD0;
	box-shadow: 0px 5px 0px 0px #269BD0;
}

button.google:before {
	border-right: solid 1px #C02B21;
	background: #DE463B;
	-webkit-box-shadow: 0px 5px 0px 0px #C02B21;
	box-shadow: 0px 5px 0px 0px #C02B21;
}

button.email:before {
	border-right: solid 1px #813781;
	background: #A948A9;
	-webkit-box-shadow: 0px 5px 0px 0px #813781;
	box-shadow: 0px 5px 0px 0px #813781;
}

button.reddit:before {
	border-right: solid 1px #294C5D;
	background: #36647A;
	-webkit-box-shadow: 0px 5px 0px 0px #294C5D;
	box-shadow: 0px 5px 0px 0px #294C5D;
}

button.example:active:before {
	top: -3px;
}

button.facebook:active:before {
	-webkit-box-shadow: 0px 5px 0px 0px #2E4476, 6px 4px 2px rgba(0,0,0,0.3);
	box-shadow: 0px 5px 0px 0px #2E4476, 6px 4px 2px rgba(0,0,0,0.3);
}

button.twitter:active:before {
	-webkit-box-shadow: 0px 5px 0px 0px #269BD0, 6px 4px 2px rgba(0,0,0,0.3);
	box-shadow: 0px 5px 0px 0px #269BD0, 6px 4px 2px rgba(0,0,0,0.3);
}

button.twitterlink:active:before {
	-webkit-box-shadow: 0px 5px 0px 0px #269BD0, 6px 4px 2px rgba(0,0,0,0.3);
	box-shadow: 0px 5px 0px 0px #269BD0, 6px 4px 2px rgba(0,0,0,0.3);
}

button.google:active:before {
	-webkit-box-shadow: 0px 5px 0px 0px #C02B21, 6px 4px 2px rgba(0,0,0,0.3);
	box-shadow: 0px 5px 0px 0px #C02B21, 6px 4px 2px rgba(0,0,0,0.3);
}

button.email:active:before {
	-webkit-box-shadow: 0px 5px 0px 0px #813781, 6px 4px 2px rgba(0,0,0,0.3);
	box-shadow: 0px 5px 0px 0px #813781, 6px 4px 2px rgba(0,0,0,0.3);
}

button.reddit:active:before {
	-webkit-box-shadow: 0px 5px 0px 0px #294C5D, 6px 4px 2px rgba(0,0,0,0.3);
	box-shadow: 0px 5px 0px 0px #294C5D, 6px 4px 2px rgba(0,0,0,0.3);
}

/* end of Sharing Area */

img.critten {
	visibility: hidden;
	position: absolute;
	width: 50%;
	/*height: 95%;*/ /* good for first image */
	height: 80%; /* good for seconds image */
	top: 2%;
	left: 25%;
	z-index: 9;
	border-radius: 15px;
	-moz-border-radius: 15px;
	-webkit-border-radius: 15px;
	-khtml-border-radius: 15px;
	border-width: 5px;
	border-color: #ff0000;
}

button#copyButton {
	visibility: hidden;
	position: absolute;
	z-index: 10;
	top: 12%;
	left: 40%;
	background: #ff0000;
	border-radius: 15px;
	-moz-border-radius: 15px;
	-webkit-border-radius: 15px;
	-khtml-border-radius: 15px;
	border-width: 5px;
	border-color: #ff0000;
	cursor: pointer;
}

span.bigText {
	font-size: 3em;
	font-family: Impact, Haettenschweiler, "Franklin Gothic Bold", Charcoal, "Helvetica Inserat", "Bitstream Vera Sans Bold", "Arial Black", sans serif;
}

span.smallText {
	font-size: 1.5em;
}

img.museBanner {
	display: table-cell;
	vertical-align: middle;
	text-align: center;
	width: 234px;
	height: 39px;
}

img.museUncrBanner {
	display: table-cell;
	vertical-align: middle;
	text-align: center;
	/*width: 234px;*/
	/*height: 60px;*/
	width: 305px;
	height: 78px;
}

div.anim {
	position: absolute;
	/* Bottom Right corner */
	/*
	top: 45%;
	right: 10%;
	*/
	/* Over the text */
	top: 35%;
	right: 35%;
	border: none;
	z-index: 7;
	pointer-events: none;
}

img.anim {
	display: block;
	opacity: 0.4;
	z-index: 7;
}