/**
 * Description: Elements and collections of elements which can be reused.
 * Version: 1.1.0
 * Last update: 2016/08/18
 * Author: Wojciech Mleczek
 *
 * Summary:
 *
 *    1. Clearfix
 *    2. Icons
 *        - 2.1. Small (16px)
 *        - 2.2. Medium (24px)
 *        - 2.3. Large (32px)
 *    3. Grids
 *        - 3.1. Grid row
 *        - 3.2. Row column
 *    4. Buttons
 *    5. Tables
 *        - 5.1. Collapsible
 *        - 5.2. Vertical layout
 *    6. Tree menu
 *    7. Responsive
 *    8. Typography
 *    9. Common
 */

/* ==========================================================================
   1. Clearfix
      @see http://nicolasgallagher.com/micro-clearfix-hack/
   ========================================================================== */

.cf:before,
.cf:after {
    content: " ";
    display: table;
}

.cf:after {
    clear: both;
}

.cf {
    *zoom: 1;
}


/* ==========================================================================
   2. Icons
   ========================================================================== */

/* 2.1. Small (16px)
   ========================================================================== */

i[class*='icon-'],
i[class^='icon-'] {
    display: inline-block;
    vertical-align: top;
    width: 16px;
    height: 16px;
    background: url('../img/icons/sprite.png?v=2');
    margin-right: 6px;
    margin-top: 2px;
}

i.no-margin {
    margin: 0px;
}

/* Row 1 */
i.icon-folder {
    background-position: -0px 0px;
}

i.icon-database {
    background-position: -20px 0px;
}

i.icon-module {
    background-position: -40px 0px;
}

i.icon-arrow-asc {
    background-position: -60px 0px;
}

i.icon-relation {
    background-position: -80px 0px;
}

i.icon-trigger-disabled {
    background-position: -100px 0px;
}

/* Row 2 */
i.icon-table {
    background-position: -0px -20px;
}

i.icon-view {
    background-position: -20px -20px;
}

i.icon-key {
    background-position: -40px -20px;
}

i.icon-arrow-desc {
    background-position: -60px -20px;
}

i.icon-unique-key {
    background-position: -80px -20px;
}

i.icon-user-unique-key {
    background-position: -100px -20px;
}

/* Row 3 */
i.icon-function {
    background-position: -0px -40px;
}

i.icon-procedure {
    background-position: -20px -40px;
}

i.icon-chapter {
    background-position: -40px -40px;
}

i.icon-error {
    background-position: -60px -40px;
}

i.icon-trigger-active {
    background-position: -80px -40px;
}

i.icon-user-relation {
    background-position: -100px -40px;
}

/* Row 4 */
i.icon-user-key {
    background-position: -0px -60px;
}

i.icon-unresolved {
    background-position: -20px -60px;
}

i.icon-expand {
    background-position: -40px -60px;
}

i.icon-collapse {
    background-position: -60px -60px;
}

i.icon-check {
    background-position: -80px -60px;
}

i.icon-nullable {
    background-position: -100px -60px;
}

/* Row 5 */
i.icon-primary-key-disabled {
    background-position: -0px -80px;
}

i.icon-unique-key-disabled {
    background-position: -20px -80px;
}

i.icon-user-pk-relation {
    background-position: -40px -80px;
}

i.icon-pk-relation {
    background-position: -60px -80px;
}

i.icon-used-by-unresolved {
    background-position: -80px -80px;
}

i.icon-used-by-user-unresolved {
    background-position: -100px -80px;
}

/* Row 6 */
i.icon-used-by-table {
    background-position: -0px -100px;
}

i.icon-used-by-user-table {
    background-position: -20px -100px;
}

i.icon-used-by-view {
    background-position: -40px -100px;
}

i.icon-used-by-user-view {
    background-position: -60px -100px;
}

i.icon-used-by-procedure {
    background-position: -80px -100px;
}

i.icon-used-by-user-procedure {
    background-position: -100px -100px;
}

/* Row 7 */
i.icon-used-by-function {
    background-position: -0px -120px;
}

i.icon-used-by-user-function {
    background-position: -20px -120px;
}

i.icon-used-by-trigger-active {
    background-position: -40px -120px;
}

i.icon-used-by-user-trigger-active {
    background-position: -60px -120px;
}

i.icon-used-by-trigger-disabled {
    background-position: -80px -120px;
}

i.icon-used-by-user-trigger-disabled {
    background-position: -100px -120px;
}

/* Row 8 */
i.icon-uses-table {
    background-position: -0px -140px;
}

i.icon-uses-user-table {
    background-position: -20px -140px;
}

i.icon-uses-view {
    background-position: -40px -140px;
}

i.icon-uses-user-view {
    background-position: -60px -140px;
}

i.icon-uses-procedure {
    background-position: -80px -140px;
}

i.icon-uses-user-procedure {
    background-position: -100px -140px;
}

