/**  Import Compass and Theme Variables */
/* ========================================================================== Theme Configuration File ========================================================================== */
/** Base Colors Description: Provides a base for the UI. Usage: General UI Background, Region Headers, Buttons */
/** Highlight Colors Description: Used for providing emphasis or importance to UI components. Usage: Region Headers, Primary / Hot Buttons */
/** Accent and Status Colors Description: Used for indicating state-based UI components, status, or accents. Usage: Warnings, Errors, Danger Text, Success, Focus */
/** Application Based Colors Description: Used for applications within APEX development */
/******************************************************************************
Color Variables
******************************************************************************/
/******************************************************************************
Button for Theme
******************************************************************************/
.a-Button, .fc-button, .apex-button-group input + label { border: none; color: #505050; background-clip: padding-box; background-color: #F9F9F9; box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.125) inset; text-shadow: none; -webkit-font-smoothing: antialiased; transition: background-color .15s ease; }

.a-Button, .ui-button { border-radius: 2px; }

.a-Button:hover, .fc-button.ui-state-hover, .apex-button-group input + label:hover { background-color: #FFFFFF; box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.2) inset, 0 1px 4px rgba(0, 0, 0, 0.1); z-index: 100; }

.a-Button:focus, .ui-button.ui-state-focus, .fc-button.ui-state-focus, .apex-button-group input:focus + label { background-color: #FFFFFF; box-shadow: 0 0 0 1px #0572ce inset, 0 1px 2px rgba(0, 0, 0, 0.1) !important; outline: none; z-index: 110; }

.a-Button:focus:active, .ui-button.ui-state-focus:active, .fc-button.ui-state-focus:active, .apex-button-group input:focus + label:active { box-shadow: 0 0 0 1px #0572ce inset, 0 2px 2px rgba(0, 0, 0, 0.1) inset !important; }

.lte-ie9 .a-Button:focus, .lte-ie9 .ui-button.ui-state-focus, .lte-ie9 .fc-button.ui-state-focus, .ie9 .a-Button:focus, .ie9 .ui-button.ui-state-focus, .ie9 .fc-button.ui-state-focus { outline: 1px dotted; }

.u-HCM .a-Button:focus, .u-HCM .ui-button.ui-state-focus, .u-HCM .fc-button.ui-state-focus { outline: 2px dotted; }

.u-HCM .a-Button, .u-HCM .fc-button, .u-HCM .ui-button { border: 1px solid; }

.a-Button:active, .a-Button:focus:active, .fc-button.ui-state-hover:active { background-color: #E0E0E0; box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.1) inset, 0 2px 1px rgba(0, 0, 0, 0.15) inset; z-index: 100; }

.a-Button.is-active, .ui-buttonset .ui-button.ui-state-active, .fc-button.ui-state-active, .a-Button.is-active:active, .ui-buttonset .ui-button.ui-state-active.ui-state-hover:active, .a-MenuButton.is-active { background-color: #E8E8E8 !important; box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.1) inset, 0 2px 1px rgba(0, 0, 0, 0.1) inset; color: #505050; z-index: 100; }

.a-Header .a-Button.is-active { box-shadow: none; background-color: #FFF; }

.a-Button.a-Button--activeTab { background-color: #FFF; box-shadow: none; color: #505050; z-index: 100; }

.a-Button#header-adminMenu { transition: none; }

.a-Button#header-adminMenu:hover { box-shadow: 0 3px 0 #BAC7C8 inset, 0 -1px 0 #E0E0E0 inset; }

.a-Button.a-Button--activeTab.tab-admin { box-shadow: 0 3px 0 #BAC7C8 inset !important; }

.a-Button.is-disabled, .a-Button.is-disabled:active, .a-Button:disabled { opacity: .5; pointer-events: none; }

.a-Button.is-locked { background-color: #DD0000 !important; color: #FFF; }

.a-Button.is-locked-by-self { background-color: #58C14A !important; color: #FFF; }

.a-Button--hot, body .ui-button.ui-button--hot, body .ui-button.a-Button--hot { background-color: #0572CE; color: #FFFFFF; box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.05) inset; }

.a-Button--hot:hover, body .ui-button.ui-button--hot:hover, body .ui-button.a-Button--hot:hover { background-color: #1E80D2; box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.1) inset, 0 1px 2px rgba(0, 0, 0, 0.15); }

.a-Button--hot:hover, .a-Button--hot:focus, body .ui-button.ui-button--hot:hover, body .ui-button.ui-button--hot:focus, body .ui-button.a-Button--hot:hover, body .ui-button.a-Button--hot:focus { background-color: #0572CE; }

.a-Button--hot:active, .a-Button--hot.is-active, .a-Button--hot.a-MenuButton.is-active, body .ui-button.ui-button--hot:active, body .ui-button.ui-button--hot.is-active, body .ui-button.ui-button--hot.a-MenuButton.is-active, body .ui-button.a-Button--hot:active, body .ui-button.a-Button--hot.is-active, body .ui-button.a-Button--hot.a-MenuButton.is-active { background-color: #1E80D2 !important; box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.2) inset, 0 1px 2px rgba(0, 0, 0, 0.25) inset; }

.a-Button--hot:focus, body .ui-button.ui-button--hot:focus, body .ui-button.a-Button--hot:focus { box-shadow: 0 0 1px #1E80D2, 0 0 0px 1px #1E80D2 inset, 0 0 0 2px rgba(255, 255, 255, 0.75) inset !important; }

.a-Button--primary { background-color: #CFE6FA; color: #404040; }

.a-Button--primary:hover, .a-Button--primary:focus { background-color: #DEEFFB; }

.a-Button--primary:active, .a-Button--primary.is-active { background-color: #7FBEF2 !important; }

.a-Button--dark { background-color: #4F5459; color: #FFF; }

.a-Button--dark:hover, .a-Button--dark:focus { background-color: #3B4145; }

.a-Button--dark:active, .a-Button--dark.is-active { background-color: #282D31 !important; }

.a-Button.a-Button--regionHeader { padding: 4px; margin: 4px; }

.a-Button--regionHeader, .a-Button--regionHeader:hover, .a-Button--regionHeader:active, .a-Button--noUI, .a-Button--noUI:hover, .a-Button--noUI:active { background-color: transparent; box-shadow: none; text-shadow: none; }

.a-Button--simple { background-color: transparent; box-shadow: none; text-shadow: none; }

.a-Button, .ui-button { font-size: 12px; line-height: 16px; padding: 8px 12px; }

.a-Button--popupLOV { padding: 4px 8px; color: #404040; border-top-left-radius: 0; border-bottom-left-radius: 0; margin-left: -1px; border-left-width: 0; }

.a-Button--calendar { padding: 4px 8px; margin-left: -1px; }

.a-Button .a-Icon--pullRight { float: right !important; margin-left: 4px; margin-right: 0 !important; }

.a-Button--withIcon { padding: 8px 10px; line-height: 16px; }

.a-Button--withIcon .a-Icon { margin-right: 4px; }

.a-Button--withIcon.a-Button--slim { padding-right: 8px; padding-left: 8px; }

.a-Button--noLabel .a-FAIcon, .a-Button--noLabel .a-Icon { margin-right: 0; }

.a-Button--iconTextButton { padding-right: 8px; }

.a-Button--iconTextButton.a-Button--large, .a-Wizard-buttons .a-Button--iconTextButton.a-Button { padding-right: 12px; }

.a-Button--iconTextButton.a-Button--small { padding-right: 6px !important; }

.a-Button--iconLeft { position: relative; padding-right: 12px; padding-left: 28px; }

.a-Button--iconLeft .a-Icon { position: absolute; left: 8px; }

.a-Wizard-buttons .a-Button--iconLeft.a-Button--large, .a-Button--iconLeft.a-Button--large { padding-right: 16px; padding-left: 32px; }

.a-Wizard-buttons .a-Button--iconLeft.a-Button--large .a-Icon, .a-Button--iconLeft.a-Button--large .a-Icon { left: 12px; }

.a-Button--iconLeft.a-Button--small { padding-right: 8px !important; padding-left: 24px !important; }

.a-Button--iconLeft.a-Button--small .a-Icon { left: 6px; }

.a-Button--small, .a-Button--listManager { font-size: 11px; line-height: 16px; padding: 4px 8px !important; }

.a-Wizard-buttons .a-Button, .a-Button--large { padding: 14px 16px; line-height: 16px; font-size: 14px; }

.a-Wizard-buttons .a-Button.a-Button--withIcon, .a-Button--large.a-Button--withIcon { line-height: 16px; }

.a-Button--largeIcon { padding-top: 6px; padding-bottom: 6px; }

.a-Wizard-buttons .a-Button, .a-Button--largeIcon { line-height: 20px; }

.a-Wizard-buttons .a-Button .a-Icon, .a-Button--largeIcon .a-Icon { width: 20px; height: 20px; }

.a-Wizard-buttons .a-Button .a-Icon:before, .a-Button--largeIcon .a-Icon:before { font-size: 20px !important; }

.a-Button--largeIcon.a-Button--large .a-Wizard-buttons .a-Button { padding-top: 12px; padding-bottom: 12px; }

.a-Button--largeIcon.a-Button--small { padding-top: 2px !important; padding-bottom: 2px !important; }

.a-Button--navLink { padding: 12px; color: #707070; }

.a-Button--navLink:before { background-color: #E0E0E0; }

.a-Button--navLink:focus:before, .a-Button--navLink.is-focused:before { display: none; }

.a-Button--navLink:active, .a-Button--navLink.is-active { background-color: #D0D0D0; }

.a-Button--navLink:hover, .a-Button--navLink.a-MenuButton.is-active { background-color: #fff; box-shadow: 0 -1px 0 #E0E0E0 inset; text-shadow: none; }

.a-Button--navLink.a-MenuButton.is-active { box-shadow: none; }

.a-Button--accountMenu { padding: 8px; }

.a-Button.a-Button--hot, .a-Button--strongLabel { font-weight: bold; }

.a-Button--helpButton .a-Icon:before { color: #D0D0D0; }

.a-Button--helpButton:hover .a-Icon:before { color: #404040; }

/******************************************************************************
jQuery Button Set
******************************************************************************/
.ui-buttonset { font-size: 0; }

.ui-buttonset .ui-button.ui-corner-left { border-radius: 2px 0 0 2px; }

.ui-buttonset .ui-button.ui-corner-right { border-radius: 0 2px 2px 0; }

.ui-buttonset .ui-state-active { font-weight: bold; }

.ui-button .ui-button-text { line-height: 14px; }

.a-Button--listManager { margin-left: 4px; }

/******************************************************************************
Button Badge (used in Page Designer)
******************************************************************************/
.a-Button-badge { background-color: #EA0000; padding: 0 4px; display: inline-block; border-radius: 14px; margin-left: 2px; color: #FFF; position: static; top: auto; right: auto; font-size: 10px; line-height: 14px; min-width: 14px; text-align: center; -webkit-font-smoothing: auto; }

.a-Button-badge:empty { visibility: hidden; padding: 0; min-width: 0; margin: 0; }

@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) { .a-Button:focus, .ui-button.ui-state-focus, .fc-button.ui-state-focus { outline: 2px dotted; } }