/*
 * Phoenix Buttons CSS
 * @author Keegan Watkins
 * @author Levi Sitters - 2012
 * Styles for the gel buttons
 */

/******** PNX Buttons  ********/
.pnx-btn{
	display: inline-block;
	*display: inline;
	*zoom: 1;
	font-size: 12px;
	font-weight: bold;
	color: #FFF!important;
	text-align: center;
	border: 1px solid #7DACCE;
	white-space: nowrap;
	-webkit-border-radius: 4px;
	-moz-border-radius: 4px;
	border-radius: 4px;
	background-image: linear-gradient(top, rgb(219,232,242) 39%, rgb(169,200,223) 70%);
	background-image: -o-linear-gradient(top, rgb(219,232,242) 39%, rgb(169,200,223) 70%);
	background-image: -moz-linear-gradient(top, rgb(219,232,242) 39%, rgb(169,200,223) 70%);
	background-image: -webkit-linear-gradient(top, rgb(219,232,242) 39%, rgb(169,200,223) 70%);
	background-image: -ms-linear-gradient(top, rgb(219,232,242) 39%, rgb(169,200,223) 70%);
	cursor:pointer;
	position: relative;
}

.pnx-btn span{
	margin: 1px;
	-webkit-border-radius: 4px;
	-moz-border-radius: 4px;
	border-radius: 4px;
	display: inline-block;
	*display: inline;
	*zoom: 1;
	background: url('/widgets/pnx/1.0/img/buttons/pnx.btns.flat.png') 0 0px repeat-x;
	padding: 0px 12px;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	border-radius: 3px;
	height: 26px;
	line-height: 26px;
}
.pnx-btn span:hover{
	background-position: 0 -36px;
}
.pnx-btn span:active{
	background-position: 0 -72px;
}
.pnx-btn.pnx-btn-disabled span:active{
	background-position: 0 -36px;
}
	
.pnx-btn:active{
	background-image: linear-gradient(top, rgb(129,174,208) 39%, rgb(205,223,236) 70%);
	background-image: -o-linear-gradient(top, rgb(129,174,208) 39%, rgb(205,223,236) 70%);
	background-image: -moz-linear-gradient(top, rgb(129,174,208) 39%, rgb(205,223,236) 70%);
	background-image: -webkit-linear-gradient(top, rgb(129,174,208) 39%, rgb(205,223,236) 70%);
	background-image: -ms-linear-gradient(top, rgb(129,174,208) 39%, rgb(205,223,236) 70%);
}
.pnx-btn.pnx-btn-disabled:active{
	background-image: linear-gradient(top, rgb(219,232,242) 39%, rgb(169,200,223) 70%);
	background-image: -o-linear-gradient(top, rgb(219,232,242) 39%, rgb(169,200,223) 70%);
	background-image: -moz-linear-gradient(top, rgb(219,232,242) 39%, rgb(169,200,223) 70%);
	background-image: -webkit-linear-gradient(top, rgb(219,232,242) 39%, rgb(169,200,223) 70%);
	background-image: -ms-linear-gradient(top, rgb(219,232,242) 39%, rgb(169,200,223) 70%);
}

