/*--------------------------------------------------------------------------------------------------
  
   Simply Buttons, version 1.0
   (c) 2007-2009 Kevin Miller

   This script is freely distributable under the terms of an MIT-style license.
   
--------------------------------------------------------------------------------------------------*/

/*REGULAR BUTTONS*/

button, .button, a.button, a.button:link, a.button:visited
{
    /* Strip down the button and link elements to a base we can work with.  */
    padding: 0 0 0 0;
    margin: 0 3px 0 0px;
    background: none;
    border: none;
    display: block;
    float: left;
    cursor: pointer;
    text-decoration: none;
    outline: 0;
    white-space: nowrap;
    overflow: visible;
}

/* IE6 fix to make link fit text.   */
* html a.button, * html a.button:link, * html a.button:visited
{
    width: 1%;
}

/*  FF fix to make button spacing even across browsers. */
button, x:-moz-any-link
{
    margin: 0 0 0 0;
}

/* Reset IE7 back to what it was for previous fix. */
*:first-child + html button
{
    margin: 0 3px 0 3px;
}

/* Set the span tags to display: block, as they will work our background-image magic. */
button span, .button span, a.button span, a.button:link span, a.button:visited span
{
    display: block;
}

/*--------------------------------------------------------------------------------------------------
  
   CUSTOMIZATIONS 
  
   Edit below to change the look and feel of the buttons and even add more classes for
   different looks and feels.
   
--------------------------------------------------------------------------------------------------*/

button, .button span input, a.button, a.button:link, a.button:visited
{
    /*  HEIGHT - Total height of button.  */
    height: 26px; /* NOTE - You must define the font here otherwise your buttons and links could end up diffrent. */
    font-family: "dejarip-1" , "dejarip-2" , Arial, Helvetica, Tahoma, sans-serif;
    font-size: 1.1em;
    font-weight: bold;
    color: #ebf7ff;
    text-shadow: 0px -1px 0px #09f;
}

button span, .button span, a.button span, a.button:link span, a.button:visited span
{
    /* Right side padding for button (default).  */
    padding: 0 20px 0 0; /*  SPAN HEIGHT - This should be 2px smaller than the height set on the button (see HEIGHT).  */
    height: 24px; /* We define our background top left and use the 'Sliding Doors' Technique for some fast loading buttons. */
    background: url(/graphics/buttons/button-sprite.png) no-repeat top right;
}

button span span, .button span input, a.button span span, a.button:link span span, a.button:visited span span
{
    /*  Left side padding for button (default). */
    padding: 0 0 0 20px; /* SPAN HEIGHT - This should be 1px smaller than the height set on the button (see HEIGHT). */
    height: 24px; /* SPAN LINE-HEIGHT - This should be 1px smaller than the height set on the button (see HEIGHT) and will center the text vertcailly. */
    line-height: 24px; /* We define our background top left and use the 'Sliding Doors' Technique for some fast loading buttons.*/
    background: url(/graphics/buttons/button-sprite.png) no-repeat left -602px;
}

/*added for the new use of inputs in this solution */
.button span {float:left;}
.button span input {display:block;float:left;border:0;-webkit-border-radius: 0;-moz-border-radius: 0;border-radius: 0;padding-bottom:3px;cursor:pointer;}

button:focus, a.button:focus, .button:focus, button:hover, a.button:hover, .button:hover
{
    color: #fff;
}
button:focus span, a.button:focus span, .button:focus span, button:hover span, a.button:hover span, .button:hover span
{
    background-position: right -30px;
}
button:focus span span, a.button:focus span span, .button:focus span input, button:hover span span, a.button:hover span span, .button:hover span input
{
    background-position: left -632px;
}

/*secondary version*/

button.secondary, a.button.secondary, a.button.secondary:link, a.button.secondary:visited
{
    color: #444;
    text-shadow: 0px 1px 0px #eee;
}

button.secondary span, a.button.secondary span, a.button.secondary:link span, a.button.secondary:visited span
{
    background-image: url(/graphics/buttons/button-sprite.png);
    background-position: right -241px;
}

button.secondary span span, a.button.secondary span span, a.button.secondary:link span span, a.button.secondary:visited span span
{
    background-image: url(/graphics/buttons/button-sprite.png);
    background-position: left -843px;
}

button.secondary:focus span, a.button.secondary:focus span, button.secondary:hover span, a.button.secondary:hover span
{
    background-position: right -271px;
}

button:focus.secondary span span, a.button.secondary:focus span span, button.secondary:hover span span, a.button.secondary:hover span span
{
    background-position: left -873px;
}

button.secondary:focus, a.button.secondary:focus, button.secondary:hover, a.button.secondary:hover
{
    color: #222;
}

/*secondary version*/ /*Right arrow icon version  */

button.secondary.right_arrow span, a.button.secondary.right_arrow span, a.button.secondary.right_arrow:link span, a.button.secondary.right_arrow:visited span
{
    background-image: url(/graphics/buttons/button-sprite.png);
    background-position: right -361px;
}

button.secondary.right_arrow span span, a.button.secondary.right_arrow span span, a.button.secondary.right_arrow:link span span, a.button.secondary.right_arrow:visited span span
{
    background-image: url(/graphics/buttons/button-sprite.png);
    background-position: left -843px;
}

