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

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

   BUTTON DEFINITIONS 
  
   Edit below at your own risk, everything done here is for a reason for cross browser
   compatibility so that the buttons will appear identical in the tested browsers.
   
   Tested on: IE6 IE7 FF(PC/MAC) Safari SafariMobile Opera(PC/MAC)
   
--------------------------------------------------------------------------------------------------*/

/*-------------------------------*/

button-search,
a.button-search,
a.button-search:link,
a.button-search: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;
  border: none;
  display: block;
  float: left;
  cursor: pointer;
  text-decoration: none;
  outline: none;
  white-space: nowrap;
  overflow: visible;
}

  * html a.button-search,
  * html a.button-search:link,
  * html a.button-search:visited {    
    width: 58px;
  }
  
  button-search span,
  a.button-search span,
  a.button-search:link span,
  a.button-search:visited span {
    /*
        Set the span tags to display: block, as they will work our background-image magic.
    */
    display: block;
  }
  
 button-search,
a.button-search,
a.button-search:link,
a.button-search:visited {
  /* 
      HEIGHT - Total height of button. 
  */
  height: 24px; 

  /*
      NOTE - You must define the font here otherwise your buttons and links could end up diffrent.
  */
  font-size: 13px;
  color: #fff;
  background-color: #ffffff;
}

  button-search span,
  a.button-search span,
  a.button-search:link span,
  a.button-search:visited span {
  	padding: 0 10px 0 3px;
    color: #fff;    
    font-size:14px;
    line-height:22px;
    height: 25px;
    background: url(../images/btn-empty.gif) no-repeat top right;
  }

  button-search:hover,
  a.button-search:hover span {
  	padding: 0 10px 0 3px;
    color: #fff;    
    font-size:14px;
    line-height:22px;
    background: url(../images/btn-empty-h.gif) no-repeat top right;
  }

/*-------------------------------*/


a.buttonlogin{
	margin: 0px 0px 0px 0px !important;
}

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

  button, x:-moz-any-link {
    /*
        FF fix to make button spacing even across browsers.
    */
    margin: 0 0 0 0;
  }
    
  *:first-child+html button {
    /*
        Reset IE7 back to what it was for previous fix.
    */
    margin: 0 3px 0 3px;
  }

  button span,
  a.button span,
  a.button:link span,
  a.button:visited span,    
  a.buttoninv span,
  a.buttoninv:link span,
  a.buttoninv:visited span,
  a.buttonlogin span,
  a.buttonlogin:link span,
  a.buttonlogin:visited span {
    /*
        Set the span tags to display: block, as they will work our background-image magic.
    */
    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,
a.button,
a.button:link,
a.button:visited,
a.buttoninv,
a.buttoninv:link,
a.buttoninv:visited,
a.buttonlogin,
a.buttonlogin:link,
a.buttonlogin: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-size: 13px;
  color: #fff;
  background-color: #ffffff;
  font-weight:bold;
}

  button.button_active,
  a.button_active {
  }
  
  button span,
  a.button span,
  a.button:link span,
  a.button:visited span {
    padding: 0 14px 0 0;
    height: 25px;
    background: url(../images/bg_nbutton_r.gif) no-repeat top right;
  }

  button span span,
  a.button span span,
  a.button:link span span,
  a.button:visited span span {
    padding: 0 0 1px 13px;
    height: 24px;
    line-height: 24px;
    background: url(../images/bg_nbutton.gif) no-repeat top left;
  }

	button:hover,
  a.button:hover span {
    color: #fff;
    font-weight:bold;
    background: url(../images/bg_nbutton_r_hover.gif) no-repeat top right;
  }
  a.button:hover span span {
    padding: 0 0 1px 13px;
    height: 24px;
    line-height: 24px;
    background: url(../images/bg_nbutton_hover.gif) no-repeat top left;
  }
  
    buttoninv span,
  a.buttoninv span,
  a.buttoninv:link span,
  a.buttoninv:visited span,
	buttonlogin span,
  a.buttonlogin span,
  a.buttonlogin:link span,
  a.buttonlogin:visited span {
    padding: 0 12px 0 0;
    height: 25px;
    background: url(../images/bg_nbutton_r_hover.gif) no-repeat top right;
  }

  button span span,
  a.buttoninv span span,
  a.buttoninv:link span span,
  a.buttoninv:visited span span,
  a.buttonlogin span span,
  a.buttonlogin:link span span,
  a.buttonlogin:visited span span {
    padding: 0 0 1px 13px;
    height: 24px;
    line-height: 24px;
    background: url(../images/bg_nbutton_hover.gif) no-repeat top left;
  }
  

  /**/ 
  a.buttoninv_big{
    color: #fff;
    padding: 5px 0px;     
    display: block; 
    width: 190px;   
    margin: 0px auto;    
    font-size: 13px;
    font-weight:bold;
    text-decoration:none;
    background: url(../images/bg_nbutton_big_blue.gif) no-repeat;    
  }
  

   a.buttoninv_big:hover{
    background: url(../images/bg_nbutton_big_green.gif) no-repeat;
  }
  /**/  

  button:hover,
  a.buttoninv:hover span,
  a.buttonlogin:hover span {
    color: #fff;
    font-weight:bold;
    background: url(../images/bg_nbutton_r.gif) no-repeat top right;
    
  }
  a.buttoninv:hover span span,
  a.buttonlogin:hover span span {
    padding: 0 0 1px 13px;
    height: 24px;
    line-height: 24px;
    background: url(../images/bg_nbutton.gif) no-repeat top left;
  }  

  button.submit span,
  a.submit span,
  a.submit:link span,
  a.submit:visited span {
  }

  button.submit span span,
  a.submit span span,
  a.submit:link span span,
  a.submit:visited span span {
    padding-left: 26px;
    background-image: url(../images/bg_button_left_submit.gif);
  }

  button.submit:hover,
  a.submit:hover {
  }

  button.cancel span,
  a.cancel span,
  a.cancel:link span,
  a.cancel:visited span {
  }

  button.cancel span span,
  a.cancel span span,
  a.cancel:link span span,
  a.cancel:visited span span {
    padding-left: 26px;
    background-image: url(../images/bg_button_left_cancel.gif);
  }

  button.cancel:hover,
  a.cancel:hover {
  }

  button:active span,
  a:active:active span,
  /*
      'button_active' is the class used by SimplyButtons.js to create the button states in IE.
  */
  button.button_active span,
  a.button_active:active span {
    /*
        Using the 'Sliding Doors' Technique we 'slide' the new button state into view.
    */
    background-position: bottom right;
  }

  button:active span span,
  a:active:active span span,
  /*
      'button_active' is the class used by SimplyButtons.js to create the button states in IE.
  */
  button.button_active span span,
  a.button_active:active span span {
    /*
        Using the 'Sliding Doors' Technique we 'slide' the new button state into view.
    */
    background-position: bottom left;
  }
  
  /* addition for sidebarbuttons */ 
  a.sidebarbutton, a.sidebarbutton:active, a.sidebarbutton:link, a.sidebarbutton:visited, a.sidebarbutton:hover {
	float: none;
	margin: 0 15px;	
  }
  