/* Row 9 */
i.icon-uses-function {
    background-position: -0px -160px;
}

i.icon-uses-user-function {
    background-position: -20px -160px;
}

i.icon-uses-trigger-active {
    background-position: -40px -160px;
}

i.icon-uses-user-trigger-active {
    background-position: -60px -160px;
}

i.icon-uses-trigger-disabled {
    background-position: -80px -160px;
}

i.icon-uses-user-trigger-disabled {
    background-position: -100px -160px;
}

/* Row 10 */
i.icon-uses-unresolved {
    background-position: -0px -180px;
}

i.icon-uses-user-unresolved {
    background-position: -20px -180px;
}

i.icon-none {
    background-position: -0px -220px;
}

i.icon-none-user {
    background-position: -20px -220px;
}

i.icon-used-by-none {
    background-position: -40px -220px;
}

i.icon-used-by-user-none {
    background-position: -60px -220px;
}

i.icon-uses-none {
    background-position: -80px -220px;
}

i.icon-uses-user-none {
    background-position: -100px -220px;
}

i.icon-table {
    background-position: -0px -240px;
}

i.icon-table-user {
    background-position: -20px -240px;
}

i.icon-used-by-table {
    background-position: -40px -240px;
}

i.icon-used-by-user-table {
    background-position: -60px -240px;
}

i.icon-uses-table {
    background-position: -80px -240px;
}

i.icon-uses-user-table {
    background-position: -100px -240px;
}

i.icon-external-table {
    background-position: -0px -260px;
}

i.icon-external-table-user {
    background-position: -20px -260px;
}

i.icon-used-by-external-table {
    background-position: -40px -260px;
}

i.icon-used-by-user-external-table {
    background-position: -60px -260px;
}

i.icon-uses-external-table {
    background-position: -80px -260px;
}

i.icon-uses-user-external-table {
    background-position: -100px -260px;
}

i.icon-foreign-table {
    background-position: -0px -280px;
}

i.icon-foreign-table-user {
    background-position: -20px -280px;
}

i.icon-used-by-foreign-table {
    background-position: -40px -280px;
}

i.icon-used-by-user-foreign-table {
    background-position: -60px -280px;
}

i.icon-uses-foreign-table {
    background-position: -80px -280px;
}

i.icon-uses-user-foreign-table {
    background-position: -100px -280px;
}

i.icon-file-table {
    background-position: -0px -300px;
}

i.icon-file-table-user {
    background-position: -20px -300px;
}

i.icon-used-by-file-table {
    background-position: -40px -300px;
}

i.icon-used-by-user-file-table {
    background-position: -60px -300px;
}

i.icon-uses-file-table {
    background-position: -80px -300px;
}

i.icon-uses-user-file-table {
    background-position: -100px -300px;
}

i.icon-graph-table {
    background-position: -0px -320px;
}

i.icon-graph-table-user {
    background-position: -20px -320px;
}

i.icon-used-by-graph-table {
    background-position: -40px -320px;
}

i.icon-used-by-user-graph-table {
    background-position: -60px -320px;
}

i.icon-uses-graph-table {
    background-position: -80px -320px;
}

i.icon-uses-user-graph-table {
    background-position: -100px -320px;
}

i.icon-graph-node-table {
    background-position: -0px -340px;
}

i.icon-graph-node-table-user {
    background-position: -20px -340px;
}

i.icon-used-by-graph-node-table {
    background-position: -40px -340px;
}

i.icon-used-by-user-graph-node-table {
    background-position: -60px -340px;
}

i.icon-uses-graph-node-table {
    background-position: -80px -340px;
}

i.icon-uses-user-graph-node-table {
    background-position: -100px -340px;
}

i.icon-graph-vertex-table {
    background-position: -0px -360px;
}

i.icon-graph-vertex-table-user {
    background-position: -20px -360px;
}

i.icon-used-by-graph-vertex-table {
    background-position: -40px -360px;
}

i.icon-used-by-user-graph-vertex-table {
    background-position: -60px -360px;
}

i.icon-uses-graph-vertex-table {
    background-position: -80px -360px;
}

i.icon-uses-user-graph-vertex-table {
    background-position: -100px -360px;
}

i.icon-graph-edge-table {
    background-position: -0px -380px;
}

i.icon-graph-edge-table-user {
    background-position: -20px -380px;
}

i.icon-used-by-graph-edge-table {
    background-position: -40px -380px;
}

i.icon-used-by-user-graph-edge-table {
    background-position: -60px -380px;
}

i.icon-uses-graph-edge-table {
    background-position: -80px -380px;
}

i.icon-uses-user-graph-edge-table {
    background-position: -100px -380px;
}

i.icon-system-versioned-table {
    background-position: -0px -400px;
}

i.icon-system-versioned-table-user {
    background-position: -20px -400px;
}