/******** Primary Overrides ********/
.pnx-btn-primary{
	border: 1px solid #AEC96F;
	background-image: linear-gradient(top, rgb(232,242,210) 39%, rgb(202,217,167) 70%);
	background-image: -o-linear-gradient(top, rgb(232,242,210) 39%, rgb(202,217,167) 70%);
	background-image: -moz-linear-gradient(top, rgb(232,242,210) 39%, rgb(202,217,167) 70%);
	background-image: -webkit-linear-gradient(top, rgb(232,242,210) 39%, rgb(202,217,167) 70%);
	background-image: -ms-linear-gradient(top, rgb(232,242,210) 39%, rgb(202,217,167) 70%);
}
.pnx-btn-primary:active{
	background-image: linear-gradient(top, rgb(181,202,131) 39%, rgb(222,237,192) 70%);
	background-image: -o-linear-gradient(top, rgb(181,202,131) 39%, rgb(222,237,192) 70%);
	background-image: -moz-linear-gradient(top, rgb(181,202,131) 39%, rgb(222,237,192) 70%);
	background-image: -webkit-linear-gradient(top, rgb(181,202,131) 39%, rgb(222,237,192) 70%);
	background-image: -ms-linear-gradient(top, rgb(181,202,131) 39%, rgb(222,237,192) 70%);
}
.pnx-btn-primary.pnx-btn-disabled:active {
	background-image: linear-gradient(top, rgb(232,242,210) 39%, rgb(202,217,167) 70%);
	background-image: -o-linear-gradient(top, rgb(232,242,210) 39%, rgb(202,217,167) 70%);
	background-image: -moz-linear-gradient(top, rgb(232,242,210) 39%, rgb(202,217,167) 70%);
	background-image: -webkit-linear-gradient(top, rgb(232,242,210) 39%, rgb(202,217,167) 70%);
	background-image: -ms-linear-gradient(top, rgb(232,242,210) 39%, rgb(202,217,167) 70%);
}

.pnx-btn-primary span{
	background-position: 0 -108px;
}
.pnx-btn-primary span:hover{
	background-position: 0 -144px;
}
.pnx-btn-primary span:active{
	background-position: 0 -180px;
}
.pnx-btn-primary span.processing{
	background-position: 0 -216px;
}

/******** Secondary Overrides ********/

.pnx-btn-secondary{
	border: 1px solid #E0E0E0;
	background-image: linear-gradient(top, rgb(255,255,255) 39%, rgb(230,230,230) 70%);
	background-image: -o-linear-gradient(top, rgb(255,255,255) 39%, rgb(230,230,230) 70%);
	background-image: -moz-linear-gradient(top, rgb(255,255,255) 39%, rgb(230,230,230) 70%);
	background-image: -webkit-linear-gradient(top, rgb(255,255,255) 39%, rgb(230,230,230) 70%);
	background-image: -ms-linear-gradient(top, rgb(255,255,255) 39%, rgb(230,230,230) 70%);
	color: #666!important;
}
.pnx-btn-secondary span{
	background-position: 0 -253px;
}
.pnx-btn-secondary span:hover{
	background-position: 0 -289px;
}
.pnx-btn-secondary:active{
	background-image: linear-gradient(top, rgb(237,237,237) 39%, rgb(255,255,255) 70%);
	background-image: -o-linear-gradient(top, rgb(237,237,237) 39%, rgb(255,255,255) 70%);
	background-image: -moz-linear-gradient(top, rgb(237,237,237) 39%, rgb(255,255,255) 70%);
	background-image: -webkit-linear-gradient(top, rgb(237,237,237) 39%, rgb(255,255,255) 70%);
	background-image: -ms-linear-gradient(top, rgb(237,237,237) 39%, rgb(255,255,255) 70%);
}
.pnx-btn-secondary.pnx-btn-disabled:active{
	background-image: linear-gradient(top, rgb(255,255,255) 39%, rgb(230,230,230) 70%);
	background-image: -o-linear-gradient(top, rgb(255,255,255) 39%, rgb(230,230,230) 70%);
	background-image: -moz-linear-gradient(top, rgb(255,255,255) 39%, rgb(230,230,230) 70%);
	background-image: -webkit-linear-gradient(top, rgb(255,255,255) 39%, rgb(230,230,230) 70%);
	background-image: -ms-linear-gradient(top, rgb(255,255,255) 39%, rgb(230,230,230) 70%);
}

.pnx-btn-secondary span:active{
	background-position: 0 -325px;
}

