/** 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 */
/* ========================================================================== Region ========================================================================== */
.a-Region-header { background-color: #F4F4F4; box-shadow: 0 1px 0 rgba(255, 255, 255, 0.5) inset; padding: 0 12px; }

.a-Side .a-Region-header { background-color: #F4F4F4; }

.a-Region-title { display: inline-block; margin: 0; padding: 12px 0; font-weight: bold; line-height: 16px; color: #202020; -webkit-font-smoothing: antialiased; }

.a-Accordion-item .a-Region-title { font-weight: normal; font-size: inherit; padding-top: 12px; padding-bottom: 12px; }

.a-PageDesigner .a-Region-title { font-size: 12px; }

.a-Region-title--withBadge { padding: 10px 0; line-height: 20px; }

.a-Region--sideRegion .a-Region-header { padding-right: 4px; }

/* ========================================================================== Region Caption ========================================================================== */
.a-Region-caption { padding: 8px; font-size: 11px; }

.a-Region-caption--borderTop { border-top: 1px solid #F8F8F8; }

.a-Region-caption--borderBottom { border-bottom: 1px solid #F8F8F8; }

@media only screen and (max-width: 1024px) { .a-PageDesigner .a-Region-title { padding-top: 4px; padding-bottom: 4px; } }

@media only screen and (min-width: 1025px) and (max-width: 1279px) { .a-PageDesigner .a-Region-title { padding-top: 6px; padding-bottom: 6px; } }

@media only screen and (min-width: 1281px) and (max-width: 1679px) { .a-PageDesigner .a-Region-title { padding-top: 8px; padding-bottom: 8px; } }