i.icon-used-by-system-versioned-table {
    background-position: -40px -400px;
}

i.icon-used-by-user-system-versioned-table {
    background-position: -60px -400px;
}

i.icon-uses-system-versioned-table {
    background-position: -80px -400px;
}

i.icon-uses-user-system-versioned-table {
    background-position: -100px -400px;
}

i.icon-history-table {
    background-position: -0px -420px;
}

i.icon-history-table-user {
    background-position: -20px -420px;
}

i.icon-used-by-history-table {
    background-position: -40px -420px;
}

i.icon-used-by-user-history-table {
    background-position: -60px -420px;
}

i.icon-uses-history-table {
    background-position: -80px -420px;
}

i.icon-uses-user-history-table {
    background-position: -100px -420px;
}

i.icon-search-index {
    background-position: -0px -440px;
}

i.icon-search-index-user {
    background-position: -20px -440px;
}

i.icon-used-by-search-index {
    background-position: -40px -440px;
}

i.icon-used-by-user-search-index {
    background-position: -60px -440px;
}

i.icon-uses-search-index {
    background-position: -80px -440px;
}

i.icon-uses-user-search-index {
    background-position: -100px -440px;
}

i.icon-collection {
    background-position: -460px -460px;
}

i.icon-collection-user {
    background-position: -20px -460px;
}

i.icon-used-by-collection {
    background-position: -40px -460px;
}

i.icon-used-by-user-collection {
    background-position: -60px -460px;
}

i.icon-uses-collection {
    background-position: -80px -460px;
}

i.icon-uses-user-collection {
    background-position: -100px -460px;
}

i.icon-entity {
    background-position: -0px -480px;
}

i.icon-entity-user {
    background-position: -20px -480px;
}

i.icon-used-by-entity {
    background-position: -40px -480px;
}

i.icon-used-by-user-entity {
    background-position: -60px -480px;
}

i.icon-uses-entity {
    background-position: -80px -480px;
}

i.icon-uses-user-entity {
    background-position: -100px -480px;
}

i.icon-cube {
    background-position: -0px -500px;
}

i.icon-cube-user {
    background-position: -20px -500px;
}

i.icon-used-by-cube {
    background-position: -40px -500px;
}

i.icon-used-by-user-cube {
    background-position: -60px -500px;
}

i.icon-uses-cube {
    background-position: -80px -500px;
}

i.icon-uses-user-cube {
    background-position: -100px -500px;
}

i.icon-dimension {
    background-position: -0px -520px;
}

i.icon-dimension-user {
    background-position: -20px -520px;
}

i.icon-used-by-dimension {
    background-position: -40px -520px;
}

i.icon-used-by-user-dimension {
    background-position: -60px -520px;
}

i.icon-uses-dimension {
    background-position: -80px -520px;
}

i.icon-uses-user-dimension {
    background-position: -100px -520px;
}

i.icon-flat-file {
    background-position: -0px -540px;
}

i.icon-flat-file-user {
    background-position: -20px -540px;
}

i.icon-used-by-flat-file {
    background-position: -40px -540px;
}

i.icon-used-by-user-flat-file {
    background-position: -60px -540px;
}

i.icon-uses-flat-file {
    background-position: -80px -540px;
}

i.icon-uses-user-flat-file {
    background-position: -100px -540px;
}

i.icon-object {
    background-position: -0px -560px;
}

i.icon-object-user {
    background-position: -20px -560px;
}

i.icon-used-by-object {
    background-position: -40px -560px;
}

i.icon-used-by-user-object {
    background-position: -60px -560px;
}

i.icon-uses-object {
    background-position: -80px -560px;
}

i.icon-uses-user-object {
    background-position: -100px -560px;
}

i.icon-standard-object {
    background-position: -0px -580px;
}

i.icon-standard-object-user {
    background-position: -20px -580px;
}

i.icon-used-by-standard-object {
    background-position: -40px -580px;
}

i.icon-used-by-user-standard-object {
    background-position: -60px -580px;
}

i.icon-uses-standard-object {
    background-position: -80px -580px;
}

i.icon-uses-user-standard-object {
    background-position: -100px -580px;
}

i.icon-custom-object {
    background-position: -0px -600px;
}

i.icon-custom-object-user {
    background-position: -20px -600px;
}

i.icon-used-by-custom-object {
    background-position: -40px -600px;
}

i.icon-used-by-user-custom-object {
    background-position: -60px -600px;
}

i.icon-uses-custom-object {
    background-position: -80px -600px;
}

i.icon-uses-user-custom-object {
    background-position: -100px -600px;
}

i.icon-external-object {
    background-position: -0px -620px;
}

i.icon-external-object-user {
    background-position: -20px -620px;
}

i.icon-used-by-external-object {
    background-position: -40px -620px;
}

i.icon-used-by-user-external-object {
    background-position: -60px -620px;
}

