/* zFlex/flexButtons.css */

/*<common controls>*/
.flex-button,
.dxucBrowseButton_Material {
    border-radius: 3px;
    text-decoration: none !important;
    font-size: 14px;
    font-family: 'Roboto';
    font-weight: normal;
    transition: background-color 0.25s ease 0s;
    cursor: pointer;
    white-space: nowrap;
    display: inline-block;
    outline: none;
    /* text align middle for link button */
    text-align: center;
    box-sizing: border-box;
    /*display: table-cell !important;*/ /* Fix hidden buttons */
    vertical-align: middle;
    /* /text align middle for link button */
}

.dxucBrowseButton_Material {
    margin-left: 10px;
}
.flex-button-input input {
    border-radius: 3px;
    text-decoration: none;
    font-size: 14px;
    font-family: 'Roboto';
    font-weight: normal;
    transition: background-color 0.25s ease 0s;
    cursor: pointer;
    white-space: nowrap;
    display: inline-block;
    outline: none;
}
.flex-button-inline {
    border-radius: 3px;
    text-decoration: none !important;
    font-size: 14px;
    font-family: 'Roboto';
    font-weight: normal;
    transition: background-color 0.25s ease 0s;
    cursor: pointer;
    white-space: nowrap;
    display: inline-block;
    outline: none;
    /* text align middle for link button */
    text-align: center;
    box-sizing: border-box;
    display: inline-block !important;
    vertical-align: middle;
    /* /text align middle for link button */
}
.button-height {
    height: 34px !important;
}
/*<default button>*/
.flex-button-gray,
.dxucBrowseButton_Material {
    color: #373737 !important;
    background-color: #e1e1e1 !important;
    border: solid 1px #888888 !important;
    padding: 7px 25px 8px 25px !important;
}
.flex-button-gray:hover,
.dxucBrowseButtonHover_Material {
    background-color: #d1d1d1 !important;
}
.flex-button-gray:active,
.dxucBrowseButtonPressed_Material {
    background-color: #bbbbbb !important;
}
.flex-button-gray-narrow {
    padding: 4px 20px 5px 20px !important;
}
/* upload browse button */
.dxucBrowseButtonHover_Material a {
    color: #373737 !important;
}
.dxucBrowseButtonPressed_Material a {
    color: #373737 !important;
}
.dxucBrowseButton_Material.dxbf a {
    border: 0;
}
/* disabled Gray button */
.flex-button-gray[disabled="disabled"],
.flex-button-gray:hover[disabled="disabled"],
.flex-button-gray:active[disabled="disabled"] {
    opacity: 0.6 !important;
    background-color: #e1e1e1 !important;
}
/*</default button>*/
/*<input button orange>*/
.flex-button-orange {
    color: #fff !important;
    border: solid 0px #CC4F3A;
    padding: 8px 25px 9px 25px;
    margin-right: 10px;
}
.flex-button-orange-narrow {
    padding: 5px 20px 6px 20px !important;
}
.flex-button-orange-big {
    padding: 15px 20px 16px 20px !important;
}
/* disabled Orange button */
.flex-button-orange[disabled="disabled"],
.flex-button-orange:hover[disabled="disabled"],
.flex-button-orange:active[disabled="disabled"] {
    opacity: 0.6;
    background-color: #ba6a5d;
}
/*</input button orange>*/
/*<input button green>*/
.flex-button-green {
    color: #fff !important;
    background-color: #74c233 !important;
    border: solid 0px #74c233 !important;
    padding: 8px 25px 9px 25px !important;
}
.flex-button-green:hover  {
    background-color: #5fa029 !important;
}
.flex-button-green:active {
    background-color: #45761c !important;
}
.flex-button-green-narrow {
    padding: 5px 20px 6px 20px !important;
}
/*</input button green>*/
/*</common controls>*/

/*<input controls>*/
/*<default button>*/
.flex-button-input-gray input {
    color: #373737;
    background-color: #e1e1e1;
    border: solid 1px #888888;
    padding: 7px 25px 8px 25px !important;
}
.flex-button-input-gray input:hover {
    background-color: #d1d1d1;
}
.flex-button-input-gray input:active {
    background-color: #b3b3b3;
}
.flex-button-input-gray-narrow input {
    padding: 4px 20px 5px 20px !important;
}
/*</default button>*/
/*<input button orange>*/
.flex-button-input-orange input {
  color: #fff;
  background-color: #cc4f3a;
  border: solid 0px #cc4f3a;
  padding: 8px 25px 9px 25px !important;
}
    .flex-button-input-orange input:hover {
      background-color: #db5c46;
    }
    .flex-button-input-orange input:active {
      background-color: #bd412f;
    }
.flex-button-input-orange-narrow input {
    padding: 5px 20px 6px 20px !important;
}
/*</input button orange>*/
/*<input button green>*/
.flex-button-input-green input {
    color: #fff;
    background-color: #74c233;
    border: solid 0px #74c233;
    padding: 8px 25px 9px 25px !important;
}
.flex-button-input-green input:hover  {
    background-color: #5fa029;
}
.flex-button-input-green input:active {
    background-color: #45761c;
}
.flex-button-input-green-narrow input {
    padding: 5px 20px 6px 20px !important;
}
/*</input button green>*/
/*</input controls>*/

/* menu buttons */
.flex-button-orange a,
.flex-button-gray a,
.flex-button-green a {
    padding: 0 !important;
}
.flex-button-orange a,
.flex-button-green a {
    color: #FFFFFF !important;
}
.flex-button-gray a {
    color: #373737 !important;
}
/* /menu buttons */