/******** Navigational Btns ********/
.pnx-btn-nav, .pnx-btn-condensed{
	color: #fff!important;
}
.pnx-nav-secondary{
	color: #666!important;
	border: 1px solid #E0E0E0;
	background-image: linear-gradient(top, rgb(255,255,255) 39%, rgb(230,230,230) 70%);
	background-image: -o-linear-gradient(top, rgb(255,255,255) 39%, rgb(230,230,230) 70%);
	background-image: -moz-linear-gradient(top, rgb(255,255,255) 39%, rgb(230,230,230) 70%);
	background-image: -webkit-linear-gradient(top, rgb(255,255,255) 39%, rgb(230,230,230) 70%);
	background-image: -ms-linear-gradient(top, rgb(255,255,255) 39%, rgb(230,230,230) 70%);
}
.pnx-nav-secondary:active{
	background-image: linear-gradient(top, rgb(237,237,237) 39%, rgb(255,255,255) 70%);
	background-image: -o-linear-gradient(top, rgb(237,237,237) 39%, rgb(255,255,255) 70%);
	background-image: -moz-linear-gradient(top, rgb(237,237,237) 39%, rgb(255,255,255) 70%);
	background-image: -webkit-linear-gradient(top, rgb(237,237,237) 39%, rgb(255,255,255) 70%);
	background-image: -ms-linear-gradient(top, rgb(237,237,237) 39%, rgb(255,255,255) 70%);
}
.pnx-nav-secondary.pnx-btn-disabled:active{
	background-image: linear-gradient(top, rgb(255,255,255) 39%, rgb(230,230,230) 70%);
	background-image: -o-linear-gradient(top, rgb(255,255,255) 39%, rgb(230,230,230) 70%);
	background-image: -moz-linear-gradient(top, rgb(255,255,255) 39%, rgb(230,230,230) 70%);
	background-image: -webkit-linear-gradient(top, rgb(255,255,255) 39%, rgb(230,230,230) 70%);
	background-image: -ms-linear-gradient(top, rgb(255,255,255) 39%, rgb(230,230,230) 70%);
}

.pnx-btn-nav span, .pnx-btn-condensed span{
	background-position: 0 -4px;
	font-size: 11px;
	height: 17px;
	line-height: 17px;
}

.pnx-btn-nav span:hover, .pnx-btn-condensed span:hover{background-position: 0 -40px;}
.pnx-btn-nav span:active, .pnx-btn-condensed span:active{background-position: 0 -76px;}

.pnx-nav-secondary span{
	background-position: 0 -257px;
}

.pnx-nav-secondary span:hover{background-position: 0 -293px;}
.pnx-nav-secondary span:active{background-position: 0 -329px;}

/******** Menu buttons (muttons) works with ********/

.pnx-btn-menu-group{
	position: relative;
}
.pnx-menu-dd-seperator{
	display: inline;
	border-left: 2px ridge #fff;
}

.pnx-btn-menu-group.open .pnx-btn-menu-dd{
	display: block;
}

.pnx-btn-menu-dd{
	display: none;
	width: auto;
	padding: 6px 12px 0px;
	border: 1px solid #E6E6E6;
	position: absolute;
	background: #F9F9F9;
	-webkit-border-radius: 4px;
	-moz-border-radius: 4px;
	border-radius: 4px;
}

.pnx-btn-menu-dd li a{
	color: #333;
}

button.pnx-btn{
	padding: 0;
	margin: 0;
	*overflow: visible;
	*vertical-align: middle
}
button.pnx-btn span{
	*margin: 0;
}


/******** Legacy Buttons ********/


/* All buttons and text */
.pnx-btn-lg, .pnx-btn-lg .pnx-btn-txt, .pnx-btn-sm, .pnx-btn-sm .pnx-btn-txt {
	display:inline-block;
	_position:relative; /* ie6 */
	background:transparent url(../img/buttons/pnx.buttons.flat.png) no-repeat;
	font-weight:bold;
	cursor:pointer;
	color:#fff !important;
	text-decoration:none;
	margin:0px 15px 0px 0px;
	white-space: nowrap;
}