i.icon-uses-external-object {
    background-position: -80px -620px;
}

i.icon-uses-user-external-object {
    background-position: -100px -620px;
}

i.icon-view {
    background-position: -0px -640px;
}

i.icon-view-user {
    background-position: -20px -640px;
}

i.icon-used-by-view {
    background-position: -40px -640px;
}

i.icon-used-by-user-view {
    background-position: -60px -640px;
}

i.icon-uses-view {
    background-position: -80px -640px;
}

i.icon-uses-user-view {
    background-position: -100px -640px;
}

i.icon-materialized-view {
    background-position: -0px -660px;
}

i.icon-materialized-view-user {
    background-position: -20px -660px;
}

i.icon-used-by-materialized-view {
    background-position: -40px -660px;
}

i.icon-used-by-user-materialized-view {
    background-position: -60px -660px;
}

i.icon-uses-materialized-view {
    background-position: -80px -660px;
}

i.icon-uses-user-materialized-view {
    background-position: -100px -660px;
}

i.icon-editioning-view {
    background-position: -0px -680px;
}

i.icon-editioning-view-user {
    background-position: -20px -680px;
}

i.icon-used-by-editioning-view {
    background-position: -40px -680px;
}

i.icon-used-by-user-editioning-view {
    background-position: -60px -680px;
}

i.icon-uses-editioning-view {
    background-position: -80px -680px;
}

i.icon-uses-user-editioning-view {
    background-position: -100px -680px;
}

i.icon-indexed-view {
    background-position: -0px -700px;
}

i.icon-indexed-view-user {
    background-position: -20px -700px;
}

i.icon-used-by-indexed-view {
    background-position: -40px -700px;
}

i.icon-used-by-user-indexed-view {
    background-position: -60px -700px;
}

i.icon-uses-indexed-view {
    background-position: -80px -700px;
}

i.icon-uses-user-indexed-view {
    background-position: -100px -700px;
}

i.icon-named-query {
    background-position: -0px -720px;
}

i.icon-named-query-user {
    background-position: -20px -720px;
}

i.icon-used-by-named-query {
    background-position: -40px -720px;
}

i.icon-used-by-user-named-query {
    background-position: -60px -720px;
}

i.icon-uses-named-query {
    background-position: -80px -720px;
}

i.icon-uses-user-named-query {
    background-position: -100px -720px;
}

i.icon-procedure {
    background-position: -0px -740px;
}

i.icon-procedure-user {
    background-position: -20px -740px;
}

i.icon-used-by-procedure {
    background-position: -40px -740px;
}

i.icon-used-by-user-procedure {
    background-position: -60px -740px;
}

i.icon-uses-procedure {
    background-position: -80px -740px;
}

i.icon-uses-user-procedure {
    background-position: -100px -740px;
}

i.icon-package {
    background-position: -0px -760px;
}

i.icon-package-user {
    background-position: -20px -760px;
}

i.icon-used-by-package {
    background-position: -40px -760px;
}

i.icon-used-by-user-package {
    background-position: -60px -760px;
}

i.icon-uses-package {
    background-position: -80px -760px;
}

i.icon-uses-user-package {
    background-position: -100px -760px;
}

i.icon-function {
    background-position: -0px -780px;
}

i.icon-function-user {
    background-position: -20px -780px;
}

i.icon-used-by-function {
    background-position: -40px -780px;
}

i.icon-used-by-user-function {
    background-position: -60px -780px;
}

i.icon-uses-function {
    background-position: -80px -780px;
}

i.icon-uses-user-function {
    background-position: -100px -780px;
}

i.icon-trigger-active {
    background-position: -0px -800px;
}

i.icon-trigger-active-user {
    background-position: -20px -800px;
}

i.icon-used-by-trigger-active {
    background-position: -40px -800px;
}

i.icon-used-by-user-trigger-active {
    background-position: -60px -800px;
}

i.icon-uses-trigger-active {
    background-position: -80px -800px;
}

i.icon-uses-user-trigger-active {
    background-position: -100px -800px;
}

i.icon-trigger-disabled {
    background-position: -0px -820px;
}

i.icon-trigger-disabled-user {
    background-position: -20px -820px;
}

i.icon-used-by-trigger-disabled {
    background-position: -40px -820px;
}

i.icon-used-by-user-trigger-disabled {
    background-position: -60px -820px;
}

i.icon-uses-trigger-disabled {
    background-position: -80px -820px;
}

i.icon-uses-user-trigger-disabled {
    background-position: -100px -820px;
}

i.icon-rule-active {
    background-position: -0px -840px;
}

i.icon-rule-active-user {
    background-position: -20px -840px;
}

i.icon-used-by-rule-active {
    background-position: -40px -840px;
}

i.icon-used-by-user-rule-active {
    background-position: -60px -840px;
}

i.icon-uses-rule-active {
    background-position: -80px -840px;
}

