@import url("ox.ui.classic.css"); @import url("ox.ui.modern.css"); @import url("ox.ui.future.css"); /* ================================================================================ Base ================================================================================ */ body { margin: 0; overflow: hidden; -moz-user-select: -moz-none; -webkit-user-select: none; } div { -moz-user-select: -moz-none; -webkit-user-select: none; } div, input, textarea { font-family: Lucida Grande, Segoe UI, DejaVu Sans, Arial; font-size: 11px; } img { -moz-user-drag: none; -webkit-user-drag: none; } td { padding: 0; } .OxSelectable { -moz-user-select: text; -webkit-user-select: text; } /* ================================================================================ Core ================================================================================ */ .OxContainer { left: 0; top: 0; right: 0; bottom: 0; //overflow: hidden; overflow: auto; } .OxContent { //overflow: auto; } /* ================================================================================ Bars ================================================================================ */ .OxBar { overflow: hidden; white-space: nowrap; } .OxResizebar { z-index: 2; } .OxResizebar.OxHorizontal { width: 100%; height: 5px; margin: -2px 0 -2px 0; cursor: ns-resize; } .OxResizebar.OxHorizontal > .OxLine { width: 100%; height: 1px; } .OxResizebar.OxHorizontal > .OxSpace { width: 100%; height: 2px; } .OxResizebar.OxVertical { width: 5px; height: 100%; margin: 0 -2px 0 -2px; cursor: ew-resize; } .OxResizebar.OxVertical > .OxLine { float: left; width: 1px; height: 100%; } .OxResizebar.OxVertical > .OxSpace { float: left; width: 2px; height: 100%; } .OxTabbar > .OxButtonGroup { margin: 4px 0 0 4px; } /* ================================================================================ Dialog ================================================================================ */ .OxDialog { position: absolute; //left: 0; //top: 0; //right: 0; //bottom: 0; //margin: auto; z-index: 11; -moz-border-radius: 8px; -webkit-border-radius: 8px; } .OxDialog > .OxTitleBar { //left: 0px; //right: 0px; //height: 16px; //padding: 3px 8px 5px 8px; //padding: 3px 0 5px 0; cursor: move; -moz-border-radius-topleft: 8px; -moz-border-radius-topright: 8px; -webkit-border-top-left-radius: 8px; -webkit-border-top-right-radius: 8px; } .OxDialog > .OxTitleBar > .OxTitle { margin: 4px 8px 0 8px; font-size: 11px; font-weight: bold; text-overflow: ellipsis; overflow: hidden; white-space: nowrap; } .OxDialog > .OxContent { position: relative; top: 0; bottom: 24px; height: 100%; //padding: 16px; //font-size: 12px; //line-height: 16px; } .OxDialog > .OxButtonsBar { left: 0; right: 0; bottom: 0; height: 24px; //text-align: right; -moz-border-radius-bottomleft: 8px; -moz-border-radius-bottomright: 8px; -webkit-border-bottom-left-radius: 8px; -webkit-border-bottom-right-radius: 8px; } .OxDialog > .OxButtonsBar > .OxButton { margin: 4px 2px 0 2px; } .OxDialog > .OxButtonsBar > .OxButton.OxLeft { float: left; } .OxDialog > .OxButtonsBar > .OxButton.OxLeft:first-child { margin-left: 16px; } .OxDialog > .OxButtonsBar > .OxButton.OxRight { float: right; } .OxDialog > .OxButtonsBar > .OxResize { float: right; height: 24px; width: 14px; cursor: se-resize; } /* ================================================================================ Drag & Drop ================================================================================ */ .OxDrag { cursor: move; opacity: 0.5; } /* ================================================================================ Forms ================================================================================ */ input, textarea { padding: 0; border: 1px; margin: 0; } input[type=button], input[type=reset], input[type=submit] { -moz-box-sizing: content-box; -webkit-box-sizing: content-box; } input[type=image] { cursor: default; } input:focus, textarea:focus { outline: none; } /* input.OxXlarge { height: 26px; font-size: 19px; padding: 0 12px 0 12px; -moz-border-radius: 14px; -webkit-border-radius: 14px; } input.OxLarge { height: 22px; font-size: 16px; padding: 0 10px 0 10px; -moz-border-radius: 12px; -webkit-border-radius: 12px; } */ input.OxLarge { height: 18px; font-size: 13px; padding: 0 8px 0 8px; -moz-border-radius: 10px; -webkit-border-radius: 10px; } input.OxMedium { height: 14px; padding: 0 6px 0 6px; font-size: 11px; -moz-border-radius: 8px; -webkit-border-radius: 8px; } input.OxMedium.OxRounded { padding: 0 6px 0 6px; -moz-border-radius: 8px; -webkit-border-radius: 8px; } input.OxMedium.OxSquare { padding: 0 2px 0 2px; -moz-border-radius: 0; -webkit-border-radius: 0; } input.OxSmall { height: 10px; padding: 0 4px 0 4px; font-size: 8px; -moz-border-radius: 6px; -webkit-border-radius: 6px; } input[type=image] { padding: 0; -moz-user-select: none; -webkit-user-select: none; } /* input[type=image].OxLarge { width: 22px; } */ input[type=image].OxLarge { width: 18px; } input[type=image].OxMedium { width: 14px; } input[type=image].OxSmall { width: 10px; } input::-moz-focus-inner { border: none; } textarea { //padding: 2px 4px 2px 4px; padding: 0 4px 0 4px; margin: -1px 0 0 0; resize: none; -moz-border-radius: 8px; -webkit-border-radius: 8px; } /* -------------------------------------------------------------------------------- OxButton -------------------------------------------------------------------------------- */ .OxButton { text-align: center; } .OxButton.OxSymbol, .OxButton.OxSymbol:active, .OxButton.OxSymbol:focus { padding: 0; border: 1px solid rgba(0, 0, 0, 0); background: rgba(0, 0, 0, 0); -moz-box-shadow: 0 0 0 rgba(0, 0, 0, 0); //-webkit-box-shadow: 0 0 0 rgba(0, 0, 0, 0); } /* -------------------------------------------------------------------------------- OxButtonGroup -------------------------------------------------------------------------------- */ .OxButtonGroup { display: table-cell; float: left; //overflow: hidden; //white-space: nowrap; } .OxButtonGroup > .OxButton { border-right-width: 0; -moz-border-radius: 0; -webkit-border-radius: 0; } .OxButtonGroup > .OxButton:last-child { border-right-width: 1px; } .OxButtonGroup > .OxButton.OxLarge:first-child { -moz-border-radius-topleft: 6px; -moz-border-radius-bottomleft: 6px; -webkit-border-top-left-radius: 6px; -webkit-border-bottom-left-radius: 6px; } .OxButtonGroup > .OxButton.OxLarge:last-child { -moz-border-radius-topright: 6px; -moz-border-radius-bottomright: 6px; -webkit-border-top-right-radius: 6px; -webkit-border-bottom-right-radius: 6px; } .OxButtonGroup > .OxButton.OxMedium:first-child { -moz-border-radius-topleft: 8px; -moz-border-radius-bottomleft: 8px; -webkit-border-top-left-radius: 8px; -webkit-border-bottom-left-radius: 8px; } .OxButtonGroup > .OxButton.OxMedium:last-child { -moz-border-radius-topright: 8px; -moz-border-radius-bottomright: 8px; -webkit-border-top-right-radius: 8px; -webkit-border-bottom-right-radius: 8px; } .OxButtonGroup > .OxButton.OxSmall:first-child { -moz-border-radius-topleft: 2px; -moz-border-radius-bottomleft: 2px; -webkit-border-top-left-radius: 2px; -webkit-border-bottom-left-radius: 2px; } .OxButtonGroup > .OxButton.OxSmall:last-child { -moz-border-radius-topright: 2px; -moz-border-radius-bottomright: 2px; -webkit-border-top-right-radius: 2px; -webkit-border-bottom-right-radius: 2px; } .OxButtonGroup > .OxButton.OxTab { -moz-border-radius-topleft: 4px; -moz-border-radius-topright: 4px; -moz-border-radius-bottomleft: 0; -moz-border-radius-bottomright: 0; -webkit-border-top-left-radius: 4px; -webkit-border-top-right-radius: 4px; -webkit-border-bottom-left-radius: 0; -webkit-border-bottom-right-radius: 0; } .OxButtonGroup > .OxButton.OxTab:first-child { -moz-border-radius-bottomleft: 0; -webkit-border-bottom-left-radius: 0; } .OxButtonGroup > .OxButton.OxTab:last-child { -moz-border-radius-bottomright: 0; -webkit-border-bottom-right-radius: 0; } /* -------------------------------------------------------------------------------- OxForm -------------------------------------------------------------------------------- */ .OxFormItem { margin-top: 8px; } .OxFormItem:first-child { margin-top: 0; } .OxFormMessage { //width: 100%; height: 10px; margin: 2px 8px 0 0; text-align: right; display: none; } /* -------------------------------------------------------------------------------- OxCheckbox -------------------------------------------------------------------------------- */ div.OxCheckbox { height: 16px; -moz-border-radius: 8px; -webkit-border-radius: 8px; } input.OxCheckbox { width: 14px; height: 14px; -moz-border-radius: 8px; -webkit-border-radius: 8px; } .OxCheckboxGroup > div.OxCheckbox { float: left; } .OxCheckboxGroup > div.OxCheckbox { //padding-right: 16px; margin-right: -16px; } .OxCheckboxGroup > div.OxCheckbox:last-child { //padding-right: 0; margin-right: 0; } /* -------------------------------------------------------------------------------- OxInput -------------------------------------------------------------------------------- */ div.OxInput { height: 16px; } div.OxInput.OxMedium { height: 16px; } div.OxInput.OxRounded { -moz-border-radius: 8px; -webkit-border-radius: 8px; } div.OxInput.OxSquare { -moz-border-radius: 0; -webkit-border-radius: 0; } div.OxInput > .OxInputLabel { float: left; padding: 0 6px 0 6px; cursor: default; } input.OxInput { float: left; } /* -------------------------------------------------------------------------------- OxInputGroup -------------------------------------------------------------------------------- */ .OxInputGroup { height: 16px; } .OxInputGroup > div { float: left; } /* -------------------------------------------------------------------------------- OxLabel -------------------------------------------------------------------------------- */ .OxLabel { height: 14px; border: 1px; padding: 0 6px 0 6px; text-overflow: ellipsis; cursor: default; overflow: hidden; white-space: nowrap; -moz-border-radius: 8px; -webkit-border-radius: 8px; } /* -------------------------------------------------------------------------------- OxPicker -------------------------------------------------------------------------------- */ .OxPicker { position: absolute; z-index: 13; -moz-border-radius: 0 8px 8px 8px; -webkit-border-radius: 0 8px 8px 8px; -moz-box-shadow: 0 2px 4px rgba(0, 0, 0, 0.75); -webkit-box-shadow: 0 2px 4px rgba(0, 0, 0, 0.75); } .OxPicker > div:first-child { background: rgb(240, 240, 240); -moz-border-radius: 0 8px 0 0; -webkit-border-radius: 0 8px 0 0; } .OxPicker > .OxBar { -moz-border-radius: 0 0 8px 8px; -webkit-border-radius: 0 0 8px 8px; } .OxPicker > .OxBar > .OxLabel { float: left; margin: 4px 0 4px 4px; } .OxPicker > .OxBar > .OxButton { float: right; margin: 4px 4px 4px 0; } /* -------------------------------------------------------------------------------- OxRange -------------------------------------------------------------------------------- */ .OxRange { height: 16px; } .OxRange > .OxArrow { float: right; } .OxRange > .OxArrow:first-child { float: left; } .OxRange > .OxTrack { float: right; height: 14px; -moz-border-radius: 8px; -webkit-border-radius: 8px; } .OxRange > .OxTrack > div { float: left; height: 16px; padding: 1px; margin: -1px; } .OxRange > .OxTrack > div > img { float: left; height: 14px; -webkit-user-select: none; } .OxRange > .OxTrack > div > img.OxFirstChild { -moz-border-radius: 7px; -webkit-border-top-left-radius: 7px; -webkit-border-bottom-left-radius: 7px; } .OxRange > .OxTrack > div > img.OxLastChild { -moz-border-radius: 0 7px 7px 0; -webkit-border-top-right-radius: 7px; -webkit-border-bottom-right-radius: 7px; } .OxRange > .OxTrack > div > img.OxFirstChild.OxLastChild { margin-left: 7px; -moz-border-radius: 0; -webkit-border-radius: 0; } .OxRange > .OxTrack > .OxThumb { float: left; margin: -1px; //margin-left: -1px; //margin-top: -1px; text-align: center; } .OxRange > .OxTrack > .OxThumb:first-child { //margin-top: -1px; } /* -------------------------------------------------------------------------------- OxSelect -------------------------------------------------------------------------------- */ .OxSelect.OxMedium { height: 14px; -moz-border-radius: 8px; -webkit-border-radius: 8px; } .OxSelect.OxSelected { -moz-border-radius: 8px 8px 0 0; -webkit-border-radius: 8px 8px 0 0; } .OxSelect > .OxTitle { float: left; height: 14px; padding-left: 6px; text-align: left; text-overflow: ellipsis; cursor: default; overflow: hidden; white-space: nowrap; //margin-right: -16px; } .OxSelect.OxOverlapLeft > .OxTitle { //padding-left: 20px; //padding-right: 8px; //margin-left: -32px; } .OxSelect.OxOverlapRight > .OxTitle { //padding-left: 8px; //padding-right: 20px; //margin-right: -32px; } .OxSelect > .OxButton { float: right; margin: -1px; } .OxSelect.OxOverlapLeft > .OxButton { //padding-left: 15px; //padding-right: 1px; //margin-left: -16px; } .OxSelect.OxOverlapRight > .OxButton { //padding-left: 1px; //padding-right: 15px; //margin-right: -16px; } /* */ .OxButton.OxOverlapLeft, .OxLabel.OxOverlapLeft, .OxxxSelect.OxOverlapLeft { padding-left: 20px; padding-right: 8px; margin-left: -16px; } .OxButton.OxOverlapRight, .OxLabel.OxOverlapRight, .OxxxSelect.OxOverlapRight { padding-left: 8px; padding-right: 20px; margin-right: -16px; } .OxButton[type=image].OxOverlapLeft { padding-left: 15px; padding-right: 1px; } .OxButton[type=image].OxOverlapRight { padding-left: 1px; padding-right: 15px; } .OxSelect.OxOverlapLeft { //padding-left: 8px; padding-left: 16px; margin-left: -18px; } .OxSelect.OxOverlapRight { //padding-left: 8px; padding-right: 16px; margin-right: -18px; } /* ================================================================================ Layers ================================================================================ */ .OxLayer { position: absolute; left: 0; top: 0; right: 0; bottom: 0; opacity: 0; overflow: hidden; z-index: 10; } .OxLayer.OxFront { z-index: 100; } .OxMainMenuLayer { position: absolute; width: 100%; top: 20px; bottom: 0px; overflow: hidden; z-index: 12; } .OxMenuLayer { position: absolute; left: 0; top: 0; right: 0; bottom: 0; opacity: 0; overflow: hidden; z-index: 12; } /* ================================================================================ Lists ================================================================================ */ .OxIconList.OxBoth { overflow-x: hidden; } .OxIconList .OxPage { position: absolute; left: 0; right: 0; margin-left: auto; margin-right: auto; } .OxIconList .OxItem { float: left; margin: 4px; opacity: 0.9; } .OxIconList .OxItem.OxHover, .OxIconList .OxItem.OxSelected { opacity: 1; } .OxIconList .OxItem > div { position: relative; } .OxIconList .OxItem > .OxIcon, .OxIconList .OxItem > .OxText { //left: -2px; } .OxIconList .OxItem > .OxIcon img { position: absolute; left: 0; right: 0; bottom: 0; margin: auto; border: 2px solid rgba(0, 0, 0, 0); cursor: pointer; -moz-border-radius: 4px; -webkit-border-radius: 4px; } .OxIconList .OxItem > .OxReflection { overflow: hidden; } .OxIconList .OxItem > .OxReflection > div { position: absolute; left: 0; top: 0; right: 0; margin: auto; } .OxIconList .OxItem > .OxReflection > img { position: absolute; left: 0; top: 0; right: 0; margin: auto; //-moz-border-radius: 4px; //-webkit-border-radius: 4px; -moz-transform: scaleY(-1); -webkit-transform: scaleY(-1); } .OxIconList .OxItem > .OxText { text-align: center; } .OxIconList .OxItem > .OxText > div { display: inline-block; font-size: 9px; font-weight: bold; text-align: center; padding: 1px 2px; border: 2px solid rgba(0, 0, 0, 0); max-width: 124px; word-wrap: break-word; cursor: pointer; -moz-border-radius: 4px; -webkit-border-radius: 4px; //-moz-user-select: text; //-webkit-user-select: text; } .OxTextList .OxBar { //z-index: 10; //-moz-box-shadow: 2px 2px 4px rgba(0, 0, 0, 0.75); //-webkit-box-shadow: 2px 2px 4px rgba(0, 0, 0, 0.75); } .OxTextList .OxBar .OxHead { position: absolute; left: 0; right: 12px; height: 16px; overflow: hidden; white-space: nowrap; } .OxTextList .OxBar .OxCell { float: left; padding: 2px 4px 2px 4px; height: 12px; } .OxTextList .OxBar .OxCell:nthChild(1) { margin-left: 0; } .OxTextList .OxBar .OxTitle { float: left; height: 15px; padding: 1px 2px 0 2px; font-weight: bold; font-size: 10px; text-overflow: ellipsis; //cursor: pointer; overflow: hidden; white-space: nowrap; } .OxTextList .OxBar .OxTitle img { width: 16px; height: 16px; margin: -1px 0 0 -4px; } .OxTextList .OxBar .OxTitle:first-child { padding-left: 4px; } .OxTextList .OxBar .OxOrder { float: left; width: 10px; height: 13px; padding: 3px 0 0 6px; font-size: 7px; display: none; } .OxTextList .OxBar .OxOrder.OxSelected { //cursor: pointer; display: block; } .OxTextList .OxBar .OxResize { float: left; width: 5px; height: 16px; } .OxTextList .OxBar .OxResize.OxResizable { cursor: ew-resize; } .OxTextList .OxBar .OxResize .OxLeft, .OxTextList .OxBar .OxResize .OxCenter, .OxTextList .OxBar .OxResize .OxRight { float: left; height: 16px; } .OxTextList .OxBar .OxResize .OxLeft, .OxTextList .OxBar .OxResize .OxRight { width: 2px; } .OxTextList .OxBar .OxResize .OxCenter { width: 1px; background: rgb(24, 24, 24); } .OxTextList .OxBar .OxSelect { position: absolute; right: 0px; width: 11px; height: 16px; border-width: 0 1px 0 0; background: rgba(0, 0, 0, 0); font-size: 11px; text-align: center; cursor: pointer; overflow: hidden; -moz-border-radius: 0; -webkit-border-radius: 0; } .OxTextList .OxBar .OxSelect > input { margin-right: -3px; } .OxTextList .OxBody { float: left; position: absolute; left: 0; top: 0; right: 0; bottom: 0; } .OxTextList .OxBody .OxContent { //width: 100%; } .OxTextList .OxBody .OxItem { height: 16px; cursor: default; } .OxTextList .OxBody .OxItem .OxCell { float: left; height: 14px; padding: 1px 4px 1px 4px; text-overflow: ellipsis; overflow: hidden; white-space: nowrap; } .OxTextList .OxBody .OxItem .OxCell.OxEdit { height: 16px; padding: 0; } .OxTextList .OxBody .OxItem .OxCell > img { width: 16px; height: 16px; margin: -1px 0 0 -4px; } .OxTextList .OxBody .OxItem .OxSpace { float: left; width: 4px; height: 16px; } .OxTextList .OxBody .OxItem .OxLine { float: left; width: 1px; height: 16px; } .OxTextList .OxBody .OxItem.OxSelected .OxCell.OxClickable { cursor: pointer; } .OxTextList .OxBody .OxItem.OxSelected .OxCell.OxEditable { cursor: text; } .OxTextList .OxPage { position: absolute; } /* ================================================================================ Menus ================================================================================ */ .OxMainMenu { z-index: 9; -moz-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.5); -webkit-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.5); } .OxMainMenu.OxLarge { height: 24px; padding-left: 8px; } .OxMainMenu.OxMedium { height: 20px; padding-left: 6px; } .OxMainMenu.OxSmall { height: 16px; padding-left: 4px; } .OxMainMenu > .OxTitle { float: left; cursor: default; -moz-user-select: none; -webkit-user-select: none; } .OxMainMenu.OxLarge > .OxTitle { height: 21px; padding-left: 8px; padding-right: 8px; padding-top: 3px; font-size: 14px; } .OxMainMenu.OxMedium > .OxTitle { height: 17px; padding-left: 6px; padding-right: 6px; padding-top: 3px; font-size: 11px; } .OxMainMenu.OxSmall > .OxTitle { height: 14px; padding-left: 4px; padding-right: 4px; padding-top: 2px; font-size: 9px; } .OxMainMenu > .OxTitle:first-child { font-weight: bold; } .OxMainMenu.OxLarge > .OxExtras { float: right; padding: 4px 12px 0 0; } .OxMainMenu.OxMedium > .OxExtras { float: right; padding: 2px 10px 0 0; } .OxMainMenu.OxSmall > .OxExtras { float: right; padding: 2px 8px 0 0; } .OxMenu { position: absolute; display: none; z-index: 12; -moz-border-radius-bottomleft: 4px; -moz-border-radius-bottomright: 4px; -webkit-border-bottom-left-radius: 4px; -webkit-border-bottom-right-radius: 4px; -moz-user-select: none; -webkit-user-select: none; } .OxMenu.OxRight { -moz-border-radius-topright: 4px; -webkit-border-top-right-radius: 4px; } .OxMenu .OxTop { height: 4px; } .OxMenu.OxRight .OxTop { -moz-border-radius-topright: 4px; -webkit-border-top-right-radius: 4px; } .OxMenu .OxBottom { height: 4px; -moz-border-radius-bottomleft: 4px; -moz-border-radius-bottomright: 4px; -webkit-border-bottom-left-radius: 4px; -webkit-border-bottom-right-radius: 4px; } .OxMenu .OxContainer { background: transparent; overflow: hidden; } .OxMenu .OxContent { position: relative; border-collapse: collapse; border-spacing: 0; } .OxMenu .OxItem { cursor: default; } .OxMenu.OxLarge .OxItem { height: 20px; } .OxMenu.OxMedium .OxItem { height: 16px; } .OxMenu.OxSmall .OxItem { height: 12px; } .OxMenu .OxItem.OxDisabled { cursor: default; } .OxMenu.OxLarge .OxItem .OxCell { height: 20px; font-size: 14px; } .OxMenu.OxMedium .OxItem .OxCell { height: 16px; font-size: 11px; } .OxMenu.OxSmall .OxItem .OxCell { height: 12px; font-size: 9px; } .OxMenu .OxItem .OxCell.OxStatus { padding-left: 4px; text-align: right; } .OxMenu .OxItem .OxCell.OxIcon { padding-left: 4px; } .OxMenu .OxItem .OxCell.OxIcon img { position: relative; top: 2px; } .OxMenu.OxLarge .OxItem .OxCell.OxIcon img { width: 16px; height: 16px; -moz-border-radius: 2px; -webkit-border-radius: 2px; } .OxMenu.OxMedium .OxItem .OxCell.OxIcon img { width: 12px; height: 12px; -moz-border-radius: 2px; -webkit-border-radius: 2px; } .OxMenu.OxSmall .OxItem .OxCell.OxIcon img { width: 8px; height: 8px; -moz-border-radius: 1px; -webkit-border-radius: 1px; } .OxMenu .OxItem .OxCell.OxTitle { padding-left: 4px; white-space: nowrap; } .OxMenu .OxItem .OxCell.OxModifiers { padding-left: 4px; text-align: right; } .OxMenu .OxItem .OxCell.OxKey { padding-right: 8px; } .OxMenu .OxItem .OxCell.OxSubmenu { padding-right: 8px; text-align: right; } .OxMenu.OxLarge .OxItem .OxCell.OxSubmenu { font-size: 10px; } .OxMenu.OxMedium .OxItem .OxCell.OxSubmenu { font-size: 8px; } .OxMenu.OxSmall .OxItem .OxCell.OxSubmenu { font-size: 6px; } .OxMenu.OxLarge .OxItem .OxCell.OxStatus, .OxMenu.OxLarge .OxItem .OxCell.OxKey, .OxMenu.OxLarge .OxItem .OxCell.OxSubmenu { width: 12px; } .OxMenu.OxMedium .OxItem .OxCell.OxStatus, .OxMenu.OxMedium .OxItem .OxCell.OxKey, .OxMenu.OxMedium .OxItem .OxCell.OxSubmenu { width: 10px; } .OxMenu.OxSmall .OxItem .OxCell.OxStatus, .OxMenu.OxSmall .OxItem .OxCell.OxKey, .OxMenu.OxSmall .OxItem .OxCell.OxSubmenu { width: 8px; } .OxMenu .OxSpace { height: 4px; } .OxMenu .OxLine { height: 1px; } .OxMenu .OxScrollbar { text-align: center; cursor: default; display: none; } .OxMenu.OxLarge .OxScrollbar { height: 16px; padding-top: 4px; font-size: 10px; } .OxMenu.OxMedium .OxScrollbar { height: 13px; padding-top: 3px; font-size: 8px; } .OxMenu.OxSmall .OxScrollbar { height: 10px; padding-top: 2px; font-size: 6px; } /* ================================================================================ Panels ================================================================================ */ .OxCollapsePanel > .OxBar { position: relative; z-index: 1; } .OxCollapsePanel > .OxBar > .OxButton { float: left; margin: 0 0 0 0; } .OxCollapsePanel > .OxBar > .OxTitle { float: left; margin: 1px 0 0 0; font-weight: bold; } .OxCollapsePanel > .OxBar > .OxSelect { position: absolute; right: 0px; width: 14px; height: 16px; padding-top: 1px; border-width: 0 0 0 1px; background: rgba(0, 0, 0, 0); font-size: 11px; text-align: center; cursor: pointer; overflow: hidden; -moz-border-radius: 0; -webkit-border-radius: 0; } .OxCollapsePanel > .OxContent { position: relative; left: 0; right: 0; } .OxPanel { overflow: auto; } .OxSplitPanel { position: absolute; left: 0; top: 0; right: 0; bottom: 0; overflow: hidden; } .OxSplitPanel > div { position: absolute; } /* ================================================================================ Requests ================================================================================ */ .OxLoadingIcon { opacity: 0; -moz-user-select: none; -webkit-user-select: none; } .OxLoadingIcon.OxLarge { width: 20px; height: 20px; } .OxLoadingIcon.OxMedium { width: 16px; height: 16px; } .OxLoadingIcon.OxSmall { width: 12px; height: 12px; } /* ================================================================================ Scrollbars ================================================================================ */ ::-webkit-scrollbar { width: 12px; height: 12px; } ::-webkit-scrollbar-button { width: 12px; height: 12px; } ::-webkit-scrollbar-thumb { -webkit-border-radius: 6px; } ::-webkit-scrollbar-track { -webkit-border-radius: 6px; } /* ================================================================================ Video ================================================================================ */ .OxEditor { overflow-x: hidden; overflow-y: auto; } .OxEditor .OxVideoPlayer { position: absolute; margin: 4px; //background: red; } .OxTimelineLarge { position: absolute; height: 72px; margin: 0 4px 0 4px; overflow: hidden; } .OxTimelineLarge > div { position: absolute; height: 72px; } .OxTimelineLarge > div > img { position: absolute; top: 4px; } .OxTimelineLarge .OxCut { position: absolute; top: 66px; width: 2px; height: 4px; margin-left: -1px; z-index: 10; } .OxTimelineLarge .OxMarkerPointIn { position: absolute; top: 64px; width: 6px; height: 6px; margin-left: -5px; z-index: 10; } .OxTimelineLarge .OxMarkerPointOut { position: absolute; top: 64px; width: 6px; height: 6px; z-index: 10; } .OxTimelineLarge .OxMarkerPosition { position: absolute; top: 2px; width: 9px; height: 5px; z-index: 10; } .OxTimelineLarge .OxSubtitle { position: absolute; bottom: 9px; border: 1px solid rgba(255, 255, 255, 0.5); padding: 1px; background: rgba(0, 0, 0, 0.25); font-size: 8px; line-height: 10px; text-align: center; text-overflow: ellipsis; text-shadow: rgba(0, 0, 0, 1) 1px 1px 1px; color: rgb(255, 255, 255); cursor: default; overflow: hidden; z-index: 10; -moz-box-shadow: 0 0 2px rgba(0, 0, 0, 0.5); -webkit-box-shadow: 0 0 2px rgba(0, 0, 0, 0.5); } .OxTimelineLarge .OxSubtitle.OxHighlight { border-color: rgba(255, 255, 0, 1); } .OxTimelineSmall { position: absolute; } .OxTimelineSmall > div { position: absolute; height: 18px; margin: 3px 4px 3px 4px; overflow: hidden; } .OxTimelineSmall > div > img { position: absolute; left: 0; top: 0; } .OxTimelineSmall > div > .OxTimelineSmallImage { margin-top: 1px; } .OxTimelineSmall .OxMarkerPointIn { position: absolute; width: 6px; height: 6px; margin-left: -1px; } .OxTimelineSmall .OxMarkerPointOut { position: absolute; width: 6px; height: 6px; margin-left: 4px; } .OxVideoPlayer > .OxBar .OxInputGroup { //width: 98px; } .OxVideoPlayer > .OxBar .OxButton { margin-right: -1px; } .OxVideoPlayer > .OxBar .OxButton, .OxVideoPlayer > .OxBar .OxInput, .OxVideoPlayer > .OxBar .OxLabel { padding: 0; -moz-border-radius: 0; -webkit-border-radius: 0; } .OxVideoPlayer > .OxBar .OxLabel { //width: 22px; //background: rgb(32, 32, 32); } .OxVideoPlayer .OxLoadingIcon { position: absolute; left: 0; top: 0; right: 0; bottom: 16px; margin: auto; } .OxVideoPlayer .OxMarkerFrame { position: absolute; left: 0; top: 0; right: 0; bottom: 16px; } .OxVideoPlayer .OxMarkerFrame > div { float: left; } .OxVideoPlayer .OxMarkerFrame > .OxFrame { background: rgba(0, 0, 0, 0.5); } .OxVideoPlayer .OxMarkerFrame > .OxPoster { border: 1px solid rgba(255, 255, 255, 0.5); } .OxVideoPlayer .OxMarkerPoint { position: absolute; width: 16px; height: 16px; } .OxVideoPlayer .OxMarkerInTop { left: 4px; top: 4px; } .OxVideoPlayer .OxMarkerInBottom { left: 4px; bottom: 20px; } .OxVideoPlayer .OxMarkerOutTop { right: 4px; top: 4px; } .OxVideoPlayer .OxMarkerOutBottom { right: 4px; bottom: 20px; } .OxVideoPlayer .OxSubtitle { position: absolute; left: 0; right: 0; text-align: center; //text-shadow: rgba(0, 0, 0, 1) 2px 2px 0px; text-shadow: rgba(0, 0, 0, 1) 0 0 4px; color: rgb(255, 255, 255); z-index: 10; } /* ================================================================================ Miscellaneous ================================================================================ */ .OxText { //line-height: 15px; } .OxTooltip { position: absolute; padding: 1px 2px 1px 2px; font-size: 9px; opacity: 0; z-index: 10; -moz-border-radius: 4px; -webkit-border-radius: 4px; }