/* sorry for the mess down there - will tidy up asap! */



body			{ background:#3B4D61 url(../img/bg.jpg) 50% 0 repeat; }
h1				{ font:bold 40px Tahoma, Helvetica, Arial, Sans-Serif; text-align:center; color:#1F2F3F; text-shadow:0px 2px 2px #74818F; }
h1 .smaller		{ font-size:24px; }
h1 .evensmaller	{ font-size:18px; text-shadow:0px 1px 1px #74818F; }

#wrapper		{ position:relative; width:450px; height:117px; margin:100px auto 0; }

#pattern,
#color,
#logobox		{ position:absolute; top:0; left:0; width:450px; height:117px;}
#color			{ background:#34AECB; z-index:90; }
#pattern		{ background:transparent url(../img/pattern1.jpg) 0 0 repeat-y; z-index:95; display:none; }
#logobox		{ background:transparent url(../img/pp-logo-mask.png) no-repeat 0 0; z-index:100; }



#options		{ position:relative; width:400px; height:340px; margin:70px auto 50px; padding:5px 10px; background:rgba(0,0,0,0.35); border:2px solid black; -moz-border-radius:20px; -webkit-border-radius:20px; -moz-box-shadow: 0px 0px 40px #000; -webkit-box-shadow: 0px 0px 40px #000; box-shadow: 0px 0px 40px #000; }
h2				{ font:bold 18px/15px Tahoma, Helvetica, Arial, Sans-Serif; text-align:center; color:#000; text-shadow:1px 1px 1px #5F5F5F; }
h3				{ font:bold 13px/12px Tahoma, Helvetica, Arial, Sans-Serif; color:#DFF1FF; text-shadow:1px 1px 1px #000; padding-bottom:2px; border-bottom:1px solid #83A5BF; }

#patternbuttons	{ margin:auto 0 10px 10px; }
.button:focus	{ outline:none; }
.button			{ text-decoration:none; border:1px solid #000; background:#8F8F8F; padding:1px 10px; margin-right:10px; font:normal 13px/12px Tahoma, Helvetica, Arial, Sans-Serif; color:#000; -moz-border-radius: 4px; -webkit-border-radius: 4px; border-radius: 4px; }
.button:hover	{ background:#AFAFAF; }


/* slider styles */
.sliderinfo					{ float:left; margin-left:10px; font:normal 12px/15px Tahoma, Helvetica, Arial, Sans-Serif; text-align:center; color:#7F7F7F; text-shadow:1px 1px 0 #000; }
.clear						{ clear:both; }
.slider						{ float:right; display:inline; width:80%; height:10px; margin:0 10px 10px auto; background:transparent; border:1px solid black !important; }
.slider a				   	{ margin-top:5px !important; margin-left:-4px !important; width:10px !important; height:10px !important; cursor:pointer !important; }
#red .ui-slider-range		{ background:#f00; }
#green .ui-slider-range		{ background:#0f0; }
#blue .ui-slider-range		{ background:#00f; }


.forpattern,
.foranimation	{ display:none; }









/* nothing important below this line! */ 

#footer			{ position:absolute; bottom:5px; width:400px; text-align:center; margin:0 auto; }
#footer a		{ text-decoration:none; color:#6F777F; font:normal 12px/12px Tahoma, Helvetica, Arial, Sans-Serif; }
a#tutoriallink		{ font:bold 14px/12px Tahoma, Helvetica, Arial, Sans-Serif; }
#footer a:hover	{ color:#BFDEFF; }

/* twitter and bananas stuff */
#bananasbubble	{ bottom:20px; left:70px; width:270px; padding:7px 10px; }
#bananas		{ position:absolute; bottom:5px; left:10px; width:60px; height:50px; }
#followmebubble	{ bottom:40px; right:60px; }
.bubble			{ display:none; position:absolute; padding:3px 10px; color:#D1D8DF; background:#1F1F1F; background:rgba(0,0,0,0.5); text-align:center; -moz-border-radius:5px; -webkit-border-radius:5px; font:bold 10px/12px Tahoma, Helvetica, Arial, Sans-Serif; }
#followme		{ position:absolute; bottom:10px; right:10px; width:50px; height:50px; }
#followme img,
#bananas img	{ border:0; }
#retweet		{ position:absolute; bottom:10px; right:80px; height:15px; padding:2px 12px; color:#fff; background:#95cd3c; text-decoration:none; border:2px solid #80b62a; font:bold 15px/13px Tahoma, Helvetica, Arial, Sans-Serif; text-align:center; -moz-border-radius:5px; -webkit-border-radius:5px; box-shadow: 2px 2px 5px #000; -moz-box-shadow: 2px 2px 5px #000; -webkit-box-shadow: 2px 2px 5px #000; }
#retweet:hover	{ color:#80b62a; background:#fff; border:1px solid black; }
.bananas		{ color:#FFD000; }
.twitter		{ color:#0092FF; }