i.icon-uses-user-rule-active {
    background-position: -100px -840px;
}

i.icon-rule-disabled {
    background-position: -0px -860px;
}

i.icon-rule-disabled-user {
    background-position: -20px -860px;
}

i.icon-used-by-rule-disabled {
    background-position: -40px -860px;
}

i.icon-used-by-user-rule-disabled {
    background-position: -60px -860px;
}

i.icon-uses-rule-disabled {
    background-position: -80px -860px;
}

i.icon-uses-user-rule-disabled {
    background-position: -100px -860px;
}

i.icon-column {
    background-position: -0px -880px;
}

i.icon-column-user {
    background-position: -20px -880px;
}

/* Other */
i.icon-loader {
    background: url('../img/icons/loader.gif');
}

i.icon-none {
    background: none;
}

/* 2.2. Medium (24px)
   ========================================================================== */

i[class*='icon24-'],
i[class^='icon24-'] {
    display: inline-block;
    vertical-align: top;
    width: 24px;
    height: 24px;
    background: url('../img/icons/sprite.24.png?v=2');
    margin-right: 6px;
    margin-top: 2px;
}

i.no-margin {
    margin: 0px;
}

/* Row 1 */
i.icon24-relation-1x-1x {
    background-position: -0px -0px;
}

i.icon24-relation-1x-1x-user {
    background-position: -25px -0px;
}

/* Row 2 */
i.icon24-relation-1x-mx {
    background-position: -0px -25px;
}

i.icon24-relation-1x-mx-user {
    background-position: -25px -25px;
}

/* Row 3 */
i.icon24-relation-mx-1x {
    background-position: -0px -50px;
}

i.icon24-relation-mx-1x-user {
    background-position: -25px -50px;
}

/* 2.3. Large (32px)
   ========================================================================== */

i[class*='icon2x-'],
i[class^='icon2x-'] {
    display: inline-block;
    vertical-align: top;
    width: 32px;
    height: 32px;
    background: url('../img/icons/sprite2x.png?v=2');
    margin-right: 6px;
    margin-top: 2px;
}

i.no-margin {
    margin: 0px;
}

/* Row 1 */
/*i.icon2x-folder           { background-position: -0px 0px; }*/
i.icon2x-database {
    background-position: -40px 0px;
}

i.icon2x-module {
    background-position: -80px 0px;
}
/*i.icon2x-arrow-asc        { background-position: -120px 0px; }*/
i.icon2x-relation {
    background-position: -160px 0px;
}

i.icon2x-trigger-disabled {
    background-position: -200px 0px;
}

/* Row 2 */
i.icon2x-table {
    background-position: -0px -40px;
}

i.icon2x-view {
    background-position: -40px -40px;
}

i.icon2x-key {
    background-position: -80px -40px;
}
/*i.icon2x-arrow-desc      { background-position: -120px -40px; }*/
i.icon2x-unique-key {
    background-position: -160px -40px;
}

i.icon2x-user-unique-key {
    background-position: -200px -40px;
}

/* Row 3 */
i.icon2x-function {
    background-position: -0px -80px;
}

i.icon2x-procedure {
    background-position: -40px -80px;
}
/*i.icon2x-chapter        { background-position: -80px -80px; }*/
i.icon2x-error {
    background-position: -120px -80px;
}

i.icon2x-trigger-active {
    background-position: -160px -80px;
}

i.icon2x-user-relation {
    background-position: -200px -80px;
}

/* Row 4 */
i.icon2x-user-key {
    background-position: -0px -120px;
}

i.icon2x-unresolved-entity {
    background-position: -40px -120px;
}
/*i.icon2x-expand            { background-position: -80px -120px; }*/
/*i.icon2x-collapse          { background-position: -120px -120px; }*/
i.icon2x-check {
    background-position: -160px -120px;
}

i.icon2x-table-user {
    background-position: -200px -120px;
}

i.icon2x-none {
    background-position: -0px -200px;
}

i.icon2x-none-user {
    background-position: -40px -200px;
}

i.icon2x-table {
    background-position: -0px -240px;
}

i.icon2x-table-user {
    background-position: -40px -240px;
}

i.icon2x-external-table {
    background-position: -0px -280px;
}

i.icon2x-external-table-user {
    background-position: -40px -280px;
}

i.icon2x-foreign-table {
    background-position: -0px -320px;
}

i.icon2x-foreign-table-user {
    background-position: -40px -320px;
}

i.icon2x-file-table {
    background-position: -0px -360px;
}

i.icon2x-file-table-user {
    background-position: -40px -360px;
}

i.icon2x-graph-table {
    background-position: -0px -400px;
}

i.icon2x-graph-table-user {
    background-position: -40px -400px;
}

i.icon2x-graph-node-table {
    background-position: -0px -440px;
}