button.secondary.right_arrow:focus span, a.button.secondary.right_arrow:focus span, button.secondary.right_arrow:hover span, a.button.secondary.right_arrow:hover span
{
    background-position: right -391px;
}

button:focus.secondary.right_arrow span span, a.button.secondary.right_arrow:focus span span, button.secondary.right_arrow:hover span span, a.button.secondary.right_arrow:hover span span
{
    background-position: left -873px;
}

/* For dark background #444444 new set of button images */
button.alt span, a.button.alt span, a.button.alt:link span, a.button.alt:visited span
{
    background-image: url(/graphics/buttons/24px_blue_right_dark.png);
}
button.alt span span, a.button.alt span span, a.button.alt:link span span, a.button.alt:visited span span
{
    background-image: url(/graphics/buttons/button-sprite.png);
}

/* close version  */
button.close, a.button.close, a.button.close:link, a.button.close:visited
{
    color: #eee;
    text-shadow: 0px -1px 0px #444;
}
button.close span, a.button.close span, a.button.close:link span, a.button.close:visited span
{
    background-image: url(/graphics/buttons/button-sprite.png);
}
button.close span span, a.button.close span span, a.button.close:link span span, a.button.close:visited span span
{
    padding-right: 30px;
    background-image: url(/graphics/buttons/button-sprite.png);
}
button.close:focus, a.button.close:focus, button.close:hover, a.button.close:hover
{
    color: #fff;
}

/* Buy icon version */
button.buy span, a.buy span, a.buy:link span, a.buy:visited span
{
    background-position: right -60px;
}
button.buy span span, a.buy span span, a.buy:link span span, a.buy:visited span span
{
    padding-right: 30px;
    background-position: left -602px;
}
button.buy:focus span, a.buy:focus span, button.buy:hover span, a.buy:hover span
{
    background-position: right -90px;
}
button.buy:focus span span, a.buy:focus span span, button.buy:hover span span, a.buy:hover span span
{
    background-position: left -632px;
}

/*Right arrow icon version  */
button.right_arrow span, a.button.right_arrow span, a.button.right_arrow:link span, a.button.right_arrow:visited span
{
    background-position: right -120px;
}
button.button.right_arrow span span, a.button.right_arrow span span, a.button.right_arrow:link span span, a.button.right_arrow:visited span span
{
    padding-right: 30px;
    background-position: left -602px;
}
button.right_arrow:focus span, a.button.right_arrow:focus span, button.button.right_arrow:hover span, a.button.right_arrow:hover span
{
    background-position: right -150px;
}
button.right_arrow:focus span span, a.button.right_arrow:focus span span, button.button.right_arrow:hover span span, a.button.right_arrow:hover span span
{
    background-position: left -632px;
}


/* additional close version for widget to nullify .buy class*/
button.buy.close, a.button.buy.close, a.button.buy.close:link, a.button.buy.close:visited
{
    color: #eee;
    text-shadow: 0px -1px 0px #444;
}

button.buy.close span, a.button.buy.close span, a.button.buy.close:link span, a.button.buy.close:visited span
{
    background-image: url(/graphics/buttons/button-sprite.png);
    background-position: right -482px;
}

button.buy.close span span, a.button.buy.close span span, a.button.buy.close:link span span, a.button.buy.close:visited span span
{
    padding-right: 30px;
    background-image: url(/graphics/buttons/button-sprite.png);
    background-position: left -1084px;
}

button.buy.close:focus span, a.button.buy.close:focus span, button.buy.close:hover span, a.button.buy.close:hover span
{
    background-position: right -512px;
}

button.buy.close:focus span span, a.button.buy.close:focus span span, button.buy.close:hover span span, a.button.buy.close:hover span span
{
    background-position: left -1114px;
}

button.buy.close:focus, a.button.buy.close:focus, button.buy.close:hover, a.button.buy.close:hover
{
    color: #fff;
}

/* additional close version for widget to nullify .right_arrow class */
button.right_arrow.close, a.button.right_arrow.close, a.button.right_arrow.close:link, a.button.buy.close:visited
{
    color: #eee;
    text-shadow: 0px -1px 0px #444;
}
button.right_arrow.close span, a.button.right_arrow.close span, a.button.right_arrow.close:link span, a.button.right_arrow.close:visited span
{
    background-image: url(/graphics/buttons/button-sprite.png);
    background-position: right -482px;
}
button.right_arrow.close span span, a.button.right_arrow.close span span, a.button.right_arrow.close:link span span, a.button.right_arrow.close:visited span span
{
    padding-right: 30px;
    background-image: url(/graphics/buttons/button-sprite.png);
    background-position: left -1084px;
}

button.right_arrow.close:focus span, a.button.right_arrow.close:focus span, button.right_arrow.close:hover span, a.button.right_arrow.close:hover span
{
    background-position: right -512px;
}

button.right_arrow.close:focus span span, a.button.right_arrow.close:focus span span, button.right_arrow.close:hover span span, a.button.right_arrow.close:hover span span
{
    background-position: left -1114px;
}

button.right_arrow.close:focus, a.button.right_arrow.close:focus, button.right_arrowy.close:hover, a.button.right_arrow.close:hover
{
    color: #fff;
}