/**
 * @project     OTRS (http://www.otrs.org) - Agent Frontend
 * @author      Felix Niklas
 * @copyright   OTRS AG
 * @license     AGPL (http://www.gnu.org/licenses/agpl.txt)
 */

/**
 * @package     Skin "Ivory"
 * @section     Skin overrides
 */

@media screen,projection,tv,handheld {

/**
 * @subsection  Color
 * @note        standard colors #69BFCC is the main skin color and #265D66 its dark version
 */

a,
span.Pagination a:hover {
    color: #69BFCC;
}
.Admin .Size1of2 h4 {
    color: #69BFCC !important;
}

.AdminPerformanceLog .Progressbar {
    background-color: #69BFCC;
}

a:hover,
a:active {
    color: #265D66;
}

.Admin .Size1of2:hover h4 {
    color: #265D66 !important;
}

input[type=text]:focus,
input[type=password]:focus,
textarea:focus,
input.Focus,
textarea.Focus  {
    border-color: #69BFCC;
}

/**
 * @subsection Toolbar
 */

#ToolBar a .Gloss, #ToolBar a {
    background-image: url("../img/toolbar_sprite.png");
}

/**
 * @subsection  Navigation
 * @note        the default navigation_sprite is transparent and has a transparent reddish
 *              gradient overlay. This works with some colors so you only have to change the
 *              background color of the li items and the anchors on hover. In this case the
 *              red overlay doesn't fit, so changed the main sprite too.
 */

#Navigation > li,
#Navigation > li > a {
    background-image: url("../img/navigation_sprite.png");
}

#Navigation > .Selected,
#Navigation > .Selected > a {
    background-color: #69BFCC;
}

#Navigation > li:hover,
#Navigation > li:hover > a {
    background-color: #69BFCC;
}

#Navigation > .Active .Shadow > ul > li:hover {
    background-image: url("../img/navigation_hover.png");
}

/**
 * @subsection  Hover
 */

#UserInfo a.LogoutButton {
    background-image: url("../img/logout_sprite.png");
}

/**
 * @subsection  WidgetMenu and Tables
 */

.ControlRow li,
.ControlRow li:hover > a,
.ControlRow li.Active > a,
.ControlRow li:active > a {
    background-image: url("../img/controlrow_sprite.png");
}

.DataTable tbody tr:hover td,
.TableSmall tbody tr:hover td {
    background-image: url(../img/table_small_hover_bg.png);
    background: -moz-linear-gradient(center top, #C0F7FF, #93E9F6 20%, #78CEDB 51%, #63B9C6 51%, #54AAB7 95%, #489EAB);
    background: -webkit-gradient(linear, left top, left bottom, from(#C0F7FF), to(#489EAB), color-stop(20%, #93E9F6), color-stop(51%, #78CEDB), color-stop(51%, #63B9C6), color-stop(95%, #54AAB7));
}

.Actions li a:hover,
.Actions li span:hover,
.OverviewZoom a:hover {
    background-image: url("../img/action_hover.png");
    background: -moz-linear-gradient(center top, #C0F7FF, #93E9F6 20%, #78CEDB 51%, #63B9C6 51%, #54AAB7 95%, #489EAB);
    background: -webkit-gradient(linear, left top, left bottom, from(#C0F7FF), to(#489EAB), color-stop(20%, #93E9F6), color-stop(51%, #78CEDB), color-stop(51%, #63B9C6), color-stop(95%, #54AAB7));
    border-left-color: #78CEDB;
    border-right-color: #54AAB7;
}

/**
 * @subsection  Overview Large
 */

.OverviewLarge > li:hover > .Content,
.OverviewLarge > li:hover .Shadow {
    background-image: url("../img/table_large_hover.png");
}

.OverviewLarge > li:hover .Infos table label {
    color: #265D66;
}

.OverviewLarge li:hover .Infos table td,
.OverviewLarge li:hover .Infos table tr.Middle {
    border-color: #265D66;
}

.OverviewLarge > li:hover .Preview > ul {
    border-color: #5ADCF2 #5ADCF2 #5ADCF2 #7B7670;
}

/**
 * @subsection  Overview Medium
 */

.OverviewMedium li:hover div.Content {
    background-image: url("../img/table_medium_hover.png");
}

.OverviewMedium li:hover div.Shadow {
    background-image: url("../img/table_medium_hover_bottom.png");
}

.OverviewMedium li:hover table.Infos td label {
    color: #265D66;
}

/**
 * @subsection  Ticketzoom
 */

.TableSmall tbody td a.Attachment {
    background-image: url(../img/attachment_sprite.png);
}

/**
 * @subsection  Dialog
 */

.Dialog > .Header .Close {
    background-image: url("../img/dialog_close.png");
}

.Dialog.Alert span.Icon {
    background-image: url(../img/dialog_alert.png);
}

/**
 * @subsection  MessageBox
 * @note        here we only have to change the color of the "Notice" notifications
 *              the other two ones - Error (red) and Confirmation (green) - have their
 *              set signal colors we don't want to change.
 */

.MessageBox.Notice {
    border-color: #265D66;
    background: #69BFCC;
}

.MessageBox.Notice p {
    border-color: #75E4F5;
}

.MessageBox.Notice p,
.MessageBox.Notice a {
    color: #183C41;
}

} /* end @media */