i.icon2x-graph-node-table-user {
    background-position: -40px -440px;
}

i.icon2x-graph-vertex-table {
    background-position: -0px -480px;
}

i.icon2x-graph-vertex-table-user {
    background-position: -40px -480px;
}

i.icon2x-graph-edge-table {
    background-position: -0px -520px;
}

i.icon2x-graph-edge-table-user {
    background-position: -40px -520px;
}

i.icon2x-system-versioned-table {
    background-position: -0px -560px;
}

i.icon2x-system-versioned-table-user {
    background-position: -40px -560px;
}

i.icon2x-history-table {
    background-position: -0px -600px;
}

i.icon2x-history-table-user {
    background-position: -40px -600px;
}

i.icon2x-search-index {
    background-position: -0px -640px;
}

i.icon2x-search-index-user {
    background-position: -40px -640px;
}

i.icon2x-collection {
    background-position: -0px -680px;
}

i.icon2x-collection-user {
    background-position: -40px -680px;
}

i.icon2x-entity {
    background-position: -0px -720px;
}

i.icon2x-entity-user {
    background-position: -40px -720px;
}

i.icon2x-cube {
    background-position: -0px -760px;
}

i.icon2x-cube-user {
    background-position: -40px -760px;
}

i.icon2x-dimension {
    background-position: -0px -800px;
}

i.icon2x-dimension-user {
    background-position: -40px -800px;
}

i.icon2x-flat-file {
    background-position: -0px -840px;
}

i.icon2x-flat-file-user {
    background-position: -40px -840px;
}

i.icon2x-object {
    background-position: -0px -880px;
}

i.icon2x-object-user {
    background-position: -40px -880px;
}

i.icon2x-standard-object {
    background-position: -0px -920px;
}

i.icon2x-standard-object-user {
    background-position: -40px -920px;
}

i.icon2x-custom-object {
    background-position: -0px -960px;
}

i.icon2x-custom-object-user {
    background-position: -40px -960px;
}

i.icon2x-external-object {
    background-position: -0px -1000px;
}

i.icon2x-external-object-user {
    background-position: -40px -1000px;
}

i.icon2x-view {
    background-position: -0px -1040px;
}

i.icon2x-view-user {
    background-position: -40px -1040px;
}

i.icon2x-materialized-view {
    background-position: -0px -1080px;
}

i.icon2x-materialized-view-user {
    background-position: -40px -1080px;
}

i.icon2x-editioning-view {
    background-position: -0px -1120px;
}

i.icon2x-editioning-view-user {
    background-position: -40px -1120px;
}

i.icon2x-indexed-view {
    background-position: -0px -1160px;
}

i.icon2x-indexed-view-user {
    background-position: -40px -1160px;
}

i.icon2x-named-query {
    background-position: -0px -1200px;
}

i.icon2x-named-query-user {
    background-position: -40px -1200px;
}

i.icon2x-procedure {
    background-position: -0px -1240px;
}

i.icon2x-procedure-user {
    background-position: -40px -1240px;
}

i.icon2x-package {
    background-position: -0px -1280px;
}

i.icon2x-package-user {
    background-position: -40px -1280px;
}

i.icon2x-function {
    background-position: -0px -1320px;
}

i.icon2x-function-user {
    background-position: -40px -1320px;
}

i.icon2x-trigger-active {
    background-position: -0px -1360px;
}

i.icon2x-trigger-active-user {
    background-position: -40px -1360px;
}

i.icon2x-trigger-disabled {
    background-position: -0px -1400px;
}

i.icon2x-trigger-disabled-user {
    background-position: -40px -1400px;
}

i.icon2x-rule-active {
    background-position: -0px -1440px;
}

i.icon2x-rule-active-user {
    background-position: -40px -1440px;
}

i.icon2x-rule-disabled {
    background-position: -0px -1480px;
}

i.icon2x-rule-disabled-user {
    background-position: -40px -1480px;
}

/* ==========================================================================
   3. Grids
   ========================================================================== */

.grid:before,
.grid:after {
    content: " ";
    display: table;
}

.grid:after {
    clear: both;
}

/* 3.1. Grid row
   ========================================================================== */
.grid {
    display: block;
    width: 100%;
}

    /* 3.2. Row column
   ========================================================================== */
    .grid [class*='span'],
    .grid [class^='span'] {
        display: block;
        float: left;
        overflow: hidden;
    }

    .grid .span0 {
        width: 0%;
    }

    .grid .span1 {
        width: 8.333333333333333%;
    }

    .grid .span2 {
        width: 16.66666666666667%;
    }

    .grid .span3 {
        width: 25%;
    }

    .grid .span4 {
        width: 33.33333333333333%;
    }

    .grid .span5 {
        width: 41.66666666666667%;
    }

    .grid .span6 {
        width: 50%;
    }

    .grid .span7 {
        width: 58.33333333333333%;
    }

    .grid .span8 {
        width: 66.66666666666667%;
    }

    .grid .span9 {
        width: 75%;
    }

    .grid .span10 {
        width: 83.33333333333333%;
    }

    .grid .span11 {
        width: 91.66666666666667%;
    }

    .grid .span12 {
        width: 100%;
    }

