/**ADFFaces_Skin_File / DO NOT REMOVE**/ @namespace af "http://xmlns.oracle.com/adf/faces/rich"; @namespace dvt "http://xmlns.oracle.com/dss/adf/faces"; /*///////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////// Selectors for Skinning Fusion's ADF Faces Components : http://download.oracle.com/docs/cd/E15523_01/apirefs.1111/e15862/toc.htm URL'S DE INTERES: Selectors for Skinning ADF Faces Components: http://jdevadf.oracle.com/adf-richclient-demo/docs/skin-selectors.html ADF Faces Rich Client: http://jdevadf.oracle.com/adf-richclient-demo/faces/components/skinningKeys/index.jspx /////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////*/ /*///////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////// 1 GLOBAL SELECTORS Global Selectors are selectors that affect more than one component. If the selector name ends in the :alias pseudo-class, then the selector is most likely included in other component-specific selectors. Defining properties for a selector that ends in :alias will most likely affect the skin for more than one component. For example, most, if not all of our components use the .AFDefaultFontFamily:alias definition to specify the font-family. If your skin overrides the .AFDefaultFontFamily:alias selector with a different font-family, that change will affect all the components that have included it in their selector definition. /////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////*/ /*---TEXTOS Y FUENTES-----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------*/ /*Specifies the default font family list ("font-family" property) for the skin.*/ .AFDefaultFontFamily:alias { font-family: Verdana,Arial,Helvetica,sans-serif; } /*Specifies the default font for the skin. This style defines both the default font family (as specified by the AFDefaultFontFamily named style), the default font size, and default font weight.*/ .AFDefaultFont:alias{ font-size: 10px; } /*Specifies the color of the font for text.*/ .AFTextForeground:alias{ color:black; } /*--------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------*/ /*---BOTONES-----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------*/ /* Specifies the foreground for buttons. */ .AFButtonForeground:alias{ color:#666666; /*text-decoration:underline;*/ } /* .AFButtonForegroundHover:alias: Specifies the foreground for buttons in the hover state. .AFButtonForegroundActive:alias: -- .AFButtonForegroundFocus:alias: -- Cambio de estilo de los botones en Hover,Active y Focus*/ .AFButtonForegroundHover:alias, .AFButtonForegroundActive:alias, .AFButtonForegroundFocus:alias{ color:black; /*text-decoration:underline;*/ } /*Specifies the background for buttons that include this style alias, like af|commandButton, af|goButton, af|resetButton, af|trainButtonBar. Skinning the .AFButton* aliases is meant to be a short-cut for the skin developer and it can help ensure that all buttons are skinned the same since all button components include these aliases in the base skin. Please note that for buttons :active and :focus pseudo-classes do not work in IE7. IE7 also does not allow disabled buttons to be styled. */ .AFButtonBackground:alias{ background-image:none; background-color:#CCCCCC; padding:1px; } /*Specifies the background for buttons in the disabled state.*/ .AFButtonBackgroundDisabled:alias{ background-color:#EEEEEE; } /*Specifies the border for buttons that include this style alias, like af|commandButton, af|goButton, af|resetButton.*/ .AFButtonBorder:alias{ border-width:0px 1px 1px 0px; border-color:#666666; border-top:1px solid #CCCCCC; border-left:1px solid #CCCCCC; } .AFButtonBorderHover:alias, /* <- Specifies the border for buttons in the hover state.*/ .AFButtonBorderActive:alias, .AFButtonBorderFocus:alias{ border-width:1px 0px 0px 1px; border-color:#666666; border-top:1px solid #666666; border-left:1px solid #666666 ; border-bottom:1px solid #CCCCCC; border-right:1px solid #CCCCCC; color:#666666; } /*Specifies the border for buttons in the disabled state.*/ .AFButtonBorderDisabled:alias{ border-width:1px 1px 1px 1px; border-color:#CCCCCC; } /*Specifies the background for buttons in the hover state (mouse over).*/ .AFButtonBackgroundHover:alias{ background-image:none; background-color: #CCCCCC; } .af_commandButton.p_AFTextOnly, .af_goButton.p_AFTextOnly { background-color: #CCCCCC; padding: 1px; } .Usuario{ font-style:italic; font-family: Verdana,Arial,Helvetica,sans-serif; } .Rol{ font-style:italic; font-family: Verdana,Arial,Helvetica,sans-serif; } .nomAplic{ color: #54BEE6; font-size: 14px; font-weight: bold; margin-left: 80px; font-family: Verdana,Arial,Helvetica,sans-serif; } af|panelGroupLayout.barraTitulo{ background-color:#666666; height:2px; color: #666666; } /*--------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------*/ /*-----TABLA---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------*/ /*Specifies the borders of the table row header and column header cells. The border-right and border-left defined here must match the af|table's skin property -tr-border-left-width, -tr-border-right-width*/ .AFTableCellHeaderBorder:alias{ border:0pt; } /*Specifies the padding of the cell in a column/table. If you want to change the padding of a cell, do it with this alias instead of with selectors af|column::column-header-cell, af|column::column-footer-cell, af|column::row-header-cell, af|column::data-cell, and af|column::banded-data-cell. This way you only have to change it in one place. The padding-right and padding-left defined here must match the af|table's skin property -tr-padding-left-width, -tr-padding-right-width. Note that when the header has borders and there are no borders in the table data area, then .AFTableCellData:alias also needs padding set and it needs to compensate for the no borders to keep things lined up.*/ .AFTableCellPadding:alias{ padding-bottom:2pt; padding-top:2pt; } /*--------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------*/ /*Alias to change the properties on the panelBox header for the panelBox whose "ramp" is set to "core" and "color" is set to "default". Using this style class significantly simplifies the work required to style the header. Instead of changing three classes (for header-start, header, header-end) you only need to change this one. The region component uses this alias as well. */ .AFPanelBoxHeaderCoreDefault:alias{ color:#666666; } /*Alias to change the properties on the panelBox header for the panelBox whose "ramp" is set to "core" and "color" is set to "default". Using this style class significantly simplifies the work required to style the header. Instead of changing three classes (for header-start, header, header-end) you only need to change this one. The region component uses this alias as well. */ .AFPanelBoxHeaderCoreDefault:alias{ background-color:#EEEEEE; } /*------LINKS--------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------*/ /*The default foreground color for links.*/ .AFLinkForeground:alias{ color:#00729F; } /* .AFActiveLinkForeground:alias: The default foreground color for active links. By default, this value is computed relative to the .AFLinkForeground:alias color. .AFHoverLinkForeground:alias: The default foreground color for on hover links. */ .AFActiveLinkForeground:alias , .AFHoverLinkForeground:alias{ color:#EF6B00; } /* The foreground color for visited links. This value may be or may not be computed relative to the .AFLinkForeground:alias color.*/ .AFVisitedLinkForeground:alias{ color:#CCCCCC; } /*--------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------*/ /*------MENUS--------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------*/ /*Style class that applies to menu items. Valid menu items are either commandMenuItems, goMenuItems, or submenus (menus in menus).*/ .AFMenuItem:alias, .AFMenuItem:alias:hover{ color: #666666; text-decoration:underline; } .AFMenuItem:alias:disabled{ font-weight:italic; } /*--------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------*/ /*------OTROS--------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------*/ /* .AFLabel:alias: Aliased style class that is included in the label selector for all the form components. e.g. "af|inputText::label". Uses .AFDefaultFont:alias, .AFEndTextAlign:alias, .AFEndPadding:alias, .AFLabelTextForeground:alias, .AFLabelDisabled:alias: Aliased style class that is included in the label selector for all the form components when they are disabled. It is a quick way to style disabled form components' labels the same, instead of for each component: .AFLabelDisabled:alias instead of e.g. "af|inputText:disabled::label". */ .AFLabel:alias, .AFLabelDisabled:alias{ color: #666666; } /*Icono de error.*/ .AFErrorIcon:alias{ content: url('http://itemsweb.esade.edu/apps/img/cancel.png'); } /*styles the content of Note Window component */ .AFNoteWindowContent{ color:#666666; } /*The border around a form component to indicate an error.*/ .AFFormComponentOutlineError:alias{ border:2px solid orange; } /*--------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------*/ /*///////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////// 2 RENDERER SELECTORS Renderer-level selectors are selectors that can be used to skin a particular ADF Faces component. The selectors defined below are specified by the component they affect. Let's say you want to skin the af:inputText component. If you go to the af:inputText Component section of this document, you will see the selectors that you can use to skin the af:inputText component. One of the selectors is af|inputText::content. The ::content pseudo-element indicates that this is the content portion of the af:inputText component; the input. To skin this you would set CSS properties on the af|inputText::content selector in your ADF Faces skin .css file. /////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////*/ /*-----INPUT TEXT ------http://jdevadf.oracle.com/adf-richclient-demo/faces/components/skinningKeys/inputText.jspx---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------*/ af|inputText::content, af|inputDate::content{ background:none; border: 1px solid #CCCCCC; font-size: 11px; /*height: 11px;*/ padding: 2px; } /*--------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------*/ /*----LINKS----http://jdevadf.oracle.com/adf-richclient-demo/faces/components/skinningKeys/commandLink.jspx------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------*/ af|commandLink{ color:#00729F; } af|commandLink:visited { color:#CCCCCC; } af|commandLink:hover{ color:#EF6B00; } /*--------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------*/ /*-------BOTONES-------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------*/ /*Style on the root element of the af:commandButton component. Tip: If you skin this selector's background-image or color, you may also want to skin a different background-image or color for :hover, :active, :focus, :disabled, and :text-only. Please note that for buttons :active and :focus pseudo-classes do not work in IE7. IE7 also does not allow disabled buttons to be styled. It is recommended that you use the .AFButton*:alias selectors as a shortcut to skin all button components the same.*/ af|commandButton{ padding: 2px 6px 2px 6px; padding: 2px 6px 2px 6px; margin-right:3px; } /*--------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------*/ /*-------TABLA----http://jdevadf.oracle.com/adf-richclient-demo/faces/components/skinningKeys/table.jspx---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------*/ af|table{ margin-top:10px; border:1px grey solid; } af|table::data-row:hover af|column::data-cell af|menuBar, af|table::data-row:hover af|column::data-cell, af|table::data-row:hover af|column::banded-data-cell af|menuBar, af|table::data-row:hover af|column::banded-data-cell, af|table::data-row:hover af|column::data-cell af|commandMenuItem:disabled, af|table::data-row:hover af|column::banded-data-cell af|commandMenuItem:disabled{ /*background-color:#DEEEFD;*/ background-color:#E8F9C0; } af|table::data-row:selected:hover af|column::data-cell af|menuBar, af|table::data-row:selected:hover af|column::data-cell, af|table::data-row:selected:hover af|column::banded-data-cell af|menuBar, af|table::data-row:selected:hover af|column::banded-data-cell, af|table::data-row:selected:focused af|column::banded-data-cell af|menuBar af|table::data-row:selected:focused af|column::data-cell af|menuBar, af|table::data-row:selected:focused af|column::data-cell, af|table::data-row:selected:focused af|column::banded-data-cell, af|table::data-row:selected:inactive af|column::data-cell af|menuBar , af|table::data-row:selected:inactive af|column::data-cell, af|table::data-row:selected af|column::data-cell af|menuBar, af|table::data-row:selected af|column::data-cell , af|table::data-row:selected af|column::banded-data-cell , af|table::data-row:selected af|column::banded-data-cell af|menuBar { /* background-color:#AECC6B; color:white; font-weight:bold;*/ background-color:#CDEA8A !important; color: #666666!important!; font-weight:normal!important; } af|table::data-row:selected af|column::data-cell af|commandMenuItem, af|table::data-row:selected af|column::banded-data-cell af|commandMenuItem{ background-color:#AECC6B; border:1px solid #CCCCCC; } af|table::data-row:hover af|column::data-cell af|commandMenuItem::bar-item-text, af|table::data-row:hover af|column::banded-data-cell af|commandMenuItem::bar-item-text{ color:#666666; } af|table::data-row:selected af|column::data-cell af|commandMenuItem:hover, af|table::data-row:selected af|column::banded-data-cell af|commandMenuItem:hover{ background-color:#CCCCCC; border:1px solid #CCCCCC; } af|table::data-row:selected af|column::data-cell af|commandMenuItem::bar-item-text, af|table::data-row:selected af|column::banded-data-cell af|commandMenuItem::bar-item-text, af|table::data-row:selected af|column::data-cell af|commandMenuItem:hover::bar-item-text, af|table::data-row:selected af|column::banded-data-cell af|commandMenuItem:hover::bar-item-text{ color:#666666; } af|table::data-row af|column::data-cell af|commandMenuItem::bar-item-text, af|table::data-row af|column::banded-data-cell af|commandMenuItem::bar-item-text{ color:#666666; } af|table::data-row:selected af|column::data-cell af|commandMenuItem:disabled, af|table::data-row:selected af|column::banded-data-cell af|commandMenuItem:disabled{ background-color:#AECC6B; } af|table::data-row af|column::data-cell af|commandMenuItem:disabled::bar-item-text, af|table::data-row af|column::banded-data-cell af|commandMenuItem:disabled::bar-item-text, af|table::data-row:selected af|column::data-cell af|commandMenuItem:disabled::bar-item-text, af|table::data-row:selected af|column::banded-data-cell af|commandMenuItem:disabled::bar-item-text{ color:#CCCCCC; } af|table::data-row:selected:focused af|column::data-cell af|selectOneChoice:read-only::content, af|table::data-row:selected af|column::data-cell af|selectOneChoice:read-only::content, af|table::data-row:selected:inactive af|column::data-cell af|selectOneChoice:read-only::content{ color:white; font-weight:bold; } af|table::data-row af|column::banded-data-cell af|commandButton:disabled, af|table::data-row af|column::data-cell af|commandButton:disabled{ background-color#DDDDDD; } af|table::data-row af|column::banded-data-cell af|commandButton, af|table::data-row af|column::data-cell af|commandButton{ background-color:#CCCCCC; } af|table::data-row:selected:inactive af|column::banded-data-cell af|commandLink, af|table::data-row:selected af|column::banded-data-cell af|commandLink, af|table::data-row:selected:focused af|column::banded-data-cell af|commandLink, af|table::data-row:selected:inactive af|column::data-cell af|commandLink, af|table::data-row:selected af|column::data-cell af|commandLink, af|table::data-row:selected:focused af|column::data-cell af|commandLink{ font-weight:bold; } af |table::data-row af|column::data-cell af|menuBar, af|table::data-row af|column::banded-data-cell af|menuBar { background-color:#EEEEEE; } /*--------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------*/ /*------COLUMNA DE UNA TABLA------http://jdevadf.oracle.com/adf-richclient-demo/faces/components/skinningKeys/column.jspx--------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------*/ af|column::column-filter-cell af|inputText::content{ background-image:url('http://itemsweb.esade.edu/apps/img/funnel.png'); /* background-image:url('http://cdn1.iconfinder.com/data/icons/ledicons/funnel.png');*/ background-repeat:no-repeat; background-position:right; } af|column::column-header-cell:focused, af|column::column-header-cell { background-color: #54bee6; border-right:1px solid white; color: white; font-size:11px; font-weight:bold; text-align:center; } af|column::column-header-cell:focused { font-style:italic; } af|column::column-footer-cell{ border-top:1px solid #666666; border-bottom:1px solid #666666; border-right:none; background-color:white; text-align:right; } /*color de la letra de las columnas, ya sean las grises o las blancas*/ af|column::data-cell, af|column::banded-data-cell, af|column::data-cell af|selectOneChoice:read-only::content , af|column::banded-data-cell af|selectOneChoice:read-only::content{ color:#666666; } af|column::data-cell{ background-color:red; } /*color de la letra de las columnas, ya sean las grises o las blancas*/ af|column::data-cell{ background-color:white; } af|column::banded-data-cell{ background-color:#EEEEEE; } /*af|trainButtonBar::disabled{ display:none; }*/ @agent (touchScreen:none) { af|column::sort-ascending-icon-style:hover { background-image: url('http://itemsweb.esade.edu/apps/img/ordenacion4.png') !important; } af|column::sort-descending-icon-style:hover { background-image: url('http://itemsweb.esade.edu/apps/img/ordenacion3.png') !important; } af|column::sorted-ascending-icon-style:hover { background-image: url('http://itemsweb.esade.edu/apps/img/ordenacion6.png') !important; } af|column::sorted-descending-icon-style:hover { background-image: url('http://itemsweb.esade.edu/apps/img/ordenacion5.png') !important; } af|column::sort-ascending-icon-style:active { background-image: url('http://itemsweb.esade.edu/apps/img/ordenacion4.png') !important; } af|column::sort-descending-icon-style:active { background-image: url('http://itemsweb.esade.edu/apps/img/ordenacion3.png') !important; } } af|column::sorted-ascending-icon-style { background-image: url('http://itemsweb.esade.edu/apps/img/ordenacion6.png'); } af|column::sort-ascending-icon-style { background-image: url('http://itemsweb.esade.edu/apps/img/ordenacion4.png'); } af|column::sort-descending-icon-style { background-image: url('http://itemsweb.esade.edu/apps/img/ordenacion3.png'); } af|column::sorted-descending-icon-style { background-image: url('http://itemsweb.esade.edu/apps/img/ordenacion5.png'); } /*--------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------*/ /*--MENU BAR ------http://jdevadf.oracle.com/adf-richclient-demo/faces/components/skinningKeys/menuBar.jspx------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------*/ /*--------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------*/ /*----MENU------- http://jdevadf.oracle.com/adf-richclient-demo/faces/components/skinningKeys/menu.jspx ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------*/ af|menu:highlighted::bar-item-text{ color:black; } af|menu::submenu-icon-style, af|menu::submenu-access-key, af|menu::submenu-accelerator, af|menu::submenu-open-indicator, af|menu::submenu-text{ background-color:#EEEEEE; color:#666666; border:none; } af|menu:highlighted::submenu-icon-style, af|menu:highlighted::submenu-access-key, af|menu:highlighted::submenu-accelerator, af|menu:highlighted::submenu-open-indicator, af|menu:highlighted::submenu-text{ background-color:#CCCCCC; border:none; color:black; } af|menu::bar-item{ border:1px solid #CCCCCC; background-color:#EEEEEE; } af|menu::bar-item:hover{ background-color:#CCCCCC; border:1px solid #EEEEEE; } af|menu::bar-item:depressed{ background-color:#EEEEEE; border:1px solid #CCCCCC; } /* af|menu::bar-item:disabled{ background-color:#EEEEEE; border:1px solid #CCCCCC; color:green; }*/ /* af|menu::bar-item-text:disabled{ background-color:#EEEEEE; border:1px solid #CCCCCC; color:green; } */ af|menu::bar-item-text, af|menu::bar-item-text:hover{ color:#666666; } /* af|menu:disabled:bar-item-text{ color:red; } */ af|menu::child-container{ background-color:#EEEEEE; color:#666666; } .AFPopupMenuPopup{ border:1px solid #CCCCCC; } .AFPopupMenuContent{ background-color:#EEEEEE; border:1px solid #CCCCCC; } /*--------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------*/ /*-----COMMAND TOOLBAR BUTTON -------------http://jdevadf.oracle.com/adf-richclient-demo/faces/components/skinningKeys/commandToolbarButton.jspx--------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------*/ af|commandToolbarButton::text{ color:#666666; text-decoration:underline; } af|commandToolbarButton{ background-image:none; background-color:#EEEEEE; border:1px solid #CCCCCC; padding:2pt; /*para que el boton de tooolbar menu sea igual de ancho que el boton de menu*/ } af|commandToolbarButton:hover, af|commandToolbarButton:text-only:hover { background-image:none; background-color:#CCCCCC; border:1px solid #666666; } /*--------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------*/ /*-----PANEL BOX (CAJA QUE CONTIENE COMPONENTES)------http://jdevadf.oracle.com/adf-richclient-demo/faces/components/skinningKeys/panelBox.jspx---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------*/ af|panelBox{ margin-top:10px; margin-bottom:10px; } /* af|panelBox::content{ border-width:0px; } */ /*--------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------*/ /*-----TITULO ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------*/ .tituloPagina { font-size: 16px; color: #666666; font-weight: bold; font-family: Verdana,Arial,Helvetica,sans-serif; } /*--------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------*/ .descripcionPagina{ float: left; width: 100%; padding-bottom: 1px; padding-top: 1px; font-family: Verdana,Arial,Helvetica,sans-serif; font-size:11px; } /*---COMMAND MENU ITEM (ITEM DE MENU DESPLEGABLE)----http://jdevadf.oracle.com/adf-richclient-demo/faces/components/skinningKeys/commandMenuItem.jspx------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------*/ af|commandMenuItem:hover, af|commandMenuItem:text-only:hover { background-image:none; background-color:#CCCCCC; border:1px solid #666666; } af|goMenuItem:highlighted::menu-item-icon-style, af|goMenuItem:depressed::menu-item-icon-style, af|goMenuItem:hover::menu-item-icon-style, af|goMenuItem:highlighted::menu-item-text, af|goMenuItem:depressed::menu-item-text, af|goMenuItem:hover:menu-item-text, af|goMenuItem:highlighted::menu-item-open-indicator, af|goMenuItem:depressed::menu-item-open-indicator, af|goMenuItem:hover::menu-item-open-indicator, af|goMenuItem:highlighted::menu-item-accelerator, af|goMenuItem:depressed::menu-item-accelerator, af|goMenuItem:hover::menu-item-accelerator, af|commandMenuItem:highlighted::menu-item-icon-style, af|commandMenuItem:depressed::menu-item-icon-style, af|commandMenuItem:hover::menu-item-icon-style, af|commandMenuItem:highlighted::menu-item-text, af|commandMenuItem:depressed::menu-item-text, af|commandMenuItem:hover:menu-item-text, af|commandMenuItem:highlighted::menu-item-open-indicator, af|commandMenuItem:depressed::menu-item-open-indicator, af|commandMenuItem:hover::menu-item-open-indicator, af|commandMenuItem:highlighted::menu-item-accelerator, af|commandMenuItem:depressed::menu-item-accelerator, af|commandMenuItem:hover::menu-item-accelerator { background-color:#CCCCCC; border:0px; color:black; } af|goMenuItem:hover:disabled::menu-item-text, af|goMenuItem:hover:disabled::menu-item-accelerator, af|goMenuItem:hover:disabled::menu-item-open-indicator, af|goMenuItem:hover:disabled::menu-item-icon-style, af|commandMenuItem:hover:disabled::menu-item-text, af|commandMenuItem:hover:disabled::menu-item-accelerator, af|commandMenuItem:hover:disabled::menu-item-open-indicator, af|commandMenuItem:hover:disabled::menu-item-icon-style{ background-color:#EEEEEE; } af|goMenuItem::menu-item-text, af|goMenuItem::menu-item-icon-style, af|goMenuItem::menu-item-open-indicator, af|goMenuItem::menu-item-accelerator, af|commandMenuItem::menu-item-text, af|commandMenuItem::menu-item-icon-style, af|commandMenuItem::menu-item-open-indicator, af|commandMenuItem::menu-item-accelerator{ background-color:#EEEEEE; border:0px; } /*--------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------*/ /*-----TRAIN (PASOS VISITADOS)-----http://jdevadf.oracle.com/adf-richclient-demo/faces/components/skinningKeys/train.jspx----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------*/ af|train::join{ height : 2px; } af|train::stop-link:train-visited{ /*texto del train que ya se ha visitado*/ color:#54bee6; } af|train::join:train-visited{ background-color:#54bee6; } af|train::stop-link:unvisited, af|train::stop-link:disabled{ color:#CCCCCC; } af|train::join:disabled{ background-color:#CCCCCC; } af|train::join:unvisited{ background-color:#54bee6; } af|train::stop-link:selected{ color:#54bee6; } af|train::stop-icon-selected, af|train::stop-icon-selected:hover, af|train::stop-icon-selected:active, af|train::stop-icon-disabled, af|train::stop-icon-disabled:hover, af|train::stop-icon-disabled:active, af|train::stop-icon-unvisited, af|train::stop-icon-unvisited:hover, af|train::stop-icon-unvisited:active, af|train::stop-icon-visited, af|train::stop-icon-visited:hover, af|train::stop-icon-visited:active { -tr-inhibit: background-image; } af|train::disabled-stop-icon { content: url('http://itemsweb.esade.edu/apps/img/train_pendiente.png'); } af|train::selected-stop-icon { content: url('http://itemsweb.esade.edu/apps/img/train_actual.png'); } af|train::unvisited-stop-icon { content: url('http://itemsweb.esade.edu/apps/img/train_pendiente.png'); } af|train::visited-stop-icon { content: url('http://itemsweb.esade.edu/apps/img/train_realizado.png'); } af|train::stop-icon-selected, af|train::stop-icon-disabled, af|train::stop-icon-unvisited, af|train::stop-icon-visited{ background-image: url('http://itemsweb.esade.edu/apps/img/train_hover.png'); } af|train::selected-stop-icon :hover{ background-image:none; content:none; content: url('http://itemsweb.esade.edu/apps/img/train_hover.png'); } af|train::stop-icon-selected :hover{ background-image:none; content:none; content: url('http://itemsweb.esade.edu/apps/img/train_hover.png'); } af|train::selected-stop-icon :hover{ background-image:none; background-image: url('http://itemsweb.esade.edu/apps/img/train_hover.png'); } af|train::stop-icon-selected :hover{ background-image:none; background-image: url('http://itemsweb.esade.edu/apps/img/train_hover.png'); } /*--------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------*/ /*----TRAIN BUTTON BAR (TRAIN DE BUTTONS) ---http://jdevadf.oracle.com/adf-richclient-demo/faces/components/skinningKeys/trainButtonBar.jspx-------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------*/ @agent ie { af|trainButtonBar::back-button:active:disabled, af|trainButtonBar::back-button:disabled, af|trainButtonBar::back-button, af|trainButtonBar::back-button:hover, af|trainButtonBar::back-button:hover:disabled { background-image: url('http://itemsweb.esade.edu/apps/img/volver.png'); background-repeat: no-repeat; background-position:left; background-position:6px; text-align:right; height:20px; width:72px; margin-right: 3px; padding: 2px 6px; padding-left:24px; } af|trainButtonBar::next-button:hover:disabled, af|trainButtonBar::next-button:hover, af|trainButtonBar::next-button:disabled, af|trainButtonBar::next-button:active:disabled, af|trainButtonBar::next-button { background-image: url('http://itemsweb.esade.edu/apps/img/siguiente.png'); background-repeat: no-repeat; background-position:left; background-position:6px; text-align:right; height:20px; width:85px; margin-right: 3px; padding: 2px 6px; } } @agent mozilla,webkit { af|trainButtonBar::back-button:active:disabled, af|trainButtonBar::back-button:disabled, af|trainButtonBar::back-button, af|trainButtonBar::back-button:hover, af|trainButtonBar::back-button:hover:disabled { background-image: url('http://itemsweb.esade.edu/apps/img/volver.png'); background-repeat: no-repeat; background-position:left; background-position:6px; text-align:right; height:24px; width:72px; margin-right: 3px; padding: 2px 6px; padding-left:24px; } af|trainButtonBar::next-button:hover:disabled, af|trainButtonBar::next-button:hover, af|trainButtonBar::next-button:disabled, af|trainButtonBar::next-button:active:disabled, af|trainButtonBar::next-button { background-image: url('http://itemsweb.esade.edu/apps/img/siguiente.png'); background-repeat: no-repeat; background-position:left; background-position:6px; text-align:right; height:24px; width:85px; margin-right: 3px; padding: 2px 6px; } } /*--------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------*/ /*----DIALOG----http://jdevadf.oracle.com/adf-richclient-demo/faces/components/skinningKeys/dialog.jspx------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------*/ af|dialog::header, af|dialog::header-start, af|dialog::header-end { background: url("http://itemsweb.esade.edu/apps/img2.0/fons-menu_popup2.gif") repeat-x scroll 50% 50% transparent; } af|dialog::footer, af|dialog::footer-start, af|dialog::footer-end { background: url("http://itemsweb.esade.edu/apps/img2.0/fons_bottom.png") repeat-x scroll 50% 50% transparent; } .DialogGAG:alias { -tr-inhibit: background-color; -tr-inhibit: background-image; background-image:none; padding:2px 6px 2px 6px; } af|dialog::footer-button,af|dialog::footer-button:hover,af|dialog::footer-button:focus,af|dialog::footer-button:active:hover, af|dialog::footer-button:active,af|dialog::footer-button:active:disabled,af|dialog::footer-button:disabled,af|dialog::footer-button:focus:hover, af|dialog::footer-button:rtl,af|dialog::footer-button:text-only,af|dialog::footer-button:text-only:rtl{ margin-top: 1px; margin-bottom: 1px; background-color:#CCCCCC; background-image: url('http://itemsweb.esade.edu/apps/img/aceptar.png'); background-position:left; background-position:6px; background-repeat: no-repeat; text-align:right; padding:2px 20px 2px 20px; } af|dialog::footer-content{ padding: 1px 20px 1px 20px; text-align: center; } .GAGDialog af|dialog::footer-button { -tr-rule-ref: selector(".DialogGAG:alias"); } af|dialog::close-icon-style{ -tr-inhibit:background-image; } af|dialog::close-icon{ content: url('http://itemsweb.esade.edu/apps/img_gag/cerrar.png'); margin-top:-2px; } af|dialog::resize-icon-style{ content: url('http://itemsweb.esade.edu/apps/img_gag/resize2.png'); } af|dialog::content{ padding:20px 30px 20px 30px; } /*--------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------*/ /*------PANEL TABBED -----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------*/ af|panelTabbed{ -tr-tab-bar-height: 25px; } af|panelTabbed::header { /*border: 1px solid green;*/ /*border-bottom: 10px solid red;*/ } af|panelTabbed::footer, af|panelTabbed::header { background-image:none; /*background-color: #FFFFFF;*/ padding-bottom: 10px; } af|panelTabbed::header-center{ background-image:url('http://itemsweb.esade.edu/apps/img/header.png'); } /* af|panelTabbed::footer-center{ tr-inhibit:all; background-image:url('http://itemsweb.esade.edu/apps/img/header.png'); } */ af|panelTabbed::header af|panelTabbed::tab-start { width: 10px; /*background-image:url('http://itemsweb.esade.edu/apps/img_gag/resize2.png');*/ } af|panelTabbed::header af|panelTabbed::tab-end { width: 10px; /*background-image:url('http://itemsweb.esade.edu/apps/img_gag/resize2.png');*/ } af|panelTabbed::header af|panelTabbed::tab:selected af|panelTabbed::tab-start{ background-image: url('http://itemsweb.esade.edu/apps/img/selected_left.png'); } af|panelTabbed::header af|panelTabbed::tab:selected af|panelTabbed::tab-end{ background-image: url('http://itemsweb.esade.edu/apps/img/selected_right.png'); } af|panelTabbed::header af|panelTabbed::tab af|panelTabbed::tab-start{ background-image: url('http://itemsweb.esade.edu/apps/img/unselected_left-border.png'); } af|panelTabbed::header af|panelTabbed::tab af|panelTabbed::tab-end{ background-image: url('http://itemsweb.esade.edu/apps/img/unselected_right-border.png'); } af|panelTabbed::header af|panelTabbed::tab af|panelTabbed::tab-content{ background-image: url('http://itemsweb.esade.edu/apps/img/unselected-center.png'); } af|panelTabbed::header af|panelTabbed::tab:selected af|panelTabbed::tab-content{ background-image: url('http://itemsweb.esade.edu/apps/img/selected-center.png'); } af|panelTabbed::tab-text-link:hover, af|panelTabbed::tab-text-link { color: white !important; font-weight:bold; } af|panelTabbed::tab-text-link:hover { font-weight:bold; } af|panelTabbed::tab-text-link:selected, af|panelTabbed::tab-text-link:selected:hover { text-decoration:none; color:rgb(102,102,102) !important; } /*--------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------*/ af|inputDate::launch-icon-style { background-image: url('http://itemsweb.esade.edu/apps/img/calendar.png'); } af|inputDate::launch-icon-style:active { background-image: url('http://itemsweb.esade.edu/apps/img/calendar.png'); } af|inputDate::launch-icon-style:disabled { background-image: url('http://itemsweb.esade.edu/apps/img/calendar.png'); } af|inputDate::launch-icon-style:disabled:active { background-image: url('http://itemsweb.esade.edu/apps/img/calendar.png'); } @agent (touchScreen:none) { af|inputDate::launch-icon-style:disabled:hover { background-image: url('http://itemsweb.esade.edu/apps/img/calendar.png'); } af|inputDate::launch-icon-style:hover { background-image: url('http://itemsweb.esade.edu/apps/img/calendar.png'); } } af|document::splash-screen-content{ background-color:transparent; } af|document::splash-screen{ background-color:transparent; } af|document::splash-screen-content{ -tr-inhibit:background-image; -tr-inhibit:background-repeat; border:transparent; background-color:transparent; } af|document::splash-screen-message{ /*display:table-row;*/ text-align: center; color:Black; /*background-image:url(http://itemsweb.esade.edu/apps/img_gag/animated_time.gif);*/ } af|document::splash-screen-cell{ background-color:transparent; } af|document::splash-screen-icon{ content:url(http://itemsweb.esade.edu/apps/img_gag/animated_time.gif); } /*---BOTONES GENÉRICOS CUSTOMIZADOS-----------------------------------------------------------------------------------------------------------------*/ /* Utilizar estas clases para los botones Aceptar, cancelar siguiente, y actualizar. Cualquier boton que sea de este tipo y sea utilizado en mas aplicaciones, deberá ir aquí. */ af|commandButton:text-only.Refresh{ -tr-inhibit: background-color; background-image: url('http://itemsweb.esade.edu/apps/img/refresh.png'); background-repeat: no-repeat; } .Aceptar{ -tr-inhibit: background-image !important; background-image: url('http://itemsweb.esade.edu/apps/img/aceptar.png') !important; background-repeat: no-repeat !important; margin-top: 1px !important; margin-bottom: 1px !important; background-color:#CCCCCC !important; background-position:left !important; background-position:3px !important; text-align:right !important; padding:2px 20px 2px 20px !important; } .Cancelar{ -tr-inhibit: background-image !important; background-image: url('http://itemsweb.esade.edu/apps/img/cancelar.png') !important; background-repeat: no-repeat !important; margin-top: 1px !important; margin-bottom: 1px !important; background-color:#CCCCCC !important; background-position:left !important; background-position:3px !important; text-align:right !important; padding:2px 20px 2px 20px !important; } .Siguiente{ -tr-inhibit: background-image !important; background-image: url('http://itemsweb.esade.edu/apps/img/siguiente.png') !important; background-repeat: no-repeat !important; margin-top: 1px !important; margin-bottom: 1px !important; background-color:#CCCCCC !important; background-position:left !important; background-position:3px !important; text-align:right !important; padding:2px 20px 2px 20px !important; } /*-------------------------------------------------------------*/ .emptyText{ color:#666666; padding-left:290px; padding-top:200px; } .tituloPantalla{ font-size: 16px; color: #666666; font-weight: bold; font-family: Verdana,Arial,Helvetica,sans-serif; } /* COMPONENTES STANDARD ADF ESADE */ /* componente Multi idioma */ .component_textAreaMultiIidoma { width:530px; } .component_textAreaMultiIidoma af|panelBox::header-center { -tr-inhibit:background-color; background-color: transparent !important; } .component_textAreaMultiIidoma af|panelBox::header-start { -tr-inhibit:background-color; background-color: transparent !important; } .component_textAreaMultiIidoma af|panelBox::header-end { -tr-inhibit:background-color; background-color: transparent !important; } .component_textAreaMultiIidoma af|panelBox::content { border-width:0.0px !important; } .component_textAreaMultiIidoma_noHeader { width:530px; } .component_textAreaMultiIidoma_noHeader af|panelBox::header-center { -tr-inhibit:background-color; border-width:0.0px !important; background-color: transparent !important; } .component_textAreaMultiIidoma_noHeader af|panelBox::header-start { -tr-inhibit:background-color; border-width:0.0px !important; background-color: transparent !important; } .component_textAreaMultiIidoma_noHeader af|panelBox::header-end { -tr-inhibit:background-color; border-width:0.0px !important; background-color: transparent !important; } /* fin componente Multi idioma */ /* componente Foto Persona */ .component_fotoPersona { width:80px; height: 110px; } /* fin componente Foto persona */ /* componente input buscador */ .component_inputBuscador { margin-bottom: 0px; } .component_inputBuscador af|inputText::content{ background-image: url("http://itemsweb.esade.edu/maquetes/fb/images/33a3a346-0053-4077-87b3-84930a8f99db.png"); background-repeat: no-repeat; background-position:right; margin-bottom: 0px; padding-left: 0px; padding-right: 0px; } .component_inputBuscador af|inputText::label { display: none; } .component_inputBuscador af|inputText:disabled::content { background-image: url("http://itemsweb.esade.edu/maquetes/fb/images/33a3a346-0053-4077-87b3-84930a8f99db.png"); background-repeat: no-repeat; background-position:right; } .component_inputBuscador af|inputText:disabled::content { background-image: url("http://itemsweb.esade.edu/maquetes/fb/images/33a3a346-0053-4077-87b3-84930a8f99db.png"); background-repeat: no-repeat; background-position:right; } .component_inputBuscador af|selectOneListbox { border-style: none; border-color:transparent; border-width: 0px; } .component_inputBuscador af|selectOneListbox::content { border-style: none; border-color:transparent; border-width: 0px; } .component_inputBuscador af|table { background-color: transparent; border: none; border-style: none; border-color:transparent; border-width: 0px; font-size: 0px; } .component_inputBuscador af|table::data-body { background-color: transparent; border: none; border-style: none; border-color:transparent; border-width: 0px; font-size: 0px; } .component_inputBuscador af|column::column-header { background-color: transparent; border: none; border-style: none; border-color:transparent; border-width: 0px; font-size: 0px; height: 0px; } .component_inputBuscador af|column::column-header-table { background-color: transparent; border: none; border-style: none; border-color:transparent; border-width: 0px; font-size: 0px; height: 0px; } .component_inputBuscador af|column::column-header-cell-content { background-color: transparent; border: none; border-style: none; border-color:transparent; border-width: 0px; font-size: 0px; height: 0px; } .component_inputBuscador af|column::column-header-cell { background-color: transparent; border: none; border-style: none; border-color:transparent; border-width: 0px; font-size: 0px; height: 0px; } /* fin componente input buscador */ /* componente Elementos Seleccionados */ .component_elementosSelecionados { border-width:thin; border-color: Gray; border: thin; border-style: solid; margin-top: 0px; padding-top: 0px; } .component_elementosSelecionados af|group { } .component_elementosSelecionadosH { border-width:thin; border-color: Gray; border: thin; border-style: solid; margin-top: 0px; padding-top: 0px; } .component_elementosSelecionados af|column::column-header-table { background-color: transparent; border: none; border-style: none; border-color:transparent; border-width: 0px; font-size: 0px; } .component_elementosSelecionados af|column::column-header-cell-content { background-color: transparent; border: none; border-style: none; border-color:transparent; border-width: 0px; font-size: 0px; } .component_elementosSelecionados af|column::column-header-cell { background-color: transparent; border: none; border-style: none; border-color:transparent; border-width: 0px; font-size: 0px; } .component_elementosSelecionadosH af|column::column-header-table { background-color: transparent; border: none; border-style: none; border-color:transparent; border-width: 0px; font-size: 0px; } .component_elementosSelecionadosH af|column::column-header-cell-content { background-color: transparent; border: none; border-style: none; border-color:transparent; border-width: 0px; font-size: 0px; } .component_elementosSelecionadosH af|column::column-header-cell { background-color: transparent; border: none; border-style: none; border-color:transparent; border-width: 0px; font-size: 0px; } af|commandButton.component_elementosEliminar,af|commandButton:text-only.component_elementosEliminar, af|commandButton:disabled.component_elementosEliminar,af|commandButton:active:disabled.component_elementosEliminar, af|commandButton:active.component_elementosEliminar,af|commandButton:focus.component_elementosEliminar, af|commandButton:busy.component_elementosEliminar,af|commandButton:focus:hover.component_elementosEliminar { background-image: url("http://itemsweb.esade.edu/maquetes/fb/images/0783b0cc-cfb5-4ea2-a58f-7827632ae51a.png") !important; border-color:transparent; background-color: transparent !important; background-repeat: no-repeat; background-position:center; width:12px !important; height: 12px !important; border:none; cursor: pointer; } af|commandButton.component_elementosBajar,af|commandButton:text-only.component_elementosBajar, af|commandButton:disabled.component_elementosBajar,af|commandButton:active:disabled.component_elementosBajar, af|commandButton:active.component_elementosBajar,af|commandButton:focus.component_elementosBajar, af|commandButton:busy.component_elementosBajar,af|commandButton:focus:hover.component_elementosBajar { background-image: url("http://itemsweb.esade.edu/maquetes/fb/images/adf04093-5112-462e-b6d5-1b7ccb312025.png") !important; border-color:transparent; background-color: transparent !important; background-repeat: no-repeat; background-position:center; width:12px !important; height: 12px !important; border:none; cursor: pointer; } af|commandButton.component_elementosSubir,af|commandButton:text-only.component_elementosSubir, af|commandButton:disabled.component_elementosSubir,af|commandButton:active:disabled.component_elementosSubir, af|commandButton:active.component_elementosSubir,af|commandButton:focus.component_elementosSubir, af|commandButton:busy.component_elementosSubir,af|commandButton:focus:hover.component_elementosSubir { background-image: url("http://itemsweb.esade.edu/maquetes/fb/images/0a33d326-596b-43c2-830c-4eff906ef2ea.png") !important; border-color:transparent; background-color: transparent !important; background-repeat: no-repeat; background-position:center; width:12px !important; height: 12px !important; border:none; cursor: pointer; } .component_elementosSelecionadosH af|table::data-row { float: left; } .component_elementosSelecionadosH af|table::data-table { width:100% !important; height:100% !important; } /* fin componente elementos seleccionados */ /* componente Subida ficheros */ .component_subidaFicheros { border-width:thin; border-color: Gray; border: thin; border-style: solid; } .component_subidaFicheros af|table { border: none; border-style: none; border-color:transparent; border-width: 0px; margin-top: 0px; } .component_subidaFicheros af|column::column-header-table { background-color: transparent; border: none; border-style: none; border-color:transparent; border-width: 0px; font-size: 0px; } .component_subidaFicheros af|column::column-header-cell-content { background-color: transparent; border: none; border-style: none; border-color:transparent; border-width: 0px; font-size: 0px; } .component_subidaFicheros af|column::column-header-cell { background-color: transparent; border: none; border-style: none; border-color:transparent; border-width: 0px; font-size: 0px; } .component_subidaFicheros af|inputFile { position: relative; background-image: url("http://itemsweb.esade.edu/apps/img/add.png") !important; border-color:transparent; background-color: transparent !important; background-repeat: no-repeat; background-position:left; border:none; cursor: pointer; } .component_subidaFicheros af|inputFile::content { position: relative; text-align: right; -moz-opacity:0 ; filter:alpha(opacity: 0); opacity: 0; z-index: 2; cursor: pointer; } .component_subidaFicheros af|inputFile::label { padding-left: 20px; } .component_subidaFicheros af|inputFile:disabled::label { padding-left: 20px; } .component_subidaFicheros af|inputFile:required::label { padding-left: 20px; } af|commandButton.component_subidaFichEliminar,af|commandButton:text-only.component_subidaFichEliminar, af|commandButton:disabled.component_subidaFichEliminar,af|commandButton:active:disabled.component_subidaFichEliminar, af|commandButton:active.component_subidaFichEliminar,af|commandButton:focus.component_subidaFichEliminar, af|commandButton:busy.component_subidaFichEliminar,af|commandButton:focus:hover.component_subidaFichEliminar { background-image: url("http://itemsweb.esade.edu/maquetes/fb/images/0783b0cc-cfb5-4ea2-a58f-7827632ae51a.png") !important; border-color:transparent; background-color: transparent !important; background-repeat: no-repeat; background-position:center; width:12px !important; height: 12px !important; border:none; cursor: pointer; } /* fin componente Subida ficheros */ /* FIN COMPONENTES STANDARD ADF */ /* AF|chooseDate STYLE */ af|chooseDate::month-year-row { -tr-rule-ref: selector('.AFChooseDateLargeFont:alias'); padding:1px; } af|chooseDate::week-header-row { -tr-rule-ref: selector('.AFChooseDateLargeFont:alias'); background-color: #54bee6; } af|chooseDate::week-header-cell { color:white; font-weight: bold; } af|chooseDate::days-row { -tr-rule-ref: selector('.AFChooseDateLargeFont:alias'); font-weight: bold; } af|chooseDate::today { color:#54bee6; text-decoration:underline; border:0px; } af|chooseDate::regular-day{ color:#666666; } af|chooseDate::regular-day:hover { background-color: #E8F9C0; color:#666666; } af|chooseDate::regular-day:selected:hover, af|chooseDate::regular-day:selected, af|chooseDate::today:selected{ background-color: #AECC6B; color:white; } af|chooseDate::regular-day:selected:disabled { background-color:grey; font-style:italic } .AFChooseDateLargeFont:alias{ font-size: 8pt; font-family: Verdana, sans-serif; } /* COMPONENTE QUERY (BUSQUEDAS AVANZADAS) */ af|query { border: 1px solid #CCCCCC; margin-top:15px; } af|query::title-end1 {background-color:#EEEEEE;border-bottom:1px solid #CCCCCC;} af|query::title-start1 {background-color:#EEEEEE;border-bottom:1px solid #CCCCCC;} input[id^='qry'][id*='content']{ max-width:400px; } af|query::title1 { border-left:0px; border-right:0px; border-bottom:1px solid #CCCCCC; color:#666666; background-color:#EEEEEE; background-image:none; padding:0px; } af|query::title-text1{ color:#666666; font-weight:normal; font:Verdana, Arial, Helvetica, sans-serif; } button[id^='qry'][id$='search']{ background-image: url('http://itemsweb.esade.edu/apps/img/zoom.png') !important; } button[id^='qry'][id$='reset']{ background-image: url('http://itemsweb.esade.edu/apps/img/refresh.png') !important; } button[id^='qry'][id$='save']{ background-image: url('http://itemsweb.esade.edu/apps/img/disk.png') !important; } button[id^='qry'][id$='save'], button[id^='qry'][id$='search'], button[id^='qry'][id$='reset']{ height:23px; padding-left:20px; padding-right:5px; background-repeat: no-repeat !important; background-position:2px; } button[id$='cancel']{ background-image:url('http://itemsweb.esade.edu/apps/img/cancel.png') !important; }