/* =========== */
/* ! BUTTONS CSS   */
/* =========== */



#logout-btn {
	background-image: url(../images/logout-btn.png);
	background-position: 0 0;
	display: block;
	height: 32px;
	margin: 4px 0 0 0;
	position: absolute;
	right: 0;
	top: -8px;
	width: 109px;
}

#logout-btn:hover { 
	background-position: 0 -33px; 
}	

#logout-btn:active {
	background-position: 0 -32px;
}

#my-acc-btn {
	background-image: url(../images/my-acc-btn.png);
	background-position: 0 0;
	display: block;
	height: 32px;
	margin: 4px 0 0 0;
	position: absolute;
	right: 115px;
	top: -8px;
	width: 109px;
}

#my-acc-btn:hover { 
	background-position: 0 -33px; 
}	

#my-acc-btn:active {
	background-position: 0 -32px;
}

#big-signup-btn {
	background-image: url(../images/big-signup-btn.png);
	background-position: 0 0;
	display: block;
	height: 68px;
	left: 80px;
	position: absolute;
	text-decoration: none;
	top: 220px;
	width: 335px;
}

#big-signup-btn:hover { 
	background-position: 0 68px; 
}

#big-signup-btn:active {
	background-position: 0 0px; 
}

#fb-connect-btn-index {
	left: 132px;
	position: absolute;
	top: 245px;
}

#view-users-fp-btn {
	background-image: url(../images/view-users-fp.jpg);
	background-position: 0 0;
	display: block;
	height: 30px;
	margin: 0 0 10px 1px;
	text-decoration: none;
	width: 274px;
}

#view-users-fp-btn:hover { 
	background-position: 0 30px; 
}

#view-users-fp-btn:active {
	background-position: 0 0px; 
}

.newest-fp-btn {
	background-image: url(../images/newest-fp-btn.png);
	background-position: 0 0;
	display: block;
	height: 24px;
	width: 85px;
}

.newest-fp-btn:hover { 
	background-position: 0 -23px; 
}

.newest-fp-btn:active { 
	background-position: 0 -46px; 
}

.favd-fp-btn {
	background-image: url(../images/favd-fp-btn.png);
	background-position: 0 0;
	display: block;
	height: 23px;
	left: 90px;
	position: relative;
	bottom: 24px;
	width: 85px;
}

.favd-fp-btn:hover { 
	background-position: 0 -23px; 
}

.favd-fp-btn:active { 
	background-position: 0 -47px; 
}

.random-fp-btn {
	background-image: url(../images/random-fp-btn.png);
	background-position: 0 0;
	display: block;
	height: 23px;
	left: 180px;
	position: relative;
	bottom: 47px;
	width: 85px;
}

.random-fp-btn:hover { 
	background-position: 0 -23px; 
}

.random-fp-btn:active { 
	background-position: 0 -46px; 
}

.page-next-btn {
	background-image: url(../images/next-btn.png);
	background-position: 0 0;
	display: block;
	height: 23px;
	width: 22px;
}

.page-next-btn:hover { 
	background-position: 0 -23px; 
}

.page-next-btn:active {
	background-position: 0 -46px;
}

.page-prev-btn {
	background-image: url(../images/previous-btn.png);
	background-position: 0 0;
	display: block;
	height: 23px;
	width: 22px;
}

.page-prev-btn:hover { 
	background-position: 0 -23px; 
}

.page-prev-btn:active {
	background-position: 0 -46px;
}

.edit-fp-btn {
	background-image: url(../images/edit-fp-btn.png);
	background-position: 0 0;
	display: block;
	height: 25px;
	width: 73px;
}

.delete-fp-btn:hover { 
	background-position: 0 -25px; 
}

.delete-fp-btn {
	background-image: url(../images/delete-fp-btn.png);
	background-position: 0 0;
	display: block;
	height: 25px;
	width: 73px;
}

.edit-fp-btn:hover { 
	background-position: 0 -25px; 
}

#worlds-fp-btn {
	background-image: url(../images/worlds-fp-btn.png);
	background-position: 0 0;
	display: block;
	height: 24px;
	left: 0;
	position: absolute;
	top: 0px;
	width: 122px;
}

#worlds-fp-btn:hover { 
	background-position: 0 -24px; 
}

#worlds-fp-btn:active { 
	background-position: 0 -49px; 
}

#friends-fp-btn {
	background-image: url(../images/friends-fp-btn.png);
	background-position: 0 0;
	display: block;
	height: 24px;
	left: 130px;
	position: absolute;
	top: 0px;
	width: 122px;
}

#friends-fp-btn:hover { 
	background-position: 0 -24px; 
}

#friends-fp-btn:active { 
	background-position: 0 -49px; 
}