@media (max-width: 900px) {
    .grid [class*='span'],
    .grid [class^='span'] {
        display: block;
        overflow: auto;
        float: none;
        width: 100%;
    }
}

/* ==========================================================================
   4. Buttons
   ========================================================================== */

.btn {
    display: inline-block;
    border: 1px solid transparent;
    background: transparent;
    color: rgba(0, 0, 0, 0.85);
    text-decoration: none;
    padding: 10px 16px;
}

    .btn:hover {
        border-color: #aed3f3;
        background: #dcf1f9;
    }

/* ==========================================================================
   5. Tables
   ========================================================================== */

.table {
    max-width: 100%;
    text-align: left;
    table-layout: auto;
    border-collapse: collapse;
    border-spacing: 0;
    border: 1px solid #dbe3f3;
    margin: 0;
}

@media (max-width: 900px) {
    .table {
        table-layout: fixed;
    }
}

.table.collapsed caption:before,
.collapsed .table-caption:before {
    background-position: -40px -60px;
}

.table th {
    background: #dbe3f3;
}

.table th,
.table td,
.table-td {
    padding: 6px 20px 6px 0;
    border-top: 1px solid #dbe3f3;
    border-bottom: 1px solid #dbe3f3;
    overflow: hidden;
    min-width: 20px;
    vertical-align: top;
}

    .table th:first-child,
    .table td:first-child,
    .table-td:first-child {
        padding-left: 20px;
    }

@media all and (max-width: 1000px) {
    .table {
        table-layout: auto;
    }

        .table th,
        .table td {
            width: auto !important;
        }
}

table.list td.ordinal {
    text-align: right;
    padding-right: 5px;
}

table.list td.display-name {
    padding: 6px 0;
}

/* 5.1. Collapsible
   ========================================================================== */

.collapsible {
    transition: margin 0.2s;
    margin-top: 30px;
}

    .collapsible.collapsed + .collapsible {
        margin-top: 0px;
    }

.collapsible-link {
    text-align: left;
    padding: 5px 20px 5px;
    font-weight: normal;
    position: relative;
    cursor: pointer;
    color: #4679c6;
    margin: 0;
}

    .collapsible-link:before {
        content: " ";
        display: block;
        width: 16px;
        height: 16px;
        margin-top: 2px;
        background: url('../img/icons/sprite.png?v=2');
        background-position: -60px -60px;
        position: absolute;
        left: 0px;
    }

.collapsible-area {
    overflow-x: auto;
}

/* 5.2. Vertical layout
   ========================================================================== */

.table-vertical {
    width: auto;
    border: none;
}

    .table-vertical td {
        padding: 3px 0;
        width: auto !important;
        background: transparent !important;
        border: none;
    }

        .table-vertical td:first-child {
            padding-left: 0px;
        }

        .table-vertical td + td {
            padding-left: 20px;
        }

        .table-vertical td:first-child {
            font-weight: bold;
        }

/* ==========================================================================
   6. Tree menu
   ========================================================================== */

.tree {
    display: block;
    background: #fff;
}

    .tree i[class*='icon-'],
    .tree i[class^='icon-'] {
        margin-left: 2px;
        vertical-align: text-top;
    }

    .tree,
    .tree ul {
        list-style-type: none;
    }

        .tree li {
            overflow: hidden;
            white-space: nowrap;
            padding: 4px 0;
        }

            .tree li:last-child,
            .tree ul li:last-child {
                padding-bottom: 0;
            }

        .tree ul li {
            padding-left: 20px;
        }

        .tree ul {
            background: url('../img/tree/nono.png?v=2') top left repeat-y;
        }

            .tree ul li {
                background: url('../img/tree/nnno.png?v=2') top left no-repeat;
            }

                .tree ul li.expand {
                    background: url('../img/tree/nnno-p.png?v=2') top left no-repeat;
                }

                .tree ul li.narrow {
                    background: url('../img/tree/nnno-m.png?v=2') top left no-repeat;
                }

                .tree ul li:last-child {
                    background: #fff url('../img/tree/nnoo.png?v=2') top left no-repeat;
                }

                .tree ul li.expand:last-child {
                    background: #fff url('../img/tree/nnoo-p.png?v=2') top left no-repeat;
                }

                .tree ul li.narrow:last-child {
                    background: #fff url('../img/tree/nnoo-m.png?v=2') top left no-repeat;
                }

