/**
* #.# Stylesheet for Simple Box Categories.
*
* Plugin and all its components made by Alexander Tchernitchenko ( www.tchernitchenko.com/simple-box-categories )
*/

/* Import Open Sans font */
@import url("http://fonts.googleapis.com/css?family=Open+Sans:400,300,300italic");


/**
* #.# Admin menu styling
*
* All admin menu styling goes here
*/

/* Advanced options button */
.sbc-advanced-options-button {
  text-decoration:underline;
  cursor:pointer;
  color: #21759b;
  font-style:italic;
}


/**
* #.# Category buttons
*
* Basic layout for the category cloud buttons.
*/
.sbc-box-container {
  text-align:center;
  margin-bottom:15px;
}

.sbc-box {
  font-family: "Open Sans", sans-serif;
  font-size: 10px;
  font-weight: 300;
  margin: 1.5px -0.5px 1.5px -0.5px;
  padding: 5px 10px 5px 10px;
  text-transform: uppercase;
}


/* Used to set the margin-bottom after the last category button. */
/*.sbc-box:last-child {
  margin-bottom: 15px;
}
*/

/**
* #.# Button animations
*
* Using two animations from IanLunn @ Github the entire package is found at:
* https://github.com/IanLunn/Hover
*/

/* Grow */
.sbc-hvr-grow {
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
  box-shadow: 0 0 1px rgba(0, 0, 0, 0);
  display: inline-block;
  -webkit-transform: translateZ(0);
  transform: translateZ(0);
  -moz-osx-font-smoothing: grayscale;
  -webkit-transition-duration: 0.2s;
  transition-duration: 0.2s;
  -webkit-transition-property: transform;
  transition-property: transform;
  vertical-align: middle;
}

.sbc-hvr-grow:hover,
.hvr-grow:focus,
.hvr-grow:active {
  -webkit-transform: scale(1.045);
  transform: scale(1.045);
}

/* Fade */
.sbc-hvr-fade {
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
  box-shadow: 0 0 1px rgba(0, 0, 0, 0);
  display: inline-block;
  overflow: hidden;
  -webkit-transform: translateZ(0);
  transform: translateZ(0);
  -moz-osx-font-smoothing: grayscale;
  -webkit-transition-duration: 0.3s;
  transition-duration: 0.3s;
  -webkit-transition-property: color, background-color;
  transition-property: color, background-color;
  vertical-align: middle;
}