/*
.button {	
	border: 0px none;	
	display: block;
	float: left;
	font-family: Arial, sans-serif;
	font-size: 11px;
	background: url("../images/btn-left.png") no-repeat left top;
	line-height: 17px;
	margin: 0px 2px 0px 2px;
	padding: 0 0 0 16px;
	text-transform: uppercase;
}
.button a, .button span a {
	color: #747474;
	float: left;
	display: block;
	background: url("../images/btn-right.png") no-repeat right top;
	line-height: 17px;
	padding: 8px 15px 7px 0px;
	text-decoration: none;
	font-weight: bold;
	text-shadow: 0px 1px 1px #FFF;
}

.button:hover {
	background: url("../images/btn-left.png") no-repeat left top;
	border: 0px none;
}

.button a:hover, .button span a:hover {
	background: url("../images/btn-right.png") no-repeat right top;
	border: 0px none;
	color: #000;
	text-decoration: none;
}

.btn {	
	border: 0px none;
	display: block;
	float: left;
	font-family: Arial, sans-serif;
	font-size: 11px;
	background: url("../images/btn-2-left.png") no-repeat left top;
	margin: -1px 0 0 0;
	padding: 0 0 0 17px;
	
}
.btn a {
	color: #747474;
	float: left;
	display: block;
	background: url("../images/btn-2-right.png") no-repeat right top;
	padding: 12px 16px 10px 0px;
	text-decoration: none;
	text-transform: uppercase;
	font-weight: bold;
	text-shadow: 0px 1px 1px #FFF;
}

.btn:hover {
	background: url("../images/btn-2-left.png") no-repeat left top;
	border: 0px none;
	color: #000;
}

.btn a:hover {
	background: url("../images/btn-2-right.png") no-repeat right top;
	border: 0px none;
	color: #000;
}

li.button .a-left {
	line-height: 20px;
}

.img-btn {
	opacity: .5;
	-moz-opacity: .5;
	filter:alpha(opacity=50);
}

.img-btn:hover {
	opacity: 1.0;
	-moz-opacity: 1.0;
	filter:alpha(opacity=100);
}

*/

.button {
background: #F8F8F8 url(/images/gradient.png) repeat-x;
cursor: pointer;
display: inline-block;
line-height: 1;
margin: 0px 5px 5px 0px;
padding: 8px 12px 7px;
position: relative;
text-shadow: 0 1px 1px rgba(255,255,255,0.25);
box-shadow: 0 1px 1px rgba(0,0,0,0.4);
-moz-box-shadow: 0 1px 1px rgba(0,0,0,0.4);
-webkit-box-shadow: 0 1px 1px rgba(0,0,0,0.4);
border-radius: 30px;
-moz-border-radius: 30px;
-webkit-border-radius: 30px;
}

.button>img {
margin: 0 0 -2px 0;
}

.button:active {
-moz-box-shadow: 0 1px 2px rgba(0,0,0,0.2);
-webkit-box-shadow: 0 1px 2px rgba(0,0,0,0.2);
}

a.button { 
color: #747474;
font: bold 13px Arial, sans-serif;
text-decoration: none;
text-shadow: 0px 1px 1px #FFF;
}

a.button:hover {
background: #F8F8F8 url(/images/gradient.png) repeat-x;
color: #000;
}

a.button:active {
background: #E6E6E6;
color: #747474;
position: relative;
top: 1px;
}

.btn {
background: #D1D1D1 url(/images/gradient.png) repeat-x;
cursor: pointer;
display: inline-block;
line-height: 1;
margin: 1px 5px 0px 0px;
padding: 8px 12px 7px;
position: relative;
text-shadow: 0 1px 1px rgba(255,255,255,0.25);
box-shadow: 0 1px 2px rgba(0,0,0,0.5);
-moz-box-shadow: 0 1px 2px rgba(0,0,0,0.5);
-webkit-box-shadow: 0 1px 2px rgba(0,0,0,0.5);
border-radius: 30px;
-moz-border-radius: 30px;
-webkit-border-radius: 30px;
}

.btn:active {
-moz-box-shadow: 0 1px 2px rgba(0,0,0,0.2);
-webkit-box-shadow: 0 1px 2px rgba(0,0,0,0.2);
}

.btn a {
color: #747474;
font: bold 13px Arial, sans-serif;
text-decoration: none;
text-shadow: 0px 1px 1px #FFF;
}

a.btn { 
color: #747474;
font: bold 13px Arial, sans-serif;
text-decoration: none;
text-shadow: 0px 1px 1px #FFF;
}

a.btn:hover {
background: #D1D1D1 url(/images/gradient.png) repeat-x;
color: #000;
}

a.btn:active {
background: #E6E6E6;
color: #747474;
position: relative;
top: 1px;
}

.gen-button {
background: #0D778F url(/images/gradient.png) repeat-x;
cursor: pointer;
display: inline-block;
line-height: 1;
margin: 0px 5px 5px 0px;
padding: 6px 10px 6px;
left: 544px;
position: absolute;
top: -5px;
text-shadow: 0 1px 1px rgba(255,255,255,0.25);
box-shadow: 0 1px 1px #FFF;
-moz-box-shadow: 0 1px 1px #FFF;
-webkit-box-shadow: 0 1px 1px #FFF;
border-radius: 30px;
-moz-border-radius: 30px;
-webkit-border-radius: 30px;
}

.gen-button:active {
-moz-box-shadow: 0 1px 2px rgba(0,0,0,0.2);
-webkit-box-shadow: 0 1px 2px rgba(0,0,0,0.2);
}

a.gen-button { 
color: #FFF;
font: bold 11px Arial, sans-serif;
text-decoration: none;
text-shadow: 0px -1px 1px #094755;
}

a.gen-button:hover {
background: #0B6D83 url(/images/gradient.png) repeat-x;
color: #FFF;
}

a.gen-button:active {
background: #085F72;
color: #FFF;
box-shadow: 0 1px 1px #FFF;
-moz-box-shadow: 0 1px 1px #FFF;
-webkit-box-shadow: 0 1px 1px #FFF;
position: relative;
top: 1px;
}