/* All large buttons */
.pnx-btn-lg {
	padding-left:11px;
	margin-right:20px;
}
.pnx-btn-lg .pnx-btn-txt {
	padding-right:11px;
	margin-right:-15px;
}
.pnx-btn-lg, .pnx-btn-lg .pnx-btn-txt { line-height:27px;}

/* Specific large button positions */
.pnx-btn-lg-primary {background-position:0 0px;}
.pnx-btn-lg-primary .pnx-btn-txt {background-position:100% 0px;}
.pnx-btn-lg-secondary {background-position:0 -27px;}
.pnx-btn-lg-secondary .pnx-btn-txt {background-position:100% -27px;}
.pnx-btn-lg-quote {background-position:0 -54px;}
.pnx-btn-lg-quote .pnx-btn-txt {background-position:100% -54px;}
.pnx-btn-lg-transactional {background-position:0 -81px;}
.pnx-btn-lg-transactional .pnx-btn-txt {background-position:100% -81px;}

/* All small buttons */
.pnx-btn-sm {
	padding-left:11px;
	margin-right:16px;
	line-height:16px;
	font-size:11px;
}
.pnx-btn-sm .pnx-btn-txt {
	padding-right:12px;
	margin-right:-12px;
	line-height:16px;
	*line-height:17px; /* ie6-7 */
}

/* Specific small button positions */
.pnx-btn-sm-primary {background-position:0 -108px;}
.pnx-btn-sm-primary .pnx-btn-txt {background-position:100% -108px;}
.pnx-btn-sm-secondary {background-position:0 -125px;}
.pnx-btn-sm-secondary .pnx-btn-txt {background-position:100% -125px;}
.pnx-btn-sm-quote {background-position:0 -142px;}
.pnx-btn-sm-quote .pnx-btn-txt {background-position:100% -142px;}
.pnx-btn-sm-transactional {background-position:0 -159px;}
.pnx-btn-sm-transactional .pnx-btn-txt {background-position:100% -159px;}

/* Navigational buttons (override left/right padding to account for icon) */
.pnx-btn-sm-nav-back {background-position:0 -176px;padding-left:20px;}
.pnx-btn-sm-nav-back .pnx-btn-txt {background-position:100% -176px;}
.pnx-btn-sm-nav-next {background-position:0 -193px;}
.pnx-btn-sm-nav-next .pnx-btn-txt {background-position:100% -193px;padding-right:20px;}

.pnx-btn-disabled {
	opacity:.50;
	filter:alpha(opacity:50); /* ie6-8 */
} 

.pnx-btn-disabled, .pnx-btn-disabled .pnx-btn-txt {
	cursor:not-allowed;
}

.pnx-ribbon {
	font-size: 10px;
	font-weight: bold;
	position: absolute;
        background-color: green;
	background: linear-gradient(top, rgb(149,208,103) 39%, rgb(85,177,14) 70%);
	background: -moz-linear-gradient(top, rgb(149,208,103) 39%, rgb(85,177,14) 70%); /* Firefox */
	background: -webkit-linear-gradient(top, rgb(149,208,103) 39%, rgb(85,177,14) 70%); /* Chrome & Safari */
	background: -ms-linear-gradient(top, rgb(149,208,103) 39%, rgb(85,177,14) 70%); /* I*/
	border: 1px solid #55b104;
	color: #fff;
	text-align: center;
	text-shadow: 1px 1px #888;
        padding: 1px 3px; /* Adjust to suit */
        -moz-box-shadow: -1px 2px 4px #666; /* firefox shadows*/
	-webkit-box-shadow: -1px 2px 4px #666; /* chrome / safari shadows */
	box-shadow: -1px 2px 4px #666; /* general browser support */
	line-height: 1em;
	right: -8px;
	top: -10px
	
}
.pnx-ribbon:after {
 content: "";
 position: absolute;
 display: block;

 border-style: solid;
 border-color: #666 transparent transparent transparent;
 bottom: -7px;
  right: 0px;
   border-width: 6px 6px 0 0;
 
}