/* Component containers
----------------------------------*/
.ui-widget {
    font-family: 'Muli', Arial, sans-serif;
}

.ui-widget button {
    font-family: 'Muli', Arial, sans-serif;
}

.ui-widget-content {
    color: black;
}

.ui-widget-content a {
    color: black;
}

.ui-widget-header {
    color: black;
}

.ui-widget-header a {
    color: black;
}

/* Interaction states
----------------------------------*/

.ui-button
{
    padding: 9px; /* @field_height */
}

/* Icons
----------------------------------*/

input[type="radio"].ui-state-active .ui-icon,
input[type="radio"].ui-button:active .ui-icon,
input[type="checkbox"].ui-state-active .ui-icon,
input[type="checkbox"].ui-button:active .ui-icon {
    background-image: none; /* we should only hide the icon for radio buttons and maybe checkboxes */
}

/* Interaction Cues
----------------------------------*/
.ui-state-info,
.ui-widget-content .ui-state-info
{
  border: 1px solid #f2d52c;
  background: #f8e787 url(images/ui-bg_glass_55_f8e787_1x400.png) 50% bottom repeat-x;
  color: #886302;
}

.ui-state-info a,
.ui-widget-content .ui-state-info a
{
  color: #886302;
}

/* Icons
----------------------------------*/

/* Old Link Buttons */
.ui-tabs .ui-tabs-nav li
{
  font-size: 11px;
}

.ui-progressbar-value
{
  background-repeat: repeat;
}

/* tweaks to make the buttons less big */

.ui-buttonset
{
}

.ui-button
{

}

.ui-dialog
{
  -moz-box-shadow: 2px 2px 12px rgba(0, 0, 0, 0.3);
  -opera-box-shadow: 2px 2px 12px rgba(0, 0, 0, 0.3);
  -webkit-box-shadow: 2px 2px 12px rgba(0, 0, 0, 0.3);
}

/*
 * We use the following styles to make the default ui-buttons, that theme roller spits out, look more square.
 */
.sui-button.ui-button-icon-only .ui-icon,
.sui-button.ui-button-text-icon .ui-icon,
.sui-button.ui-button-text-icons .ui-icon,
.sui-button.ui-button-icons-only .ui-icon
{
  margin: 0px;
  position: static;
}
/*
 * Make the ui-button padding match the sui-buttons we use.
 */
.sui-button.ui-button
{
  padding: 2px;
  width: auto;
}

/* Undo the above for buttons inside of button sets */
.ui-buttonset .sui-button.ui-button
{
  padding: 1px;
}

/* Special success state */
.ui-state-success .ui-icon,
.ui-state-success-text .ui-icon
{
  background-image: url(images/ui-icons_368f0f_256x240.png);
}

.ui-state-success,
.ui-widget-content .ui-state-success,
.ui-widget-header .ui-state-success
{
  border: 1px solid #368f0f;
  background: #cbf8a0 50% bottom repeat-x;
  color: #368f0f;
}

.ui-state-success a,
.ui-widget-content .ui-state-success a,
.ui-widget-header .ui-state-success a
{
  color: #368f0f;
}

.ui-state-success-text,
.ui-widget-content .ui-state-success-text,
.ui-widget-header .ui-state-success-text
{
  color: #368f0f;
}


.ui-state-active,
.ui-widget-content .ui-state-active,
.ui-widget-header .ui-state-active,
a.ui-button:active,
.ui-button:active,
.ui-button.ui-state-active:hover {
    color: #000000;
}

/* makes dialogs zoom in. this requires our custom scripts in shout_init.js to undo, otherwise the dialog remains hidden. */
/*
.ui-dialog
{
    visibility:hidden;
}

.ui-dialog-transition
{
    -moz-transition:-moz-transform 0.3s ease-in-out;
    -webkit-transition:-webkit-transform 0.3s ease-in-out;
    transition: transform 0.3s ease-in-out;
}
.ui-dialog-create
{
    visibility:visible;
    -moz-transform:scale(0.001);
    -webkit-transform:scale(0.001);
    transform: scale(0.001);
}
.ui-dialog-open
{
    visibility:visible;
    -moz-transform:scale(1);
    -webkit-transform:scale(1);
    transform: scale(1);
}
*/

#admin-extranav .ui-icon
{
  background-image: url(images/ui-icons_ffffff_256x240.png);
  display: inline-block;
  vertical-align: middle;
}

.sui-miniprofile .ui-icon
{
  background-image: url(images/ui-icons_ffffff_256x240.png);
  display: inline-block;
  vertical-align: middle;
  margin-bottom: 3px;
}

.gallery-images-uploader .ui-widget-header .ui-state-highlight.delete .ui-icon,
.gallery-images-uploader .ui-widget-header .status .ui-icon
{
  background-image: url(images/ui-icons_cd0a0a_256x240.png);
}

.gallery-images-uploader .ui-widget-header .ui-state-highlight.feature .ui-icon
{
  background-image: url(images/ui-icons_d4ca49_256x240.png);
}

.gallery-images-uploader .ui-widget-header .ui-state-highlight.status .ui-icon
{
  background-image: url(images/ui-icons_368f0f_256x240.png);
}