@media all and (max-width: 1000px) {
    .tree li {
        overflow: hidden;
        white-space: nowrap;
        padding: 9px 0;
    }

    .tree ul {
        padding-top: 5px;
    }

        .tree ul li {
            padding-left: 20px;
        }

    .tree ul {
        background: url('../img/tree/mobile/nono.png?v=2') top left repeat-y;
    }

        .tree ul li {
            background: url('../img/tree/mobile/nnno.png?v=2') top left no-repeat;
        }

            .tree ul li.expand {
                background: url('../img/tree/mobile/nnno-p.png?v=2') top left no-repeat;
            }

            .tree ul li.narrow {
                background: url('../img/tree/mobile/nnno-m.png?v=2') top left no-repeat;
            }

            .tree ul li:last-child {
                background: #fff url('../img/tree/mobile/nnoo.png?v=2') top left no-repeat;
            }

            .tree ul li.expand:last-child {
                background: #fff url('../img/tree/mobile/nnoo-p.png?v=2') top left no-repeat;
            }

            .tree ul li.narrow:last-child {
                background: #fff url('../img/tree/mobile/nnoo-m.png?v=2') top left no-repeat;
            }
}

.search-box {
    position: relative;
}

.search-input {
    width: 100%;
    padding: 0 10px;
    padding-right: 28px;
    height: 28px;
    border: 1px solid transparent;
    margin-bottom: 5px;
    transition: all 0.4s;
    outline: none;
    border-color: lightgray;
    background-color: white;
}

.search-icon {
    width: 28px;
    height: 28px;
    position: absolute;
    top: 0px;
    right: 0px;
    background: url(../img/icons/search.png?v=2) center center no-repeat;
    transition: right 0.4s;
}

.search-options-btn {
    opacity: 0;
    z-index: -1;
    cursor: pointer;
    width: 16px;
    height: 16px;
    margin: 6px;
    position: absolute;
    top: 0px;
    right: 0px;
    background: url(../img/icons/sprite.png?v=2) center center no-repeat;
    background-position: -120px -160px;
    transition: opacity 0.2s;
}

.search-options-dropdown {
    display: none;
    position: absolute;
    top: 32px;
    right: 0px;
    left: 0px;
    width: 100%;
    background: white;
    border-radius: 2px;
    padding: 10px 15px;
    box-shadow: 0 1px 3px rgba(0,0,0,0.6);
}

.search-options-dropdown-group + .search-options-dropdown-group {
    margin-top: 5px;
}

.search-item-hidden {
    display: none;
}

.search-item-match {
    background: yellow;
}

.search-box.-with-pattern .search-input {
    width: calc(100% - 28px);
}

.search-box.-with-pattern .search-icon {
    right: 28px;
}

.search-box.-with-search-started .search-icon {
    background: url(../img/icons/search-close.png?v=2) center center no-repeat;
    cursor: pointer;
}

.search-box.-with-pattern .search-options-btn {
    opacity: 1;
    z-index: 0;
    transition: opacity 0.8s;
}

/* ==========================================================================
   7. Responsive
   ========================================================================== */
.scroll-x {
    overflow-x: auto;
}

@media all and (max-width: 1000px) {
    tr.only-mobile {
        display: table-row;
    }

    th.only-mobile,
    td.only-mobile {
        display: table-cell;
    }

    tr.only-desktop {
        display: none !important;
    }

    th.only-desktop,
    td.only-desktop {
        display: none !important;
    }
}

@media all and (min-width: 1001px) {
    tr.only-mobile {
        display: none !important;
    }

    th.only-mobile,
    td.only-mobile {
        display: none !important;
    }

    tr.only-desktop {
        display: table-row;
    }

    th.only-desktop,
    td.only-desktop {
        display: table-cell;
    }
}

/* ==========================================================================
   8. Typography
   ========================================================================== */

body.font-size-small table {
    font-size: 12px;
}

body.font-size-medium table {
    font-size: 13px;
}

body.font-size-large table {
    font-size: 14px;
}

body.font-size-small .font-small {
    font-size: 12px;
}

body.font-size-small .font-medium {
    font-size: 13px;
}

body.font-size-small .font-large {
    font-size: 14px;
}

body.font-size-medium .font-small {
    font-size: 13px;
}

body.font-size-medium .font-medium {
    font-size: 14px;
}

body.font-size-medium .font-large {
    font-size: 15px;
}

body.font-size-large .font-small {
    font-size: 14px;
}

body.font-size-large .font-medium {
    font-size: 15px;
}

body.font-size-large .font-large {
    font-size: 16px;
}

.font-regular {
    font-weight: normal;
}

.font-bold {
    font-weight: bold;
}

.font-gray {
    color: #999999;
}

.font-blue {
    color: #4679C6;
}

/* ==========================================================================
   9. Common
   ========================================================================== */

.trial {
    color: rgba(0,0,0,0.5) !important;
}

.trial-header {
    margin-left: 10px;
}

.trial-content {
    margin-bottom: 15px;
    font-size: 16px;
}
