egroupware/pixelegg/css/monochrome.css

/**
 * EGroupware: Stylite Pixelegg template
 *
 * Please do NOT change css-files directly, instead change less-files and compile them!
 *
 * @link http://www.egroupware.org
 * @license http://opensource.org/licenses/gpl-license.php GPL - GNU General Public License
 * @author Stefan Reinhard <stefan.reinhard@pixelegg.de>
 * @package pixelegg
 * @version $Id$
 */
/**
 * addapted from orginal styles.php
 */
/**
 * All app_* files are now again in $app/templates/default/app.less&css and will be included independent
 *
 * If some settings are Pixelegg template specific, please create $app/templates/pixelegg.less&css
 * files AND include ../default/app.less from there
*/
/**
 * not sure about these files, in general it is not a good idea to replace
 * files from other projects, was we need to update them regulary.
 * Would be a lot better to include their css files and only overwrite
 * neccesarry settings
 */
/**
 * Styles for etemplate2 widgets
 * Überschreibt egroupware/etemplate/templates/default/etemplate2.css
 *
 * @version: 1
 * Stefan Reinhardt
 */
/*@import (less) "../../api/templates/default/etemplate2.css";*/
@media all {
  /**
 * Top level
 */
  .et2_container {
    padding: 0px;
    background-color: transparent;
  }
  .et2_container > div:not([class]) {
    height: 100%;
  }
  /**
 * Basic rules
 */
  input,
  button,
  select {
    margin: 1px;
    /*-webkit-appearance: none;*/
  }
  /**
 * img gray filter
 */
  img.et2_appicon,
  .et2_appicon img,
  table.egwGridView_grid img.et2_appicon {
    /*filter grey*/
    filter: url("data:image/svg+xml;utf8,<svg xmlns=\'http://www.w3.org/2000/svg\'><filter id=\'grayscale\'><feColorMatrix type=\'matrix\' values=\'0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0 0 0 1 0\'/></filter></svg>#grayscale");
    -webkit-filter: grayscale(100%) brightness(100%) contrast(1%) saturate(0%);
    -moz-filter: grayscale(100%) brightness(100%) contrast(1%) saturate(0%);
    -ms-filter: grayscale(100%) brightness(100%) contrast(1%) saturate(0%);
    -o-filter: grayscale(100%) brightness(100%) contrast(1%) saturate(0%);
    filter: grayscale(100%) brightness(100%) contrast(1%) saturate(0%);
    /*filter: url(grayscale.svg);  Firefox 4+ */
    filter: gray;
    /* IE 6-9 */
  }
  /**
 * VBox widget
 */
  div.et2_vbox > * {
    display: block;
  }
  /**
 * HBox widget
 */
  div.et2_hbox_right {
    background: transparent;
  }
  /**
 * Placeholder widget - used for un-implemented widgets
 */
  .et2_placeholder {
    display: inline-block;
    /*border: 1px solid cornflowerblue;*/
    border: 1px solid rgba(0, 0, 0, 0.15);
    background-color: #E6E6E6;
  }
  .et2_placeholder .et2_attr {
    color: #000000;
  }
  /**
 * Label widget, and labels for other widgets
 */
  .et2_label {
    color: #1E1E1E;
    white-space: pre-wrap;
  }
  /**
 * img Icons
 */
  a.et2_url {
    background-position: center;
    background-repeat: no-repeat;
    background-size: 14px 14px;
    cursor: pointer;
    margin: -4px;
    padding: 2px;
    padding-left: 16px;
    margin-left: -10px;
  }
  a.et2_url.email {
    background-image: url(../images/email.png);
  }
  a.et2_url.phone {
    background-image: url(../images/phone.svg);
  }
  a.et2_url.url {
    background-image: url(../images/url.png);
  }
  /**
 * Button widget - text only, and icon
 */
  .et2_button {
    text-shadow: 0px 0px !important;
    /*.border_normal;*/
    /*.box_shadow_standard_light;*/
    /*.rounded (3px);*/
    color: #000000;
    -webkit-appearance: none;
    -webkit-transition-property: background-color;
    -moz-transition-property: background-color;
    -o-transition-property: background-color;
    transition-property: background-color;
    -webkit-transition-duration: 0.5s;
    -moz-transition-duration: 0.5s;
    -o-transition-duration: 0.5s;
    transition-duration: 0.5s;
    -webkit-transition-timing-function: linear;
    -moz-transition-timing-function: linear;
    -o-transition-timing-function: linear;
    transition-timing-function: linear;
    background-color: #E6E6E6;
  }
  .et2_button_icon {
    height: 16px;
    background-color: transparent;
  }
  /* give the image a button lock and feel*/
  img.et2_button_icon[src*="svg"] {
    background-color: #b4b4b4;
    background-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIHZpZXdCb3g9IjAgMCAxIDEiIHByZXNlcnZlQXNwZWN0UmF0aW89Im5vbmUiPjxsaW5lYXJHcmFkaWVudCBpZD0iZzc0MyIgZ3JhZGllbnRVbml0cz0idXNlclNwYWNlT25Vc2UiIHgxPSIwJSIgeTE9IjAlIiB4Mj0iMCUiIHkyPSIxMDAlIj48c3RvcCBzdG9wLWNvbG9yPSIjQjRCNEI0IiBvZmZzZXQ9IjAiLz48c3RvcCBzdG9wLWNvbG9yPSIjQjRCNEI0IiBvZmZzZXQ9IjEiLz48L2xpbmVhckdyYWRpZW50PjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxIiBoZWlnaHQ9IjEiIGZpbGw9InVybCgjZzc0MykiLz48L3N2Zz4=);
    background-image: -moz-linear-gradient(top, #B4B4B4, #B4B4B4);
    background-image: -ms-linear-gradient(top, #B4B4B4, #B4B4B4);
    background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#B4B4B4), to(#B4B4B4));
    background-image: -webkit-linear-gradient(top, #B4B4B4, #B4B4B4);
    background-image: -o-linear-gradient(top, #B4B4B4, #B4B4B4);
    background-image: linear-gradient(top, #B4B4B4, #B4B4B4);
    background-repeat: repeat-x;
  }
  img.et2_button_icon[src*="svg"]:hover {
    background-color: #b3e4a6;
    background-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIHZpZXdCb3g9IjAgMCAxIDEiIHByZXNlcnZlQXNwZWN0UmF0aW89Im5vbmUiPjxsaW5lYXJHcmFkaWVudCBpZD0iZzc0MyIgZ3JhZGllbnRVbml0cz0idXNlclNwYWNlT25Vc2UiIHgxPSIwJSIgeTE9IjAlIiB4Mj0iMCUiIHkyPSIxMDAlIj48c3RvcCBzdG9wLWNvbG9yPSIjYjNlNGE2IiBvZmZzZXQ9IjAiLz48c3RvcCBzdG9wLWNvbG9yPSIjYjNlNGE2IiBvZmZzZXQ9IjEiLz48L2xpbmVhckdyYWRpZW50PjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxIiBoZWlnaHQ9IjEiIGZpbGw9InVybCgjZzc0MykiLz48L3N2Zz4=);
    background-image: -moz-linear-gradient(top, #b3e4a6, #b3e4a6);
    background-image: -ms-linear-gradient(top, #b3e4a6, #b3e4a6);
    background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#b3e4a6), to(#b3e4a6));
    background-image: -webkit-linear-gradient(top, #b3e4a6, #b3e4a6);
    background-image: -o-linear-gradient(top, #b3e4a6, #b3e4a6);
    background-image: linear-gradient(top, #b3e4a6, #b3e4a6);
    background-repeat: repeat-x;
    -webkit-box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.6);
    -moz-box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.6);
    box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.6);
  }
  img.et2_button_icon[src*="svg"]:active {
    -webkit-box-shadow: inset 1px 2px 1px rgba(0, 0, 0, 0.5);
    -moz-box-shadow: inset 1px 2px 1px rgba(0, 0, 0, 0.5);
    box-shadow: inset 1px 2px 1px rgba(0, 0, 0, 0.5);
  }
  /*look in layout_content_elements*/
  .et2_selectbox .ui-multiselect-checkboxes li:hover {
    background-color: rgba(102, 153, 204, 0.7) !important;
  }
  .et2_selectbox .ui-multiselect-checkboxes label {
    display: block;
    border: 0px solid transparent;
    padding: 0.1em 0.2em;
  }
  .et2_selectbox .ui-multiselect-checkboxes div.ui-icon-close {
    /*visibility: hidden;*/
    background-image: url(../images/close.svg);
    margin: -2px -3px;
    padding: 0px;
  }
  /**
 * Date / Time widgets
 */
  span.et2_date input.et2_date {
    min-width: 21.5ex;
  }
  span.et2_date span {
    color: #FFFFFF;
  }
  .ui-datepicker .ui-datepicker-buttonpane button[data-handler="today"] {
    background-image: url(../images/bullet.svg);
    background-color: transparent;
    background-size: contain;
    border: none;
  }
  .ui-datepicker .ui-datepicker-prev:hover,
  .ui-datepicker .ui-datepicker-next:hover {
    border: none;
    background-color: transparent;
  }
  .ui-datepicker .ui-datepicker-prev span {
    background-image: url(../images/previous.svg) !important;
    background-position: 0px 0px !important;
    background-size: contain;
  }
  .ui-datepicker .ui-datepicker-next span {
    background-image: url(../images/next.svg) !important;
    background-position: 0px 0px !important;
    background-size: contain;
  }
  .ui-datepicker .ui-datepicker-next span:hover {
    border: none;
    background-color: transparent;
  }
  .et2_file .progress li:hover div.remove {
    width: 16px;
    height: 16px;
    background-image: url("../images/delete.svg");
  }
  .et2_file .progress p {
    background-color: #FFDD73;
  }
  span.et2_file_span {
    background-image: url(../images/attach.png);
  }
  span.et2_file_span img[url*="svg"] {
    background-color: #b4b4b4 !important;
    background-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIHZpZXdCb3g9IjAgMCAxIDEiIHByZXNlcnZlQXNwZWN0UmF0aW89Im5vbmUiPjxsaW5lYXJHcmFkaWVudCBpZD0iZzc0MyIgZ3JhZGllbnRVbml0cz0idXNlclNwYWNlT25Vc2UiIHgxPSIwJSIgeTE9IjAlIiB4Mj0iMCUiIHkyPSIxMDAlIj48c3RvcCBzdG9wLWNvbG9yPSIjQjRCNEI0IiBvZmZzZXQ9IjAiLz48c3RvcCBzdG9wLWNvbG9yPSIjQjRCNEI0IiBvZmZzZXQ9IjEiLz48L2xpbmVhckdyYWRpZW50PjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxIiBoZWlnaHQ9IjEiIGZpbGw9InVybCgjZzc0MykiLz48L3N2Zz4=) !important;
    background-image: -moz-linear-gradient(top, #B4B4B4, #B4B4B4) !important;
    background-image: -ms-linear-gradient(top, #B4B4B4, #B4B4B4) !important;
    background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#B4B4B4), to(#B4B4B4)) !important;
    background-image: -webkit-linear-gradient(top, #B4B4B4, #B4B4B4) !important;
    background-image: -o-linear-gradient(top, #B4B4B4, #B4B4B4) !important;
    background-image: linear-gradient(top, #B4B4B4, #B4B4B4) !important;
    background-repeat: repeat-x !important;
    fill: red !important;
  }
  span.et2_file_span:hover {
    color: #000000 !important;
    -webkit-box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.6) !important;
    -moz-box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.6) !important;
    box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.6) !important;
  }
  div.et2_file input.et2_file_upload {
    background-color: #FFFFFF !important;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border-radius: 3px;
  }
  div.et2_file input.et2_file_upload:hover {
    /*.background_color_20_gray;*/
    -webkit-box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.6);
    -moz-box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.6);
    box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.6);
    border: 1px solid rgba(0, 0, 0, 0.5);
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border-radius: 3px;
    background-color: #b3e4a6 !important;
  }
  /* Gantt widget */
  .et2_gantt .gantt_task_line {
    background-color: #679FD2;
  }
  .et2_gantt .gantt_task_line .gantt_task_content {
    color: #043A6B;
  }
  .et2_gantt .gantt_task_line .gantt_selected {
    background-color: rgba(255, 194, 0, 0.01);
  }
  .et2_gantt .gantt_task_line .gantt_task_progress {
    color: #043A6B;
    background-color: #FFDD73;
    /* outline progress in a complementary color */
    border: 1px solid #BF9D30;
    border-right: none;
    margin: -1px;
  }
  .et2_gantt .gantt_task_line.gantt_milestone {
    background-color: #ffc200;
    border-color: #BF9D30;
  }
  .et2_gantt .gantt_task_link .gantt_line_wrapper div {
    background-color: green;
  }
  .et2_gantt .gantt_task_link .gantt_link_arrow_left {
    border-right-color: green;
  }
  .et2_gantt .gantt_task_link .gantt_link_arrow_right {
    border-left-color: green;
  }
  .et2_gantt .gantt_task_link:hover .gantt_line_wrapper div {
    box-shadow: 0 0 5px 0 green;
  }
  .et2_gantt .gantt_task_link.invalid_constraint .gantt_line_wrapper div {
    background-color: #AE1D00;
  }
  .et2_gantt .gantt_task_link.invalid_constraint .gantt_link_arrow_left {
    border-right-color: #AE1D00;
  }
  .et2_gantt .gantt_task_link.invalid_constraint .gantt_link_arrow_right {
    border-left-color: #AE1D00;
  }
  .et2_gantt .gantt_task_link.invalid_constraint:hover .gantt_line_wrapper div {
    box-shadow: 0 0 5px 0 #AE1D00;
  }
  /*
        Link to / Selector Widget
*/
  .et2_link_to.et2_toolbar {
    margin-top: 2px !important;
  }
  .et2_link_to .et2_link_entry select,
  .et2_link_to .et2_link_entry input,
  .et2_link_to .et2_link_entry button {
    padding: 0;
    padding-left: 4px;
  }
  .et2_link_to .et2_link_entry .ui-icon-close {
    background-color: transparent;
    left: 0px;
  }
  .et2_link_to .et2_link_entry .ui-icon-triangle-1-s {
    background: #ffffff url(../images/selectarrowdown.png) no-repeat center right;
  }
  .et2_link_to .et2_file span {
    background-position: center;
    background-size: 16px 16px;
    background-repeat: no-repeat;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border-radius: 3px;
  }
  .et2_link_entry .ui-icon-triangle-1-s {
    background: #ffffff url(../images/selectarrowdown.png) no-repeat center right;
    background-size: contain;
  }
  .et2_link {
    color: #0C5DA5;
  }
  .et2_link_list tr {
    cursor: pointer;
  }
  .et2_link_list tr:hover {
    background-color: rgba(153, 204, 255, 0.4);
  }
  .et2_link_list tr:active {
    background-color: rgba(255, 194, 0, 0.01);
  }
  .et2_link_list .icon img,
  .et2_link_list .icon {
    width: 14px !important;
    height: 14px !important;
  }
  .et2_link_list td div.delete {
    visibility: hidden;
    background-image: url("../images/delete.svg");
    background-position: center;
    background-repeat: no-repeat;
    background-size: 12px 12px;
    padding: 0px;
  }
  .et2_link_list td div.delete {
    visibility: hidden;
    background-image: url("../images/delete.svg");
    background-position: center;
    background-repeat: no-repeat;
    background-size: 12px 12px;
    padding: 0px;
  }
  .egw_tooltip {
    background-color: #ffffff;
  }
  /**
 * Tabs widget
 */
  /*.et2_tabflag {
    margin: 1em 3px -1px 0;
    padding: 4px;
    .background_color_25_gray;
    .inner_shadow(1px, 0px, 0px, 0.5);
    -webkit-box-shadow: 1px 0px 0px rgba(0, 0, 0, 0.5);
    -moz-box-shadow:  1px 0px 0px rgba(0, 0, 0, 0.5);
    box-shadow: 1px 0px 0px rgba(0, 0, 0, 0.5);
    -webkit-user-select: none;
    -moz-user-select: none;
    user-select: none;
    min-width: 73px;
   &:hover {
        .color_5_gray;
        .background_color_25_gray;
    }
    &:active{
        .background_color_0_gray;
        .color_0_gray;
    }
}


.et2_tabflag.active {
    border-spacing: 0px;
    background-color: white;
    .color_100_gray;
    border-width: 1px 1px 0px 1px;
    border-style: solid;
    border-color: @gray_70;
    &:hover {
        .color_100_gray;
        //			border: 1px solid gray;
        background-color: white;
    }
}

.et2_tabs {
    border-width: 0px 1px 1px 1px;
    border-style: solid;
    border-color: @gray_70;
    padding: 5px;
    overflow-y: auto;
    background-color: @gray_0;
    .border_radius_button_normal;
}*/
  /*.et2_tabheader {
    padding-left: 0em;
    border-bottom: 1px solid #bfbfbf;
    margin: 0 2px;
	background-image: none;
    :first-child {
        margin-left: 1px;
    }
}*/
  /**
* Validation
*/
  .et2_required,
  [required] {
    background-color: #FFDD73;
    -webkit-border-top-right-radius: 3px;
    -webkit-border-bottom-right-radius: 3px;
    -webkit-border-bottom-left-radius: 3px;
    -webkit-border-top-left-radius: 3px;
    -moz-border-radius-topright: 3px;
    -moz-border-radius-bottomright: 3px;
    -moz-border-radius-bottomleft: 3px;
    -moz-border-radius-topleft: 3px;
    border-top-right-radius: 3px;
    border-bottom-right-radius: 3px;
    border-bottom-left-radius: 3px;
    border-top-left-radius: 3px;
    /*.background-clip(padding-box);*/
  }
  /**
 * hrule widget
 */
  hr {
    border-top: 1px solid #E6E6E6;
  }
  /**
 * grid widget
 */
  .et2_grid th,
  .et2_grid tr,
  .et2_grid td {
    /*	border: 1px dashed silver;*/
  }
  .et2_grid th .gray,
  .et2_grid tr .gray,
  .et2_grid td .gray {
    padding: 0px;
    height: 24px;
    /*background-color: @color_hint;*/
    /*.background-color-5-gray;*/
    background: -moz-linear-gradient(top, rgba(240, 240, 240, 0) 0%, rgba(191, 191, 191, 0.65) 100%);
    /* FF3.6+ */
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, rgba(240, 240, 240, 0)), color-stop(100%, rgba(191, 191, 191, 0.65)));
    /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(top, rgba(240, 240, 240, 0) 0%, rgba(191, 191, 191, 0.65) 100%);
    /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(top, rgba(240, 240, 240, 0) 0%, rgba(191, 191, 191, 0.65) 100%);
    /* Opera 11.10+ */
    background: -ms-linear-gradient(top, rgba(240, 240, 240, 0) 0%, rgba(191, 191, 191, 0.65) 100%);
    /* IE10+ */
    background: linear-gradient(to bottom, rgba(240, 240, 240, 0) 0%, rgba(191, 191, 191, 0.65) 100%);
    /* W3C */
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#00f0f0f0', endColorstr='#a6bfbfbf', GradientType=0);
    /* IE6-9 */
  }
  .et2_grid th .gray span.et2_label,
  .et2_grid tr .gray span.et2_label,
  .et2_grid td .gray span.et2_label {
    background-color: transparent;
    padding-left: 3px;
  }
  /* ##################################################################################
 * Nextmatch widget
 *
 * SEARCH FIELD | SEARCH BUTTON ###### FILTER ##### EXPORT IMG ### FAVORITES ### COUNT
 *
 * ##################################################################################*/
  div.header_row_right div[id$=favorite_wrapper] {
    margin-top: 0px;
  }
  .et2_nextmatch {
    background-color: transparent;
  }
  .et2_nextmatch .egwGridView_outer thead tr > th:first-child {
    border-left: 6px solid #B4B4B4;
  }
  .et2_nextmatch .nextmatch_header {
    padding: 0;
    border: none;
    background-image: none;
    background-color: transparent;
  }
  .et2_nextmatch > img {
    width: 16px;
    height: 16px;
  }
  /*################################################################
*
* Filters
*
################################################################*/
  .nextmatch_header_row .et2_label select {
    margin-left: 3px;
    border-color: #CDCDCD;
  }
  .nextmatch_header_row > .filters {
    /*width: 83%;*/
    z-index: 7;
    margin-bottom: 4px;
    top: 0px;
    padding: 0 5px 0 0;
    /*background-color: @gray_30;*/
    background: transparent;
    border: none !important;
    /*border-color: @gray_100;*/
    background-image: none !important;
    min-height: 37px;
    margin-left: 224px;
    margin-right: 119px;
    /*    .border_radius (3px, 3px, 0px, 0px);*/
  }
  .nextmatch_header_row > .filters select {
    margin-top: 10px;
  }
  .nextmatch_header_row > .filters .et2_label {
    padding: 0.2em;
  }
  .nextmatch_header_row > .filters .et2_label select {
    /*.Complete_Button_select;*/
    margin-left: 2px;
    margin-right: 1px;
    margin-top: 8px;
    width: 20%;
    max-width: 20% !important;
    /*Dialog - Addressbook - View */
  }
  .nextmatch_header_row > .filters .et2_label select:hover {
    -webkit-box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.6);
    -moz-box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.6);
    box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.6);
  }
  .nextmatch_header_row > .filters .et2_label select #infolog-index_cat_id,
  .nextmatch_header_row > .filters .et2_label select #infolog-index_filter {
    width: 50% !important;
  }
  .nextmatch_header > .filters > select > option {
    font-size: 11px;
  }
  .nextmatch_header > .filters input {
    margin-right: 2ex;
    width: 15%;
    border: 1px solid rgba(0, 0, 0, 0.15);
    border-color: #B4B4B4;
    -webkit-box-shadow: 0px 1px 0px rgba(0, 0, 0, 0.5);
    -moz-box-shadow: 0px 1px 0px rgba(0, 0, 0, 0.5);
    box-shadow: 0px 1px 0px rgba(0, 0, 0, 0.5);
    width: auto;
    /*margin: 0.5em 0em 0.5em 0;*/
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border-radius: 3px;
  }
  .nextmatch_header > .filters input:hover {
    -webkit-box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.6);
    -moz-box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.6);
    box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.6);
  }
  .nextmatch_header > .filters input:focus {
    outline: 0;
    border-width: 1px;
    border-style: solid;
    border-color: #B4B4B4;
    -webkit-box-shadow: 0 0 2px 1px rgba(0, 0, 0, 0.1);
    -moz-box-shadow: 0 0 2px 1px rgba(0, 0, 0, 0.1);
    box-shadow: 0 0 2px 1px rgba(0, 0, 0, 0.1);
  }
  /*################################################################
*
* Export Button
*
################################################################*/
  .nextmatch_header > .filters .et2_button_icon {
    margin-top: 8px;
    vertical-align: middle;
    /*.background_color_10_gray;*/
    -webkit-box-shadow: 0px 1px 0px rgba(0, 0, 0, 0.5);
    -moz-box-shadow: 0px 1px 0px rgba(0, 0, 0, 0.5);
    box-shadow: 0px 1px 0px rgba(0, 0, 0, 0.5);
    border: 1px solid rgba(0, 0, 0, 0.15);
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border-radius: 3px;
    box-shadow: none;
    margin-right: 1em;
    width: 16px;
    height: 16px;
    padding: 2px;
  }
  .nextmatch_header > .filters .et2_button_icon:hover {
    /*.background_color_20_gray;*/
    -webkit-box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.6);
    -moz-box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.6);
    box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.6);
    border: 1px solid rgba(0, 0, 0, 0.5);
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border-radius: 3px;
  }
  .nextmatch_header > .filters .et2_button_icon:active {
    /*.background_color_30_gray;*/
    border: 1px solid rgba(0, 0, 0, 0.9);
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border-radius: 3px;
    -webkit-box-shadow: inset 1px 2px 1px rgba(0, 0, 0, 0.5);
    -moz-box-shadow: inset 1px 2px 1px rgba(0, 0, 0, 0.5);
    box-shadow: inset 1px 2px 1px rgba(0, 0, 0, 0.5);
    background-color: #b3e4a6;
  }
  /*################################################################
*
* Kategorien
*
################################################################*/
  /*div#admin-categories-index{

    padding: 0px;

    // save space above nextmatch
    // set height to zero
    div.ui-helper-clearfix { height: 0px;}
}*/
  /*################################################################
*
* Favorites
*
################################################################*/
  .nextmatch_header div[id$=favorite_wrapper] {
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border-radius: 3px;
    /*.background_color_25_gray;*/
    z-index: 200;
  }
  /**
    * Drop down button
    */
  .et2_dropdown {
    position: relative;
    /*top: -5px;*/
    /*left Button*/
    /*right Button*/
    /* hover */
  }
  .et2_dropdown button {
    height: 24px;
    display: inline-block;
    vertical-align: middle;
    margin-right: -2px;
    padding: 0px 1ex;
    background-color: #FFFFFF;
    background-image: none;
  }
  .et2_dropdown button img {
    width: 12px;
    height: 12px;
  }
  .et2_dropdown button > div {
    vertical-align: middle;
  }
  .et2_dropdown button:last-child {
    padding: 0px;
  }
  .et2_dropdown + ul.ui-menu {
    position: absolute;
    z-index: 2;
  }
  .et2_dropdown button.ui-corner-left,
  .et2_dropdown button.ui-state-default {
    background-image: none !important;
    background-repeat: no-repeat !important;
    /*&:hover {.Complete_Button_save_apply_copy;}*/
  }
  .et2_dropdown button.ui-corner-left img,
  .et2_dropdown button.ui-state-default img {
    width: 16px;
    height: 16px;
    text-align: left;
    position: relative;
    right: 1px;
    top: 1px;
  }
  .et2_dropdown button.ui-corner-left:active,
  .et2_dropdown button.ui-state-default:active {
    background-color: #b3e4a6;
  }
  .et2_dropdown button.ui-state-hover {
    background-color: #E6E6E6;
  }
  .sidebox-favorites ul.favorites {
    width: 99%;
    padding: 0px;
    border: none;
    background: white;
  }
  .sidebox-favorites ul.favorites li.ui-menu-item {
    margin-left: 0px;
    min-height: 16px;
    padding: 3px 0px;
    margin-bottom: 0.2em;
  }
  .sidebox-favorites ul.favorites li.ui-menu-item a {
    color: #000000;
  }
  .sidebox-favorites ul.favorites li.ui-menu-item:hover {
    color: #000000;
    background-color: rgba(153, 204, 255, 0.4);
    padding: 3px 0;
  }
  .sidebox-favorites ul.favorites li.ui-menu-item:hover a {
    text-decoration: none;
    color: #000000;
  }
  .sidebox-favorites ul.favorites li.ui-menu-item:hover a .ui-icon-trash {
    background-image: url(../images/delete.svg);
    background-size: 12px 12px;
    background-position: center 4px;
  }
  .sidebox-favorites ul.favorites li.ui-menu-item:first-of-type a {
    color: #000000;
  }
  .sidebox-favorites ul.favorites li.ui-menu-item:last-of-type a {
    color: #000000;
  }
  .sidebox-favorites ul.favorites li.ui-menu-item a {
    line-height: inherit;
    padding: 2px 0px;
  }
  .sidebox-favorites ul.favorites li.ui-menu-item a div.ui-icon-heart {
    background-image: url(../images/favorites.svg);
    background-size: 12px 12px;
    background-position: 0 0;
    margin-right: 9px;
    margin-left: 2px;
  }
  .sidebox-favorites ul.favorites li.ui-menu-item a div.sideboxstar {
    width: 4px;
    height: 12px;
    margin-left: 5px;
    margin-right: 10px;
    background-image: url(../images/fav_filter.svg);
    background-size: 12px 12px;
    background-position: 0 0;
    background-repeat: no-repeat;
  }
  .sidebox-favorites ul.favorites li.ui-menu-item img {
    width: 12px;
    height: 12px;
    margin-left: 5px;
    margin-right: 10px;
    margin-top: -3px;
  }
  .sidebox-favorites ul.favorites li.ui-menu-item [data-id="blank"] div.ui-icon-heart {
    background-image: url(../images/delete.svg);
    background-size: 12px 12px;
    background-position: 0 0;
  }
  .sidebox-favorites ul.favorites li.ui-menu-item.ui-state-highlight {
    color: #000000;
    background: rgba(102, 153, 204, 0.7);
    padding: 3px 0;
    border: none;
  }
  .sidebox-favorites ul.favorites li:first-child a div.ui-icon-heart {
    background-image: url(../images/delete.svg);
    background-size: 12px 12px;
    background-position: 0 0;
  }
  .sidebox-favorites ul.favorites li:first-child a div.sideboxstar {
    background-image: url(../images/delete.svg);
    background-size: 12px 12px;
    background-position: 0 0;
  }
  .favorites img {
    width: 12px;
    height: 12px;
  }
  .nextmatch_sortheader {
    /*    background-position: right center;
    background-repeat: no-repeat;
    color: #003075;
    cursor: pointer;
    margin-right: 10px;*/
    padding-right: 18px;
  }
  .nextmatch_sortheader.asc {
    font-weight: bold;
    background-image: url(../images/selectarrowup.png);
    background-size: 16px 16px;
  }
  .nextmatch_sortheader.desc {
    font-weight: bold;
    background-image: url(../images/selectarrowdown.png);
    background-size: 16px 16px;
  }
  /**
 * Grid / nextmatch Hierarchy
 */
  /**
 * This class' margin-right is used to line up columns at each indent level
 * Classes level_# are created programmatically with margin-right * depth
 * Margin-right = -(indent + border)
 */
  .indentation {
    margin-right: -15px;
  }
  /* End of hierarchy */
  /* Mangled link-to widget inside a nextmatch - used for DnD uploads */
  .et2_nextmatch * .et2_link_to {
    position: relative;
  }
  div.et2_progress > div {
    background-color: #FFDD73;
    /*height: 5px;*/
  }
  /**
* et2_toolbar
*/
  .ui-toolbar_dropShadow {
    min-height: 30px;
    border: dashed;
    border-width: 1px;
    border-color: gray;
    opacity: 0.7;
  }
  /**
 * et2_textbox
 */
  textarea.et2_textbox {
    border: 1px solid #E6E6E6;
  }
  textarea,
  textarea.description {
    background-color: #fafafa;
    padding: 0.3em 0 0 0.3em;
    border: none;
    height: auto;
  }
  /**
* et2_taglist
*/
  .et2_taglist_toggle > div.toggle {
    background-image: url("../images/minus.svg");
    background-size: 50%;
  }
  .et2_taglist_toggle.et2_taglist_single.expanded > div.toggle {
    background-image: url("../images/plus.svg");
    background-size: 50%;
  }
  .et2_taglist.et2_taglist_category {
    max-height: 30px !important;
  }
  /**
* et2_toolbar
*/
  .et2_toolbar {
    background: none;
    margin: 0 !important;
    padding: 0 !important;
  }
  .et2_toolbar-dropdown button {
    /*        height: 100% !important;
                    border: none !important;
                    background: #E0E0E0 !important;
                    background-color: #E0E0E0 !important;
                    border-radius: 0 !important;
                    color: #101010 !important;
                    font-size: 9pt !important;
                    font-weight: normal !important;
                    vertical-align: bottom !important;
                    padding: 1px !important;
                    margin: 2px !important;
                    min-height: 19px;*/
  }
  div.ui-toolbar-menulist {
    position: absolute;
    height: inherit;
    z-index: 999 !important;
    overflow: hidden !important;
    border: solid black 1px;
    padding: 0 !important;
    margin-top: 3px !important;
  }
  .ui-toolbar-menulist > h {
    padding-bottom: 7px;
  }
  .ui-toolbar-menulistHeader {
    font-size: xx-small;
    height: 100%;
    margin-top: 2px;
    direction: ltr;
  }
  .et2_toolbar_more {
    float: right;
    direction: rtl;
    margin-top: 2px;
  }
  .et2_toolbar_actionlist {
    float: left;
  }
  .splitter-bar .ui-icon.ui-icon-grip-solid-vertical {
    background-image: url(../images/splitter_vert.png);
    background-position: center;
    background-repeat: no-repeat;
  }
  .splitter-bar .ui-icon.ui-icon-grip-solid-horizontal {
    background-image: url(../images/splitter_horz.png);
    background-position: center;
    background-repeat: no-repeat;
  }
  .splitter-bar.ui-state-hover {
    background: none;
  }
  /**
 * Do not wrap content of a single widget incl. a label or children of a hbox.
 * Taking into eg. select-account widget rendered as ul and prefixed with a label
 * and maintaining some space between widgets.
 */
  .et2_nowrap {
    white-space: nowrap;
  }
  ul.et2_nowrap,
  div.et2_nowrap {
    display: inline-block;
  }
  .et2_nowrap > * {
    padding-left: 5px;
  }
  .et2_nowrap > *:first-child {
    padding-left: 0;
  }
  .et2_nowrap > label > * {
    padding-left: 5px;
  }
  .et2_vfsPath input.et2_textbox.et2_vfs {
    background-image: url(../images/edit.svg);
  }
  /*#################################### ET2 SEARCHBOX #####################################################*/
  .et2_searchbox button.et2_button {
    background-image: url(../images/search.svg);
    background-size: 20px 20px;
    background-position: center;
  }
  /*#################################### ET2 SLIDESWITCH #####################################################*/
  span.et2_checkbox_slideSwitch:hover {
    box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.6);
    border: 1px solid gray;
    cursor: pointer;
  }
  span.et2_checkbox_slideSwitch > span.slideSwitch_container {
    background-color: #fafafa;
  }
  /*#################################### ADMIN PART #####################################################*/
  iframe#admin-index_iframe {
    background-color: yellow;
  }
  table.egwGridView_grid img {
    /*filter grey*/
    /*filter grey*/
    filter: none;
    -webkit-filter: initial;
    -moz-filter: initial;
    -ms-filter: initial;
    -o-filter: initial;
    /*filter: url(grayscale.svg);  Firefox 4+ */
    filter: initial;
    /* IE 6-9 */
  }
  .admin_aclAPP {
    /*filter grey*/
    filter: none;
    -webkit-filter: initial;
    -moz-filter: initial;
    -ms-filter: initial;
    -o-filter: initial;
    /*filter: url(grayscale.svg);  Firefox 4+ */
    filter: initial;
    /* IE 6-9 */
  }
  /*#################################### END ADMIN PART #####################################################*/
}
/*#################################### Media Queries #####################################################*/
@media only screen and (min-width: 980px) and (max-width: 1279px) {
  .nextmatch_header > .filters select {
    margin: 0px;
  }
}
/*
	Printing
*/
@media screen {
  .onlyPrint {
    display: none !important;
  }
}
@media print {
  .noPrint {
    display: none !important;
  }
}
/**
 * EGroupware: Stylite Pixelegg template
 *
 * et2 Messages
 *
 * Please do NOT change css-files directly, instead change less-files and compile them!
 *
 * @link http://www.egroupware.org
 * @license http://opensource.org/licenses/gpl-license.php GPL - GNU General Public License
 * @author Stefan Reinhard <stefan.reinhard@pixelegg.de>
 * @package pixelegg
 * @version $Id$
 */
#uical_select_resource {
  background-color: rgba(153, 204, 255, 0.4);
}
.uiaccountselection .primary_group {
  background-color: rgba(153, 204, 255, 0.4);
}
option:checked {
  background-color: rgba(153, 204, 255, 0.4);
}
.ui-tooltip {
  padding: 8px;
  position: absolute;
  z-index: 9999;
  max-width: 300px;
  -webkit-box-shadow: 0 0 5px #aaa;
  -moz-box-shadow: 0 0 5px #aaa;
  box-shadow: 0 0 5px #aaa;
}
/* Component containers
----------------------------------*/
.ui-widget {
  font-family: Verdana, "Lucida Grande", Helvetica, Sans-Serif;
  font-size: 1.1em;
}
.ui-widget .ui-widget {
  font-size: 1em;
}
.ui-widget input,
.ui-widget select,
.ui-widget textarea,
.ui-widget button {
  font-family: Verdana, "Lucida Grande", Helvetica, Sans-Serif;
  font-size: 11px;
}
.ui-widget-content {
  /*.bordered (@color-hint,@color-hint,@color-hint,@color-hint);*/
  background-image: none;
  color: #808080 !important;
  background: white;
}
.ui-widget-content a {
  color: #999999;
}
.ui-widget-header {
  border-top: solid 1px 0px !important;
  border-left: solid 1px 0px !important;
  border-right: solid 1px 0px !important;
  border-bottom: solid 1px 0px !important;
  /*.gradient_thead !important;*/
  background-color: #0C5DA5;
  /*border-color: @gray_10;*/
  color: #000000;
  font-weight: bold;
  background-image: none;
  border: 0px !important;
}
.ui-widget-header a {
  color: #ffffff;
}
/* Interaction states
----------------------------------*/
.ui-state-default,
.ui-widget-content .ui-state-default,
.ui-widget-header .ui-state-default {
  border-top: solid 1px 1px;
  border-left: solid 1px 1px;
  border-right: solid 1px 1px;
  border-bottom: solid 1px 1px;
  border-color: #B4B4B4;
  background: transparent;
  font-weight: normal;
  color: #1a1a1a;
}
.ui-state-default a,
.ui-state-default a:link,
.ui-state-default a:visited {
  color: #999999;
  text-decoration: none;
}
.ui-state-focus,
.ui-widget-header .ui-state-focus,
.ui-widget-content .ui-state-focus {
  border-color: #E6E6E6;
  background: rgba(102, 153, 204, 0.7);
  background-image: none;
  color: #FFFFFF;
  font-weight: normal;
}
.ui-state-focus.ui-menu-item a {
  color: #E6E6E6;
}
.ui-state-hover,
.ui-widget-content .ui-state-hover,
.ui-widget-header .ui-state-hover {
  border-top: solid 1px 1px;
  border-left: solid 1px 1px;
  border-right: solid 1px 1px;
  border-bottom: solid 1px 1px;
  border-color: #E6E6E6;
  background: rgba(102, 153, 204, 0.7);
  background-image: none;
  color: #ffffff;
}
.ui-state-hover a,
.ui-state-hover a:hover,
.ui-state-hover a:link,
.ui-state-hover a:visited {
  color: #808080;
  text-decoration: none;
}
.ui-state-active,
.ui-widget-content .ui-state-active,
.ui-widget-header .ui-state-active {
  border-top: solid 1px 1px;
  border-left: solid 1px 1px;
  border-right: solid 1px 1px;
  border-bottom: solid 1px 1px;
  border-color: #CDCDCD;
  background-image: none;
  font-weight: bold;
  color: #808080;
}
.ui-state-active a,
.ui-state-active a:link,
.ui-state-active a:visited {
  color: #808080;
  text-decoration: none;
}
/* Interaction Cues
----------------------------------*/
.ui-state-highlight,
.ui-widget-content .ui-state-highlight,
.ui-widget-header .ui-state-highlight {
  border-top: solid 1px 1px;
  border-left: solid 1px 1px;
  border-right: solid 1px 1px;
  border-bottom: solid 1px 1px;
  border-color: #B4B4B4;
  color: #808080;
}
.ui-state-highlight a,
.ui-widget-content .ui-state-highlight a,
.ui-widget-header .ui-state-highlight a {
  color: #e6e6e6;
}
.ui-state-error,
.ui-widget-content .ui-state-error,
.ui-widget-header .ui-state-error {
  border-top: solid 1px 1px;
  border-left: solid 1px 1px;
  border-right: solid 1px 1px;
  border-bottom: solid 1px 1px;
  border-color: #E6E6E6;
  color: #b3b3b3;
}
.ui-state-error a,
.ui-widget-content .ui-state-error a {
  color: #FF0000;
}
.ui-state-error-text,
.ui-widget-content .ui-state-error-text,
.ui-widget-header .ui-state-error-text {
  color: #FF0000;
}
.drop-hover {
  background-color: #FFDD73;
}
.ui-icon-close {
  /*visibility: hidden;*/
  /*background-image: url(../images/search.png);*/
  background-image: url("../images/cancel.png");
  background-repeat: no-repeat;
  background-color: #FFFFFF;
  background-size: 12px 12px;
  width: 16px;
  height: 16px;
  margin: 2px;
  padding: 1px;
  margin-top: 1px;
  background-position: 0px 0px;
  -webkit-border-radius: 2px;
  -moz-border-radius: 2px;
  border-radius: 2px;
}
.ui-icon-close:hover {
  background-color: transparent;
}
.ui-icon-close:active {
  background-color: #fff0c7 !important;
}
span.ui-icon-close {
  margin-top: 0px;
  top: 5px;
}
.et2_link_entry .ui-icon-close {
  margin-top: -5px;
  top: 9px !important;
}
/*Schliessen x*/
.ui-icon-closethick {
  background-image: url(../images/close.png) !important;
  background-repeat: no-repeat;
  background-color: #FFFFFF;
  background-size: contain;
  background-position: 0 0 !important;
  color: #ffffff;
  height: 16px;
}
.ui-icon-closethick:hover {
  background-color: #E6E6E6;
  color: #1E1E1E;
  -webkit-box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.6);
  -moz-box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.6);
  box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.6);
}
.ui-icon-closethick:active {
  -webkit-box-shadow: inset 1px 2px 1px rgba(0, 0, 0, 0.5) !important;
  -moz-box-shadow: inset 1px 2px 1px rgba(0, 0, 0, 0.5) !important;
  box-shadow: inset 1px 2px 1px rgba(0, 0, 0, 0.5) !important;
  background-color: #fff0c7 !important;
}
/*###########################################*/
/*Menu */
.ui-menu .ui-menu-item {
  padding: 0px;
}
.ui-menu .ui-menu-item a {
  line-height: 24px;
  margin: 0px;
  padding: 2px 5px;
}
.ui-menu .ui-menu-item a input {
  padding: 0;
}
.ui-menu .ui-menu-item a img {
  padding: 0;
}
.ui-menu .ui-menu-item a.ui-state-focus {
  margin: 0px !important;
  line-height: 24px;
  padding: 2px 5px;
  border: none;
}
/*###########################################*/
/* col selection */
span.ui-multiselect-header {
  color: #FFFFFF;
}
span.ui-icon-search {
  background-image: url(../images/search.png) !important;
  background-position: 0px;
  background-size: 10px 10px;
}
.ui-corner-all {
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  border-radius: 3px;
}
.ui-corner-all,
.ui-corner-bottom,
.ui-corner-left,
.ui-corner-bl {
  border-bottom-left-radius: 3px;
}
.ui-corner-all,
.ui-corner-top,
.ui-corner-left,
.ui-corner-tl {
  border-top-left-radius: 3px;
}
.ui-corner-all,
.ui-corner-bottom,
.ui-corner-right,
.ui-corner-br {
  border-bottom-right-radius: 3px;
}
.ui-corner-all,
.ui-corner-top,
.ui-corner-right,
.ui-corner-tr {
  border-top-right-radius: 3px;
}
/*###########################################*/
/*Dialog: edit row*/
.ui-widget-overlay {
  background: #CDCDCD;
}
.ui-dialog {
  box-shadow: -2px 1px 9px 3px #B4B4B4;
}
.ui-dialog .ui-dialog-buttonpane {
  padding-left: .8em;
  padding-right: .8em;
  padding-top: 0.7em;
}
.ui-dialog .ui-dialog-titlebar {
  padding-left: .8em;
  padding-right: .8em;
  font-size: 12pt;
  border: none;
  font-weight: normal;
  background: white;
}
.ui-dialog .ui-dialog-titlebar-close {
  right: .8em;
}
.ui-widget-content {
  border: 1px solid #B4B4B4;
}
.ui-widget-content .et2_selectbox button.et2_button_text,
.ui-widget-content .et2_selectbox select.et2_selectbox {
  height: 20px;
}
.ui-widget-content .et2_selectbox button {
  background-image: none;
}
.ui-widget-content .et2_selectbox div.ui-widget-header ul li label.ui-state-hover {
  background-color: rgba(102, 153, 204, 0.7);
  font-weight: normal;
}
button.ui-button {
  /*.border_normal;*/
  /*.box_shadow_standard_light;*/
  /*.rounded (3px);*/
  color: #000000;
  -webkit-appearance: none;
  -webkit-transition-property: background-color;
  -moz-transition-property: background-color;
  -o-transition-property: background-color;
  transition-property: background-color;
  -webkit-transition-duration: 0.5s;
  -moz-transition-duration: 0.5s;
  -o-transition-duration: 0.5s;
  transition-duration: 0.5s;
  -webkit-transition-timing-function: linear;
  -moz-transition-timing-function: linear;
  -o-transition-timing-function: linear;
  transition-timing-function: linear;
  background-color: #E6E6E6;
  padding-left: 30px;
  background-position: 6px center;
  background-repeat: no-repeat;
  background-size: 20px auto;
  /*.Button_size_h32_auto;*/
  height: 24px;
  border-color: #B4B4B4;
  outline: none;
}
button.ui-button:hover {
  background-color: #B4B4B4;
  color: #1E1E1E;
}
button.ui-button .ui-button-icon-primary:hover {
  background-color: #B4B4B4;
  color: #1E1E1E;
  box-shadow: none;
}
/*###########################################*/
/*Dialog: calendar edit series*/
.ui-dialog-buttonset button.ui-button-text-only {
  background-color: #CDCDCD;
  background: inherit;
  color: #000000 !important;
  font-weight: normal !important;
}
.ui-dialog-buttonset button.ui-button-text-only:hover {
  background-color: #B4B4B4;
}
.ui-dialog-buttonset button.ui-button {
  /*.border_normal;*/
  /*.box_shadow_standard_light;*/
  /*.rounded (3px);*/
  color: #000000;
  -webkit-appearance: none;
  -webkit-transition-property: background-color;
  -moz-transition-property: background-color;
  -o-transition-property: background-color;
  transition-property: background-color;
  -webkit-transition-duration: 0.5s;
  -moz-transition-duration: 0.5s;
  -o-transition-duration: 0.5s;
  transition-duration: 0.5s;
  -webkit-transition-timing-function: linear;
  -moz-transition-timing-function: linear;
  -o-transition-timing-function: linear;
  transition-timing-function: linear;
  background-color: #E6E6E6;
  padding-left: 30px;
  background-position: 6px center;
  background-repeat: no-repeat;
  background-size: 20px auto;
  /*.Button_size_h32_auto;*/
  height: 24px;
}
.ui-dialog-buttonset button.ui-button:hover {
  background-color: #B4B4B4;
  color: #1E1E1E;
}
/*###########################################*/
/*Dialog: calendar edit series*/
div#ui-datepicker-div {
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  border-radius: 3px;
  border: 1px solid #B4B4B4;
  -webkit-box-shadow: inset 1px 2px 1px rgba(0, 0, 0, 0.5);
  -moz-box-shadow: inset 1px 2px 1px rgba(0, 0, 0, 0.5);
  box-shadow: inset 1px 2px 1px rgba(0, 0, 0, 0.5);
}
.ui-datepicker-header {
  background-color: transparent;
}
.ui-datepicker .ui-state-default {
  border: none;
  padding: 2px;
  text-align: center;
}
.ui-datepicker .ui-state-highlight {
  color: #1a1a1a;
  font-weight: bold;
}
.ui-datepicker .ui-datepicker-close {
  border: 1px solid #b4b4b4;
}
.ui-datepicker table.ui-datepicker-calendar .ui-state-active {
  background-color: #0C5DA5;
  color: #FFFFFF;
}
.ui-datepicker div.ui-timepicker-div {
  padding: 3px;
}
.ui-datepicker div.ui-timepicker-div dt.ui_tpicker_time_label {
  font-size: 0.9em;
}
.ui-datepicker div.ui-timepicker-div dd.ui_tpicker_time {
  padding-left: 75px;
  background-color: #ffc200;
}
.ui-datepicker div.ui-timepicker-div dd.ui_tpicker_time input {
  font-size: 1.3em;
}
.ui-datepicker div.ui-timepicker-div dt.ui_tpicker_time_label {
  font-size: 0.9em;
}
.ui-datepicker div.ui-timepicker-div dt.ui_tpicker_minute_label {
  font-size: 0.9em;
}
.ui-datepicker div.ui-timepicker-div div.ui_tpicker_hour_slider span.ui-slider-handle {
  background-color: #0C5DA5;
}
.ui-datepicker div.ui-timepicker-div div.ui_tpicker_minute_slider span.ui-slider-handle {
  background-color: #0C5DA5;
}
.ui-datepicker div.ui-datepicker-buttonpane {
  background-color: #679FD2;
}
.ui-datepicker button.ui-datepicker-current .ui-state-hover {
  background-color: #b3e4a6 !important;
}
.ui-datepicker button.ui-datepicker-current .ui-state-hover:active {
  background-color: #b3e4a6;
}
.ui-datepicker .ui-datepicker-buttonpane button.ui-datepicker-current:active {
  background-color: #b3e4a6;
}
.ui-datepicker .ui-datepicker-buttonpane button.ui-datepicker-close:hover {
  background-color: #ffdb7a !important;
  color: #000000;
}
.ui-datepicker .ui-datepicker-buttonpane button.ui-datepicker-close:active {
  background-color: #fff0c7 !important;
  color: #373737;
}
.ui-widget-overlay,
.ui-widget-shadow {
  background-image: none;
}
/**
 * EGroupware: Stylite Pixelegg template
 *
 * less file for magic suggest
 *
 * Please do NOT change css-files directly, instead change less-files and compile them!
 *
 * @link http://www.egroupware.org
 * @license http://opensource.org/licenses/gpl-license.php GPL - GNU General Public License
 * @author Stefan Reinhard <stefan.reinhard@pixelegg.de>
 * @package pixelegg
 * @version $Id$
 */
.ms-ctn,
.ms-res-ctn {
  /* It doesn't really work smaller than this */
  border: solid 1px #e6e6e6;
}
.ms-ctn .ms-res-item-active,
.ms-res-ctn .ms-res-item-active {
  background-color: rgba(153, 204, 255, 0.4);
}
.ms-ctn .ms-trigger {
  border-left: none;
}
/**
 * EGroupware: CSS with less preprocessor

 * traditional.less
 * included in pixelegg.less since 17/03/2014


 *
 * Please do NOT change css-files directly, instead change less-files and compile them!
 *
 * @link http://www.egroupware.org
 * @license http://opensource.org/licenses/gpl-license.php GPL - GNU General Public License
 * @author Stefan Reinhard <stefan.reinhard@pixelegg.de>
 * @package pixelegg
 * @version $Id$
 */
/*
	font styling
	allowed attributes: font-family,font-size,color,font-weight
*/
/**
 * layout_*.less files are Pixelegg template specific
 */
/**
 * EGroupware: Stylite Pixelegg template
 *
 * Please do NOT change css-files directly, instead change less-files and compile them!
 *
 * @link http://www.egroupware.org
 * @license http://opensource.org/licenses/gpl-license.php GPL - GNU General Public License
 * @author Stefan Reinhard <stefan.reinhard@pixelegg.de>
 * @package pixelegg
 * @version $Id: pixelegg.less 3017 2014-04-15 08:35:38Z ralfbecker $


## Important ###########

# Merge file for all .less layout_ Files

 */
/**
 * EGroupware: Stylite Pixelegg template
 *
 * lettersearch
 *
 * Please do NOT change css-files directly, instead change less-files and compile them!
 *
 * @link http://www.egroupware.org
 * @license http://opensource.org/licenses/gpl-license.php GPL - GNU General Public License
 * @author Stefan Reinhard <stefan.reinhard@pixelegg.de>
 * @package pixelegg
 * @version $Id: layout_table.less 3089 2014-06-11 14:02:57Z pixelegg $
 */
/**
    * Eric Meyer's Reset CSS v2.0 (http://meyerweb.com/eric/tools/css/reset/)
    * http://cssreset.com
    * fieldset legend
    */
/*    html, body, div, span, applet, object, iframe,
    h1, h2, h3, h4, h5, h6, p, blockquote, pre,
    a, abbr, acronym, address, big, cite, code,
    del, dfn, em, img, ins, kbd, q, s, samp,
    small, strike, strong, sub, sup, tt, var,
    b, u, i, center,
    dl, dt, dd, ol, ul, li,
    form, label,
    table, caption, tbody, tfoot, thead, tr, th, td,
    article, aside, canvas, details, embed,
    figure, figcaption, footer, header, hgroup,
    menu, nav, output, ruby, section, summary,
    time, mark, audio, video {
    margin: 0;
    padding: 0;
    border: 0;
    font-size: 100%;
    font: inherit;
    }*/
/* HTML5 display-role reset for older browsers */
article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
menu,
nav,
section {
  display: block;
}
body {
  line-height: 1;
}
ol,
ul {
  /*list-style: none;*/
}
blockquote,
q {
  quotes: none;
}
blockquote:before,
blockquote:after,
q:before,
q:after {
  content: '';
  content: none;
}
table {
  border-collapse: collapse;
  border-spacing: 0;
}
*::-webkit-input-placeholder {
  color: #696969;
}
*:-moz-placeholder {
  /* FF 4-18 */
  color: #696969;
}
*::-moz-placeholder {
  /* FF 19+ */
  color: #696969;
}
*:-ms-input-placeholder {
  /* IE 10+ */
  color: #696969;
}
iframe {
  border: none;
}
html * {
  font-size: 100%;
}
html {
  margin: 0px !important;
  padding: 0px !important;
  width: 99.9% !important;
  height: 99.9% !important;
}
body {
  background-image: none;
  background-color: #ffffff;
  color: #000000;
  margin: 0px !important;
  padding: 0px !important;
  width: 99.9%;
  height: 99.9% !important;
  font-size: 11px;
  line-height: 1.28;
  font-weight: normal;
}
/**
 * EGroupware: Stylite Pixelegg template
 *
 * Definitions for login page
 *
 * Please do NOT change css-files directly, instead change less-files and compile them!
 *
 * @link http://www.egroupware.org
 * @license http://opensource.org/licenses/gpl-license.php GPL - GNU General Public License
 * @author Stefan Reinhard <stefan.reinhard@pixelegg.de>
 * @package pixelegg
 * @version $Id$
 */
#socialBox {
  float: left;
  margin-top: 20px;
}
#socialMedia a {
  margin-left: 10px;
}
#socialMedia a img {
  width: 24px;
}
/* ##################################################################################
 *       login page
 */
#loginMainDiv {
  padding: 0;
  height: 100%;
  width: 100%;
  border: none;
  margin: 0 auto 0px;
  background-color: white;
  background-image: url(../../api/templates/default/images/login_background.jpg);
  background-repeat: no-repeat;
  background-position: 50% 50%;
  background-size: cover;
}
#loginMainDiv .loginMessageBox {
  width: 100%;
  position: absolute;
  z-index: 100;
}
#loginMainDiv .loginMessageBox #loginCdMessage:not(.error) {
  display: none;
}
#loginMainDiv .loginMessageBox #loginCdMessage.error {
  border: 3px solid #7ab7ec;
  color: red;
  text-align: center;
  font-size: 12pt;
  white-space: pre-wrap;
  height: auto;
  background: white;
  opacity: 0.94;
  margin-left: 20px;
  border-radius: 5px;
  margin-right: 20px;
  padding: 20px;
  margin-top: 20px;
}
#loginMainDiv .loginMessageBox .closeBtn {
  position: absolute;
  right: 30px;
  border-radius: 100%;
  width: 25px;
  height: 25px;
  text-align: center;
  line-height: 20px;
  font-size: 15px;
  top: 30px;
  color: #b6b7bb;
}
#loginMainDiv .loginMessageBox .closeBtn:hover {
  color: #5e6063;
  cursor: pointer;
}
#loginMainDiv #divAppIconBar {
  background: transparent;
  width: 100%;
  text-align: center;
  height: 40%;
  display: block;
  max-height: 40%;
}
#loginMainDiv #divAppIconBar #divLogo {
  position: relative;
  padding-top: 20px;
}
#loginMainDiv #divAppIconBar #divLogo .login_logo_container {
  width: 250px;
  height: 150px;
  max-height: 150px;
  max-width: 250px;
  margin: 0 auto;
}
#loginMainDiv #divAppIconBar #divLogo .login_logo_container .login_logo {
  width: auto;
  height: 100%;
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
}
#loginMainDiv #loginScreenMessage:not([class $= "error"]) {
  margin: 1em;
  font-size: 12pt;
  color: #0a5ca5;
}
#loginMainDiv #loginScreenMessage:not([class $= "error"]) img {
  max-width: 100%;
}
#loginMainDiv div#login_footer {
  position: absolute;
  bottom: 0;
  display: inline-block;
  left: 0;
  width: 100%;
}
#loginMainDiv div#login_footer a.logo_footer {
  float: right;
  margin: 10px;
}
#loginMainDiv div#login_footer a.logo_footer img {
  height: 40px;
  width: 40px;
}
#loginMainDiv div#centerBox {
  margin: 0 auto -20px;
  background: transparent;
  border: none;
  z-index: 100;
  padding: 0;
  width: 280px;
}
#loginMainDiv div#centerBox form {
  border-radius: 5px;
  opacity: 0.94;
  background-color: white;
  padding: 1em;
}
#loginMainDiv div#centerBox form .hiddenCredential {
  display: none;
}
#loginMainDiv div#centerBox form table.divLoginbox {
  background-color: transparent;
  -webkit-border-radius: 3px;
  -webkit-border-top-left-radius: 10px;
  -moz-border-radius: 3px;
  -moz-border-radius-topleft: 10px;
  border-radius: 3px;
  border-top-left-radius: 10px;
}
#loginMainDiv div#centerBox form table.divLoginbox div.LoginPasswordImage {
  background-color: #b3ad54;
  background-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIHZpZXdCb3g9IjAgMCAxIDEiIHByZXNlcnZlQXNwZWN0UmF0aW89Im5vbmUiPjxsaW5lYXJHcmFkaWVudCBpZD0iZzc0MyIgZ3JhZGllbnRVbml0cz0idXNlclNwYWNlT25Vc2UiIHgxPSIwJSIgeTE9IjAlIiB4Mj0iMCUiIHkyPSIxMDAlIj48c3RvcCBzdG9wLWNvbG9yPSIjZmZjMjAwIiBvZmZzZXQ9IjAiLz48c3RvcCBzdG9wLWNvbG9yPSIjNDA4REQyIiBvZmZzZXQ9IjEiLz48L2xpbmVhckdyYWRpZW50PjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxIiBoZWlnaHQ9IjEiIGZpbGw9InVybCgjZzc0MykiLz48L3N2Zz4=);
  background-image: -moz-linear-gradient(top, #ffc200, #408DD2);
  background-image: -ms-linear-gradient(top, #ffc200, #408DD2);
  background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#ffc200), to(#408DD2));
  background-image: -webkit-linear-gradient(top, #ffc200, #408DD2);
  background-image: -o-linear-gradient(top, #ffc200, #408DD2);
  background-image: linear-gradient(top, #ffc200, #408DD2);
  background-repeat: repeat-x;
}
#loginMainDiv div#centerBox form table.divLoginbox div.LoginPasswordImage img.passwordImage {
  margin: 0 auto;
  max-width: 400px;
  border-top: solid 1px 5px;
  border-left: solid 1px #EEE;
  border-right: solid 1px #EEE;
  border-bottom: solid 1px #EEE;
}
#loginMainDiv div#centerBox form table.divLoginbox div.LoginPasswordImage img.passwordImage[src$="svg"] {
  border-top: solid 1px 5px;
  border-left: solid 1px #EEE;
  border-right: solid 1px #EEE;
  border-bottom: solid 1px #EEE;
  width: 40px;
  height: 40px;
}
#loginMainDiv div#centerBox form table.divLoginbox td {
  font-size: 12pt;
  position: relative;
}
#loginMainDiv div#centerBox form table.divLoginbox select {
  padding-left: 25px;
  width: 100%;
  height: 42px;
  border: none;
  border-bottom: 1px solid silver;
  border-radius: 0px;
  background-color: transparent;
}
#loginMainDiv div#centerBox form table.divLoginbox select[name="remember_me"] {
  text-indent: 60%;
  background-color: transparent;
}
#loginMainDiv div#centerBox form table.divLoginbox select:focus,
#loginMainDiv div#centerBox form table.divLoginbox select:hover {
  box-shadow: none;
}
#loginMainDiv div#centerBox form table.divLoginbox input {
  width: calc(250px - 22px);
  height: 40px;
  padding: 0;
  margin: 0;
  border: none;
  border-bottom: 1px solid silver;
  padding-left: 25px;
  background-color: transparent;
}
#loginMainDiv div#centerBox form table.divLoginbox input:focus {
  outline: none;
}
#loginMainDiv div#centerBox form table.divLoginbox span.field_icons {
  position: absolute;
  left: 0px;
  width: 20px;
  height: 20px;
  background-size: 16px;
  background-position: left center;
  background-repeat: no-repeat;
  top: 12px;
  z-index: 100;
  opacity: 0.5;
}
#loginMainDiv div#centerBox form table.divLoginbox span.field_icons.username {
  background-image: url(../images/personal.png);
}
#loginMainDiv div#centerBox form table.divLoginbox span.field_icons.password {
  background-image: url(../images/password.png);
}
#loginMainDiv div#centerBox form table.divLoginbox span.field_icons.remember_me {
  background-image: url(../images/task.png);
  z-index: 0;
  width: 130px;
  padding-left: 27px;
}
#loginMainDiv div#centerBox form table.divLoginbox span.field_icons.domain {
  background-image: url(../images/internet.png);
}
#loginMainDiv div#centerBox form table.divLoginbox span.field_icons.language {
  background-image: url(../images/language.png);
}
#loginMainDiv div#centerBox form table.divLoginbox input[type="submit"] {
  background-color: #0a5ca5;
  color: #ffffff;
  font-size: 20px;
  padding-left: 0;
  width: 250px;
  margin-top: 25px;
}
#loginMainDiv div#centerBox form table.divLoginbox .registration {
  font-size: 11px;
}
#loginMainDiv div#centerBox form table.divLoginbox .registration a:not(:first-child):before {
  padding-left: 5px;
  padding-right: 5px;
  content: '|';
}
#wrap div.animation_login {
  margin: 0.3em;
  position: fixed;
  width: 100%;
  bottom: 0;
}
#wrap img[src$="svg"],
#wrap background-image[url$="svg"] {
  background-color: #679fd2;
  background-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIHZpZXdCb3g9IjAgMCAxIDEiIHByZXNlcnZlQXNwZWN0UmF0aW89Im5vbmUiPjxsaW5lYXJHcmFkaWVudCBpZD0iZzc0MyIgZ3JhZGllbnRVbml0cz0idXNlclNwYWNlT25Vc2UiIHgxPSIwJSIgeTE9IjAlIiB4Mj0iMCUiIHkyPSIxMDAlIj48c3RvcCBzdG9wLWNvbG9yPSIjNjc5RkQyIiBvZmZzZXQ9IjAiLz48c3RvcCBzdG9wLWNvbG9yPSIjNjc5RkQyIiBvZmZzZXQ9IjEiLz48L2xpbmVhckdyYWRpZW50PjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxIiBoZWlnaHQ9IjEiIGZpbGw9InVybCgjZzc0MykiLz48L3N2Zz4=);
  background-image: -moz-linear-gradient(top, #679FD2, #679FD2);
  background-image: -ms-linear-gradient(top, #679FD2, #679FD2);
  background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#679FD2), to(#679FD2));
  background-image: -webkit-linear-gradient(top, #679FD2, #679FD2);
  background-image: -o-linear-gradient(top, #679FD2, #679FD2);
  background-image: linear-gradient(top, #679FD2, #679FD2);
  background-repeat: repeat-x;
}
#img1,
#img2,
#img3,
#img4,
#img5,
#img6,
#img7,
#img8 {
  width: 12%;
  z-index: -1;
  animation-name: test;
  animation-duration: 8s;
  animation-iteration-count: infinite;
  -webkit-animation-name: test;
  -webkit-animation-duration: 8s;
  -webkit-animation-iteration-count: infinite;
  opacity: 0;
}
#img1 {
  animation-delay: 0s;
  -webkit-animation-delay: 0s;
}
#img2 {
  animation-delay: 3s;
  -webkit-animation-delay: 3s;
}
#img3 {
  animation-delay: 6s;
  -webkit-animation-delay: 6s;
}
#img4 {
  animation-delay: 9s;
  -webkit-animation-delay: 9s;
}
#img5 {
  animation-delay: 12s;
  -webkit-animation-delay: 12s;
}
#img6 {
  animation-delay: 15s;
  -webkit-animation-delay: 15s;
}
#img7 {
  animation-delay: 18s;
  -webkit-animation-delay: 18s;
}
#img8 {
  animation-delay: 21s;
  -webkit-animation-delay: 21s;
}
@-webkit-keyframes test {
  0% {
    opacity: 0;
  }
  50% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}
@keyframes test {
  0% {
    opacity: 0;
  }
  50% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}
/**
 * EGroupware: Stylite Pixelegg template
 *
 * lettersearch
 *
 * Please do NOT change css-files directly, instead change less-files and compile them!
 *
 * @link http://www.egroupware.org
 * @license http://opensource.org/licenses/gpl-license.php GPL - GNU General Public License
 * @author Stefan Reinhard <stefan.reinhard@pixelegg.de>
 * @package pixelegg
 * @version $Id: layout_table.less 3089 2014-06-11 14:02:57Z pixelegg $
 */
.egw_fw_ui_ajaxloader {
  display: inline-block;
  width: 16px;
  height: 16px;
  background-image: url(../images/ajax-loader.gif);
  background-repeat: no-repeat;
  background-position: center;
  float: right;
}
.egw_fw_ui_tab_content > .loading {
  background-image: url('../images/loading.gif');
  background-repeat: no-repeat;
  text-align: center;
  line-height: 400px;
}
/**
 * EGroupware: Stylite Pixelegg template
 *
 * lettersearch
 *
 * Please do NOT change css-files directly, instead change less-files and compile them!
 *
 * @link http://www.egroupware.org
 * @license http://opensource.org/licenses/gpl-license.php GPL - GNU General Public License
 * @author Stefan Reinhard <stefan.reinhard@pixelegg.de>
 * @package pixelegg
 * @version $Id: layout_table.less 3089 2014-06-11 14:02:57Z pixelegg $
 */
/*##########################################
#      Content Element                     #
#      Button                              #
###########################################*/
/*input,button,select
{
	border: solid 1px #bbbbbb;
}*/
/*input[type=submit],input[type=button],input[type=reset],button,.egwbutton
{
	background-color:#b9d5e3;
	border:  outset 1px #b9d5e3;
	margin:  1px;
	padding: 1px;
	cursor:  pointer;
	color:  #004e7d;
}*/
/*input[type=submit]:hover,input[type=button]:hover,input[type=reset]:hover,button:hover,.egwbutton:hover
{
	background-color:#94bfd4;
	border:  outset 1px #b9d5e3;
	color:  #004e7d;
}*/
/*input[type=submit]:active,input[type=button]:active,input[type=reset]:active,button:active,.egwbutton:active
{
	border:  inset 1px #bbbbbb;
}*/
input[type=submit]:disabled,
input[type=button]:disabled,
input[type=reset]:disabled,
button:disabled,
.egwbutton:disabled {
  background-color: rgba(12, 93, 165, 0.2);
  color: gray;
}
button.et2_button_text background-image[src$="svg"],
input[type=button] background-image[src$="svg"] {
  background-color: #b4b4b4;
  background-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIHZpZXdCb3g9IjAgMCAxIDEiIHByZXNlcnZlQXNwZWN0UmF0aW89Im5vbmUiPjxsaW5lYXJHcmFkaWVudCBpZD0iZzc0MyIgZ3JhZGllbnRVbml0cz0idXNlclNwYWNlT25Vc2UiIHgxPSIwJSIgeTE9IjAlIiB4Mj0iMCUiIHkyPSIxMDAlIj48c3RvcCBzdG9wLWNvbG9yPSIjQjRCNEI0IiBvZmZzZXQ9IjAiLz48c3RvcCBzdG9wLWNvbG9yPSIjQjRCNEI0IiBvZmZzZXQ9IjEiLz48L2xpbmVhckdyYWRpZW50PjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxIiBoZWlnaHQ9IjEiIGZpbGw9InVybCgjZzc0MykiLz48L3N2Zz4=);
  background-image: -moz-linear-gradient(top, #B4B4B4, #B4B4B4);
  background-image: -ms-linear-gradient(top, #B4B4B4, #B4B4B4);
  background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#B4B4B4), to(#B4B4B4));
  background-image: -webkit-linear-gradient(top, #B4B4B4, #B4B4B4);
  background-image: -o-linear-gradient(top, #B4B4B4, #B4B4B4);
  background-image: linear-gradient(top, #B4B4B4, #B4B4B4);
  background-repeat: repeat-x;
}
button.et2_button_text:hover,
input[type=button]:hover {
  /*background-color: @gray_30;*/
  text-shadow: 0px 0px;
  -webkit-box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.6) !important;
  -moz-box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.6) !important;
  box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.6) !important;
}
button.et2_button_text:active,
input[type=button]:active {
  -webkit-box-shadow: inset 1px 2px 1px rgba(0, 0, 0, 0.5) !important;
  -moz-box-shadow: inset 1px 2px 1px rgba(0, 0, 0, 0.5) !important;
  box-shadow: inset 1px 2px 1px rgba(0, 0, 0, 0.5) !important;
}
/* ########################################################################################
 * Content Element
 * Button mit Bildern
 *
 ######################################################################################## */
button.et2_button_with_image {
  /*.border_normal;*/
  /*.box_shadow_standard_light;*/
  /*.rounded (3px);*/
  color: #000000;
  -webkit-appearance: none;
  -webkit-transition-property: background-color;
  -moz-transition-property: background-color;
  -o-transition-property: background-color;
  transition-property: background-color;
  -webkit-transition-duration: 0.5s;
  -moz-transition-duration: 0.5s;
  -o-transition-duration: 0.5s;
  transition-duration: 0.5s;
  -webkit-transition-timing-function: linear;
  -moz-transition-timing-function: linear;
  -o-transition-timing-function: linear;
  transition-timing-function: linear;
  padding-left: 30px;
  background-position: 6px center;
  background-repeat: no-repeat;
  background-size: 20px auto;
  /*.Button_size_h32_auto;*/
  height: 24px;
  background-repeat: no-repeat !important;
  background-position: center;
  background-size: 20px 20px;
  background-color: #E6E6E6;
}
button.et2_button_with_image background-color[url$="svg"] {
  background-color: #b4b4b4;
  background-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIHZpZXdCb3g9IjAgMCAxIDEiIHByZXNlcnZlQXNwZWN0UmF0aW89Im5vbmUiPjxsaW5lYXJHcmFkaWVudCBpZD0iZzc0MyIgZ3JhZGllbnRVbml0cz0idXNlclNwYWNlT25Vc2UiIHgxPSIwJSIgeTE9IjAlIiB4Mj0iMCUiIHkyPSIxMDAlIj48c3RvcCBzdG9wLWNvbG9yPSIjQjRCNEI0IiBvZmZzZXQ9IjAiLz48c3RvcCBzdG9wLWNvbG9yPSIjQjRCNEI0IiBvZmZzZXQ9IjEiLz48L2xpbmVhckdyYWRpZW50PjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxIiBoZWlnaHQ9IjEiIGZpbGw9InVybCgjZzc0MykiLz48L3N2Zz4=);
  background-image: -moz-linear-gradient(top, #B4B4B4, #B4B4B4);
  background-image: -ms-linear-gradient(top, #B4B4B4, #B4B4B4);
  background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#B4B4B4), to(#B4B4B4));
  background-image: -webkit-linear-gradient(top, #B4B4B4, #B4B4B4);
  background-image: -o-linear-gradient(top, #B4B4B4, #B4B4B4);
  background-image: linear-gradient(top, #B4B4B4, #B4B4B4);
  background-repeat: repeat-x;
}
button.et2_button_with_image.et2_button_text {
  background-position: 6px center;
}
/* ########################################################################################
 * Content Element
 * Button löschen / delete / => color-negative-action // red
 *
 ######################################################################################## */
input[type="submit"][id*="delete"],
input[type="button"][id*="delete"],
button[id="delete"],
button[id="infolog-edit_button[delete]"],
button[id="addressbook-edit_button[delete]"],
button[id="resources-edit_delete"],
button[id="calendar-edit_button[delete]"],
button[id="timesheet-edit_button[delete]"],
button[id="displayToolbar-delete"],
button.et2_button_delete {
  /*background-color: @color_negative_action_hover !important;*/
  background-image: url('../images/delete.png');
  margin-left: 3em;
  /*.border_normal;*/
  /*.box_shadow_standard_light;*/
  /*.rounded (3px);*/
  color: #000000;
  -webkit-appearance: none;
  -webkit-transition-property: background-color;
  -moz-transition-property: background-color;
  -o-transition-property: background-color;
  transition-property: background-color;
  -webkit-transition-duration: 0.5s;
  -moz-transition-duration: 0.5s;
  -o-transition-duration: 0.5s;
  transition-duration: 0.5s;
  -webkit-transition-timing-function: linear;
  -moz-transition-timing-function: linear;
  -o-transition-timing-function: linear;
  transition-timing-function: linear;
  background-color: #E6E6E6;
  padding-left: 30px;
  background-position: 6px center;
  background-repeat: no-repeat;
  background-size: 20px auto;
  /*.Button_size_h32_auto;*/
  height: 24px;
}
input[type="submit"][id*="delete"]:hover,
input[type="button"][id*="delete"]:hover,
button[id="delete"]:hover,
button[id="infolog-edit_button[delete]"]:hover,
button[id="addressbook-edit_button[delete]"]:hover,
button[id="resources-edit_delete"]:hover,
button[id="calendar-edit_button[delete]"]:hover,
button[id="timesheet-edit_button[delete]"]:hover,
button[id="displayToolbar-delete"]:hover,
button.et2_button_delete:hover {
  /*.border_normal;*/
  /*.box_shadow_standard_light;*/
  /*.rounded (3px);*/
  color: #000000;
  -webkit-appearance: none;
  -webkit-transition-property: background-color;
  -moz-transition-property: background-color;
  -o-transition-property: background-color;
  transition-property: background-color;
  -webkit-transition-duration: 0.5s;
  -moz-transition-duration: 0.5s;
  -o-transition-duration: 0.5s;
  transition-duration: 0.5s;
  -webkit-transition-timing-function: linear;
  -moz-transition-timing-function: linear;
  -o-transition-timing-function: linear;
  transition-timing-function: linear;
  background-color: #E6E6E6;
  padding-left: 30px;
  background-position: 6px center;
  background-repeat: no-repeat;
  background-size: 20px auto;
  /*.Button_size_h32_auto;*/
  height: 24px;
}
input[type="submit"][id*="delete"]:active,
input[type="button"][id*="delete"]:active,
button[id="delete"]:active,
button[id="infolog-edit_button[delete]"]:active,
button[id="addressbook-edit_button[delete]"]:active,
button[id="resources-edit_delete"]:active,
button[id="calendar-edit_button[delete]"]:active,
button[id="timesheet-edit_button[delete]"]:active,
button[id="displayToolbar-delete"]:active,
button.et2_button_delete:active {
  /*.border_normal;*/
  /*.box_shadow_standard_light;*/
  /*.rounded (3px);*/
  color: #000000;
  -webkit-appearance: none;
  -webkit-transition-property: background-color;
  -moz-transition-property: background-color;
  -o-transition-property: background-color;
  transition-property: background-color;
  -webkit-transition-duration: 0.5s;
  -moz-transition-duration: 0.5s;
  -o-transition-duration: 0.5s;
  transition-duration: 0.5s;
  -webkit-transition-timing-function: linear;
  -moz-transition-timing-function: linear;
  -o-transition-timing-function: linear;
  transition-timing-function: linear;
  background-color: #E6E6E6;
  padding-left: 30px;
  background-position: 6px center;
  background-repeat: no-repeat;
  background-size: 20px auto;
  /*.Button_size_h32_auto;*/
  height: 24px;
}
/* ########################################################################################
 * Content Element
 * Button edit + save + apply + copy => color-positive-action // green
 *
 ######################################################################################## */
#passwordchange {
  background-image: url('../images/cancel.png') !important;
  /*.border_normal;*/
  /*.box_shadow_standard_light;*/
  /*.rounded (3px);*/
  color: #000000;
  -webkit-appearance: none;
  -webkit-transition-property: background-color;
  -moz-transition-property: background-color;
  -o-transition-property: background-color;
  transition-property: background-color;
  -webkit-transition-duration: 0.5s;
  -moz-transition-duration: 0.5s;
  -o-transition-duration: 0.5s;
  transition-duration: 0.5s;
  -webkit-transition-timing-function: linear;
  -moz-transition-timing-function: linear;
  -o-transition-timing-function: linear;
  transition-timing-function: linear;
  background-color: #E6E6E6;
  padding-left: 30px;
  background-position: 6px center;
  background-repeat: no-repeat;
  background-size: 20px auto;
  /*.Button_size_h32_auto;*/
  height: 24px;
}
#passwordchange:hover {
  background-color: #b3e4a6 !important;
  -webkit-box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.6);
  -moz-box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.6);
  box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.6);
}
#passwordchange:active {
  background-color: #b3e4a6 !important;
  -webkit-box-shadow: inset 1px 2px 1px rgba(0, 0, 0, 0.5);
  -moz-box-shadow: inset 1px 2px 1px rgba(0, 0, 0, 0.5);
  box-shadow: inset 1px 2px 1px rgba(0, 0, 0, 0.5);
}
/* ########################################################################################
 *
 * Button cancel /  => color-cancel-action // yellow
 *
 ######################################################################################## */
/* et2_box_widget ###*/
/*div.et2_box_widget .et2_button_text:last_child,*/
button[id="cancel"],
button#cancel {
  background-image: url('../images/cancel.png') !important;
  /*.border_normal;*/
  /*.box_shadow_standard_light;*/
  /*.rounded (3px);*/
  color: #000000;
  -webkit-appearance: none;
  -webkit-transition-property: background-color;
  -moz-transition-property: background-color;
  -o-transition-property: background-color;
  transition-property: background-color;
  -webkit-transition-duration: 0.5s;
  -moz-transition-duration: 0.5s;
  -o-transition-duration: 0.5s;
  transition-duration: 0.5s;
  -webkit-transition-timing-function: linear;
  -moz-transition-timing-function: linear;
  -o-transition-timing-function: linear;
  transition-timing-function: linear;
  background-color: #E6E6E6;
  padding-left: 30px;
  background-position: 6px center;
  background-repeat: no-repeat;
  background-size: 20px auto;
  /*.Button_size_h32_auto;*/
  height: 24px;
  content: "ID missing";
}
button[id="cancel"]:hover,
button#cancel:hover {
  color: #000000;
  -webkit-box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.6);
  -moz-box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.6);
  box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.6);
}
button[id="cancel"]:active,
button#cancel:active {
  color: #000000;
  -webkit-box-shadow: inset 1px 2px 1px rgba(0, 0, 0, 0.5);
  -moz-box-shadow: inset 1px 2px 1px rgba(0, 0, 0, 0.5);
  box-shadow: inset 1px 2px 1px rgba(0, 0, 0, 0.5);
}
#passwordcancel {
  background-image: url('../images/cancel.png') !important;
  /*.border_normal;*/
  /*.box_shadow_standard_light;*/
  /*.rounded (3px);*/
  color: #000000;
  -webkit-appearance: none;
  -webkit-transition-property: background-color;
  -moz-transition-property: background-color;
  -o-transition-property: background-color;
  transition-property: background-color;
  -webkit-transition-duration: 0.5s;
  -moz-transition-duration: 0.5s;
  -o-transition-duration: 0.5s;
  transition-duration: 0.5s;
  -webkit-transition-timing-function: linear;
  -moz-transition-timing-function: linear;
  -o-transition-timing-function: linear;
  transition-timing-function: linear;
  background-color: #E6E6E6;
  padding-left: 30px;
  background-position: 6px center;
  background-repeat: no-repeat;
  background-size: 20px auto;
  /*.Button_size_h32_auto;*/
  height: 24px;
}
#passwordcancel:hover {
  background-color: #ffdb7a !important;
  -webkit-box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.6);
  -moz-box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.6);
  box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.6);
}
#passwordcancel:active {
  background-color: #fff0c7 !important;
  -webkit-box-shadow: inset 1px 2px 1px rgba(0, 0, 0, 0.5);
  -moz-box-shadow: inset 1px 2px 1px rgba(0, 0, 0, 0.5);
  box-shadow: inset 1px 2px 1px rgba(0, 0, 0, 0.5);
}
/* ########################################################################################
 *
 * Button hinzufügen
 *
 ######################################################################################## */
button.add {
  color: #FFF;
  text-shadow: none;
  height: 24px;
  /*    height: auto;*/
  background-image: none;
  -webkit-border-radius: 3px;
  -webkit-border-top-left-radius: 10px;
  -moz-border-radius: 3px;
  -moz-border-radius-topleft: 10px;
  border-radius: 3px;
  border-top-left-radius: 10px;
}
button.add:before {
  content: "+";
  font-size: 1.5em;
  color: #ffc200;
  line-height: 1.1em;
}
button[id="add"] {
  background-image: url('../images/add.png') !important;
  /*.border_normal;*/
  /*.box_shadow_standard_light;*/
  /*.rounded (3px);*/
  color: #000000;
  -webkit-appearance: none;
  -webkit-transition-property: background-color;
  -moz-transition-property: background-color;
  -o-transition-property: background-color;
  transition-property: background-color;
  -webkit-transition-duration: 0.5s;
  -moz-transition-duration: 0.5s;
  -o-transition-duration: 0.5s;
  transition-duration: 0.5s;
  -webkit-transition-timing-function: linear;
  -moz-transition-timing-function: linear;
  -o-transition-timing-function: linear;
  transition-timing-function: linear;
  background-color: #E6E6E6;
  padding-left: 30px;
  background-position: 6px center;
  background-repeat: no-repeat;
  background-size: 20px auto;
  /*.Button_size_h32_auto;*/
  height: 24px;
}
/*Button Ende #######################################################*/
/**
 * EGroupware: Stylite Pixelegg template
 *
 * et2 Messages
 *
 * Please do NOT change css_files directly, instead change less-files and compile them!
 *
 * @link http://www.egroupware.org
 * @license http://opensource.org/licenses/gpl-license.php GPL - GNU General Public License
 * @author Stefan Reinhard <stefan.reinhard@pixelegg.de>
 * @package pixelegg
 * @version $Id$
 */
/* @group Base */
.chzn-container {
  color: #808080;
}
/* @end */
/* @group Single Chosen */
/* @end */
/* @group Results */
.chzn-container .chzn-results {
  color: #808080;
  margin: 0 4px 4px 0;
  max-height: 240px;
  padding: 0 0 0 4px;
  position: relative;
  overflow-x: hidden;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
}
.chzn-container .chzn-results li {
  color: #1E1E1E;
}
.chzn-container .chzn-results li.highlighted {
  background: rgba(153, 204, 255, 0.4);
  color: #000000;
}
/* @end */
/* @group Multi Chosen */
/* @end */
/* @group Active  */
.chzn-container-active .chzn-choices li.search-field input {
  color: #111 !important;
  border: 1px solid rgba(0, 0, 0, 0.15);
  border-color: #B4B4B4;
  -webkit-box-shadow: 0px 1px 0px rgba(0, 0, 0, 0.5);
  -moz-box-shadow: 0px 1px 0px rgba(0, 0, 0, 0.5);
  box-shadow: 0px 1px 0px rgba(0, 0, 0, 0.5);
  width: auto;
  /*margin: 0.5em 0em 0.5em 0;*/
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  border-radius: 3px;
}
.chzn-container-active .chzn-choices li.search-field input:hover {
  -webkit-box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.6);
  -moz-box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.6);
  box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.6);
}
.chzn-container-active .chzn-choices li.search-field input:focus {
  outline: 0;
  border-width: 1px;
  border-style: solid;
  border-color: #B4B4B4;
  -webkit-box-shadow: 0 0 2px 1px rgba(0, 0, 0, 0.1);
  -moz-box-shadow: 0 0 2px 1px rgba(0, 0, 0, 0.1);
  box-shadow: 0 0 2px 1px rgba(0, 0, 0, 0.1);
}
/* @end */
/* @group Disabled Support */
/* @end */
/* @group Right to Left */
/* @end */
/* @group Retina compatibility */
/* @end */
/**
 * Egw customizations for Chosen widget
 */
.chzn-container-single .chzn-single {
  border: 1px solid #e5e5e5;
  border-radius: 3px;
  background: none !important;
  box-shadow: none !important;
  color: #26537C;
  height: 21px;
  top: -2px;
}
.chzn-container-single .et2_country-select.chzn-single span {
  display: inline-block;
}
.chzn-single.chzn-single-with-deselect.et2_country-select span.img {
  top: -4px;
  color: transparent;
}
.chzn-container-single.chzn-container-active.chzn-with-drop:hover {
  transition: none;
}
/**
 * EGroupware: Stylite Pixelegg template
 *
 * lettersearch
 *
 * Please do NOT change css-files directly, instead change less-files and compile them!
 *
 * @link http://www.egroupware.org
 * @license http://opensource.org/licenses/gpl-license.php GPL - GNU General Public License
 * @author Stefan Reinhard <stefan.reinhard@pixelegg.de>
 * @package pixelegg
 * @version $Id: layout_table.less 3089 2014-06-11 14:02:57Z pixelegg $
 */
/**
* Clientside Javascript error-log
*/
#topmenu_info_error {
  width: 16px;
  cursor: pointer;
}
div.client_error_log {
  max-height: 50ex;
}
div.client_error_log tbody {
  vertical-align: top;
}
div.client_error_log tr.hidden td > div {
  max-height: 2ex;
  max-width: 40ex;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
div.client_error_log tr td.timestamp > div {
  text-wrap: none;
  white-space: normal;
  width: 27ex;
}
div.client_error_log tr.hidden td.stack > div {
  text-indent: 100%;
}
div.client_error_log tr td.stack > div {
  white-space: pre;
}
/**
 * EGroupware: CSS with less preprocessor
 *
 * Definitions for content-elements
 *
 * Please do NOT change css-files directly, instead change less-files and compile them!
 *
 * @link http://www.egroupware.org
 * @license http://opensource.org/licenses/gpl-license.php GPL - GNU General Public License
 * @author Stefan Reinhardt <stefan.reinhardt@pixelegg.de>
 * @package pixelegg
 * @version $Id$
 */
/* #######################################################################################
*
*
* Inhaltselemente
*
*
* ########################################################################################
*/
body,
textarea,
button {
  font-family: Verdana, "Lucida Grande", Helvetica, Sans-Serif;
}
#egw_fw_basecontainer {
  position: fixed;
  width: 100%;
  height: 100%;
  padding: 0px;
  margin: 0px;
  font-family: Verdana, "Lucida Grande", Helvetica, Sans-Serif;
  background-color: #ffffff;
}
input {
  /*    .Complete_Button_input;
    .basefontfamily;
    &:hover{.Complete_Button_input_hover;}
    &:focus{.Complete_Button_input_focus;}*/
}
select,
.et2_selectbox.select-cat {
  margin: 0;
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  border-radius: 3px;
}
select:hover,
.et2_selectbox.select-cat:hover {
  -webkit-box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.6);
  -moz-box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.6);
  box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.6);
}
select:focus,
.et2_selectbox.select-cat:focus {
  outline: 0;
  border-width: 1px;
  border-style: solid;
  border-color: #B4B4B4;
  -webkit-box-shadow: 0 0 2px 1px rgba(0, 0, 0, 0.1);
  -moz-box-shadow: 0 0 2px 1px rgba(0, 0, 0, 0.1);
  box-shadow: 0 0 2px 1px rgba(0, 0, 0, 0.1);
}
:hover {
  -webkit-transition: all 0.2s ease-out;
  -moz-transition: all 0.2s ease-out;
  -o-transition: all 0.2s ease-out;
  transition: all 0.2s ease-out;
}
p {
  font-size: 1em;
}
div.selectbox-wrapper ul {
  list-style-type: none;
  margin: 0px;
  padding: 0px;
}
div.selectbox-wrapper ul li.selected {
  background-color: #EAF2FB;
}
div.selectbox-wrapper ul li.current {
  background-color: #CDD8E4;
}
div.selectbox-wrapper ul li {
  list-style-type: none;
  display: block;
  margin: 0;
  padding: 2px;
  cursor: pointer;
}
select {
  position: relative;
  padding-right: 20px !important;
  -webkit-appearance: none;
  -moz-appearance: none;
  margin: 0;
  background: #ffffff url(../images/selectarrowdown.png) no-repeat center right;
  background-size: 16px auto;
}
/*IE has no appearance but we can remove arrows by ms-expand*/
select::-ms-expand {
  display: none;
}
select,
input,
button {
  color: #000000;
  /*font-size:99%;*/
  padding-top: 4px;
  padding-bottom: 4px;
  padding-right: 0;
  border-width: 1px;
  border-style: solid;
  border-color: #E6E6E6;
}
a:link,
a:visited,
select,
input,
textarea {
  color: #26537C;
}
a:link,
a:visited {
  cursor: pointer;
  color: #26537C;
  text-decoration: none;
}
a:hover,
a:active {
  cursor: pointer;
  color: rgba(38, 83, 124, 0.6);
  text-decoration: underline;
}
.divLoginboxHeader,
.divSideboxHeader,
a.appTitles,
.appTitles,
a.textSidebox,
.textSidebox,
#fmStatusBar {
  font-size: 90%;
}
.prefSection {
  font-weight: bold;
  font-size: 145%;
  line-height: 40px;
}
#divAppboxHeader {
  line-height: 28px;
  font-size: 125%;
  font-weight: bold;
  color: #666666;
}
#divGenTime,
#divPoweredBy {
  font-size: 80%;
  color: #ff0000;
}
#divPoweredBy {
  color: #000000;
}
#sideboxdragarea {
  z-index: 100;
  position: absolute;
  left: 0px;
  top: 105px;
}
#menu2handle {
  padding-top: 10px;
}
#menu1close {
  position: absolute;
  right: 7px;
  top: 7px;
}
hr.clearer {
  clear: both;
  height: 20px;
  width: 100%;
  background-color: #ffc200;
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  border-radius: 3px;
  border: 1px solid #000000;
}
/**
* table_passord_change
*/
table.table_passord_change {
  margin: 1em;
}
table.table_passord_change tr {
  height: 50px;
}
table.table_passord_change td:first-child {
  padding-right: 4em;
}
/**
 * EGroupware: Stylite Pixelegg template
 *
 * lettersearch
 *
 * Please do NOT change css-files directly, instead change less-files and compile them!
 *
 * @link http://www.egroupware.org
 * @license http://opensource.org/licenses/gpl-license.php GPL - GNU General Public License
 * @author Stefan Reinhard <stefan.reinhard@pixelegg.de>
 * @package pixelegg
 * @version $Id: layout_table.less 3089 2014-06-11 14:02:57Z pixelegg $
 */
div.dhtmlxMenu_egw_SubLevelArea_Polygon {
  background: white;
  border: 1px solid transparent;
  border-radius: 2px;
}
div.dhtmlxMenu_egw_SubLevelArea_Polygon table.dhtmlxMebu_SubLevelArea_Tbl tr.sub_item td.sub_item_hk div.sub_item_hk {
  color: #373f3f;
}
div.dhtmlxMenu_egw_SubLevelArea_Polygon table.dhtmlxMebu_SubLevelArea_Tbl tr.sub_item_selected {
  background-color: rgba(153, 204, 255, 0.4) !important;
  background-image: none !important;
}
div.dhtmlxMenu_egw_SubLevelArea_Polygon table.dhtmlxMebu_SubLevelArea_Tbl div.sub_sep {
  border-top: 1px solid #E6E6E6;
}
/**
 * EGroupware: Stylite Pixelegg template
 *
 * dialog

 * define every dialog box in egw
 * even popup or jquery
 *
 * Please do NOT change css-files directly, instead change less-files and compile them!
 *
 * @link http://www.egroupware.org
 * @license http://opensource.org/licenses/gpl-license.php GPL - GNU General Public License
 * @author Stefan Reinhard <stefan.reinhard@pixelegg.de>
 * @package pixelegg
 * @version $Id$
 */
/*body {
    background-color: @gray_0;
    background-image: url(../images/bgDialog.png);
    background-repeat: repeat-x;
}*/
div#popupMainDiv {
  padding: 8px;
  background-color: #FFFFFF;
  background-repeat: repeat-x;
}
div#popupMainDiv > * {
  margin: 0px;
}
form.et2_container {
  padding: 0;
}
form.et2_container div table.et2_grid tbody tr .row td .et2_box_widget input {
  margin: 4px 5px 4px 0;
  -webkit-border-top-right-radius: 3px;
  -webkit-border-bottom-right-radius: 3px;
  -webkit-border-bottom-left-radius: 3px;
  -webkit-border-top-left-radius: 3px;
  -moz-border-radius-topright: 3px;
  -moz-border-radius-bottomright: 3px;
  -moz-border-radius-bottomleft: 3px;
  -moz-border-radius-topleft: 3px;
  border-top-right-radius: 3px;
  border-bottom-right-radius: 3px;
  border-bottom-left-radius: 3px;
  border-top-left-radius: 3px;
  /*.background-clip(padding-box);*/
}
form.et2_container div table.et2_grid tbody tr .row td .et2_box_widget input.hasDatepicker {
  background-image: url("../images/datepopup.png");
}
form.et2_container div table.et2_grid tbody tr .row td .et2_box_widget input.hasDatepicker:hover {
  cursor: pointer;
}
form.et2_container div table.et2_grid tbody tr td .et2_tabbox .et2_tabs table.et2_grid {
  background-color: #ffffff;
}
.high {
  border-top: 5px solid #E6E6E6;
  border-bottom: 5px solid #E6E6E6 !important;
}
/*Main div*/
table.dialog-main-view {
  width: 100%;
}
/*###########################################
#                                           #
#     dialogHeader                 app-img  #
#############################################
#                                           #
#     dialogHeader2                         #
#############################################
#                                           #
#     dialogHeader3                         #
#############################################
#                                           #
#     dialogHeader4                         #
#############################################
#                                           #
#                                           #
#                                           #
#                                           #
#                                           #
#    main + tabs                            #
#                                           #
#                                           #
#############################################
#   dialogOperators                        #
#############################################
#                                           #
#  button | button | button         delete  #
##############################################*/
/*** dialogHeader on a box not table ***/
/**********    Header Part ********************/
.dialogHeader {
  color: #000000;
  border-bottom: 3px solid #696969;
}
.dialogHeader img[src*="navbar"] {
  padding: 0 0 0 15px;
}
.dialogHeader input[type="radio"],
.dialogHeader input.et2_radiobox {
  -webkit-appearance: none;
  border: none;
}
.dialogHeader table.et2_grid {
  border-top: none;
}
.dialogHeader table.et2_grid .th {
  background-color: #0C5DA5 !important;
}
.dialogHeader table.et2_grid tr {
  height: 30px;
}
.dialogHeader table.et2_grid td {
  padding: 0px 0px 0px 3px;
  color: #000000;
}
.dialogHeader table.et2_grid table.et2_grid label.et2_label span.et2_selectbox li {
  float: left;
}
.dialogHeader input.et2_textbox {
  font-size: 1.3em;
}
.dialogHeader .et2_label {
  color: #000000;
  vertical-align: middle;
  padding: 0px 0px 0px 0px !important;
  /*margin-right: 57px;*/
  margin: 0px important;
  font-size: 1em;
  text-align: right;
}
.dialogHeader td.space span img {
  background: #FFFFFF;
  border: 2px solid #FFFFFF;
  /*filter grey*/
  filter: url("data:image/svg+xml;utf8,<svg xmlns=\'http://www.w3.org/2000/svg\'><filter id=\'grayscale\'><feColorMatrix type=\'matrix\' values=\'0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0 0 0 1 0\'/></filter></svg>#grayscale");
  /* Firefox 10+, Firefox on Android */
  -webkit-filter: grayscale(100%);
  -moz-filter: grayscale(100%);
  -ms-filter: grayscale(100%);
  -o-filter: grayscale(100%);
  filter: grayscale(100%);
  /*filter: url(grayscale.svg);  Firefox 4+ */
  filter: gray;
  /* IE 6-9 */
}
/**********    Header Row2 - 4 ********************/
tr.dialogHeader2,
tr.dialogHeader3,
tr.dialogHeader4 {
  vertical-align: middle;
}
tr.dialogHeader2 .et2_label,
tr.dialogHeader3 .et2_label,
tr.dialogHeader4 .et2_label {
  color: #1a1a1a;
  vertical-align: middle;
  font-size: 1em;
}
/************* Tabs  *********************************/
/**
 * Tabs widget
 */
.et2_tabheader {
  padding-left: 0em;
  margin: 0;
  background-image: none;
  background-color: #FFFFFF;
}
.et2_tabheader :first-child {
  margin-left: 0px;
}
.et2_tabflag {
  border: none;
}
.et2_tabflag,
.etemplate_tab > div,
.etemplate_tab_active > div {
  margin: 1em 5px -1px 0;
  padding: 4px;
  background-color: white;
  -webkit-user-select: none;
  -moz-user-select: none;
  user-select: none;
  min-width: 73px;
  border-bottom: 3px solid #E6E6E6;
  margin-bottom: -3px;
}
.et2_tabflag:hover,
.etemplate_tab > div:hover,
.etemplate_tab_active > div:hover {
  background-color: rgba(153, 204, 255, 0.4);
  border: none;
  border-bottom: 3px solid #696969;
  border-top-left-radius: 5px;
  border-top-right-radius: 5px;
}
td.etemplate_tab_active.th {
  background-color: transparent;
}
.et2_tabflag.active,
.etemplate_tab_active > div {
  border-spacing: 0px;
  background-color: white;
  color: #000000;
  border-bottom: 3px solid #696969;
  margin-bottom: -3px;
}
.et2_tabflag.active:hover,
.etemplate_tab_active > div:hover {
  color: #000000;
  background-color: white;
}
.et2_tabs,
.tab_body {
  border: none;
  border-bottom: 1px solid #E6E6E6;
  border-top: 1px solid #E6E6E6;
  padding: 5px;
  background-color: #FFFFFF;
  margin-bottom: 11px;
  margin-top: 3px;
  padding-top: 15px;
}
.tab_body {
  border-top-width: 1px;
}
.tab_body img {
  /*filter grey*/
  /*filter grey*/
  filter: url("data:image/svg+xml;utf8,<svg xmlns=\'http://www.w3.org/2000/svg\'><filter id=\'grayscale\'><feColorMatrix type=\'matrix\' values=\'0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0 0 0 1 0\'/></filter></svg>#grayscale");
  -webkit-filter: grayscale(100%) brightness(100%) contrast(1%) saturate(0%);
  -moz-filter: grayscale(100%) brightness(100%) contrast(1%) saturate(0%);
  -ms-filter: grayscale(100%) brightness(100%) contrast(1%) saturate(0%);
  -o-filter: grayscale(100%) brightness(100%) contrast(1%) saturate(0%);
  filter: grayscale(100%) brightness(100%) contrast(1%) saturate(0%);
  /*filter: url(grayscale.svg);  Firefox 4+ */
  filter: gray;
  /* IE 6-9 */
}
div#etemplate\.tab_widget {
  margin-bottom: 11px;
}
/************* Main  **********************************/
.dialogMainTimeframe div {
  min-height: 100px;
}
/**********    Operators *******************************/
/*#############################################
#   dialogOperators                        #
#############################################*/
.dialogOperators {
  border-top: 0px solid #E6E6E6;
  border-bottom: 0px solid #E6E6E6;
}
.dialogOperators td {
  padding: 2px 2px;
}
.dialogOperators .et2_label {
  margin-left: 6px;
  display: inline-block;
}
/**********    Footer  *******************************/
/*#############################################*/
/*#  Toolbar                                  #*/
/*#  button | button | button         delete  #*/
/*##############################################*/
.dialogFooterToolbar {
  background-color: transparent;
  margin: 10px 0 0 0;
  padding: 3px;
  white-space: nowrap;
  border-top: 3px solid #696969;
  padding-top: 8px !important;
  /*.et2_selectbox {height: 32px; top: 0px; font-size: 1em;}*/
}
.dialogFooterToolbar td {
  padding: 0px 5px 0px 0px;
}
.dialogFooterToolbar td:first-child {
  padding-left: 5px;
}
.dialogFooterToolbar button {
  min-width: 86px;
  height: 24px;
  border-radius: 3px;
  border: 1px solid silver;
}
.dialogFooterToolbar button:hover {
  height: 24px;
}
.dialogFooterToolbar button:action {
  height: 24px;
}
.dialogFooterToolbar button[id="addressbook-edit_button[delete]"] {
  float: right;
}
.dialogFooterToolbar div.et2_hbox {
  white-space: normal;
}
.dialogFooterToolbar div.et2_box_widget {
  white-space: nowrap;
}
.dialogFooterToolbar label.et2_label {
  white-space: nowrap;
}
.dialogFooterToolbar input.et2_checkbox {
  top: 0px;
}
/*Dialog Calendar - Resourcen suchen*/
div#divMain {
  padding: 1em;
}
div#divMain img {
  width: 16px;
  height: 16px;
}
div#divMain input[type*="image"] {
  width: 16px;
  height: 16px;
}
/**
 * admin - site configuration
 */
div.admin-config form > table {
  width: 100%;
  padding: 5px;
}
div.admin-config form > table tr.th td {
  font-size: 110%;
  font-weight: bold;
  padding-top: 5px;
  padding-bottom: 5px;
}
div.admin-config form > table td {
  padding-left: 5px;
  border-bottom: 1px solid #e0e0e0;
}
div.admin-config form > table td b {
  font-weight: bold;
}
/**
 * Styles for different egw_message-types
 */
.success_message,
.warning_message,
.error_message {
  font-weight: normal;
  text-align: left;
  margin-left: 5px;
  padding-left: 20px;
  white-space: pre-wrap;
}
.warning_message {
  border-top: 6px solid rgba(255, 204, 0, 0.9) !important;
}
.error_message {
  border-top: 6px solid rgba(204, 0, 51, 0.8) !important;
  background-image: url(../images/dialog_error.png);
  background-position: 4px 13px;
  background-size: 12px;
  background-repeat: no-repeat;
}
.info_message .discard {
  float: right;
  margin-top: 4px;
}
/**
 * Message in popup
 */
body > div#egw_message {
  background-color: #E6E6E6;
  right: 33%;
  box-shadow: 2px 3px 13px #666666;
  -moz-box-shadow: 2px 3px 13px #666666;
  -webkit-box-shadow: 2px 3px 13px #666666;
  -khtml-box-shadow: 2px 3px 13px #666666;
  top: 0px;
  padding: 13px;
  padding-left: 20px;
  min-width: 130px;
  z-index: 100000;
  margin: 0px auto;
  max-width: 90%;
  white-space: pre-wrap;
  border-top: 6px solid #33CC66;
}
/**
 * Less-file for egroupware
 * Definitionen Layout
 * Raster
 *
 * Version 08.2013
 * Author Stefan Reinhardt, Wolfgang Ott
 *
 */
/* #################################################
* FOOTER
* ##################################################
*/
#egw_fw_footer {
  position: fixed;
  bottom: 0px;
  width: 50%;
  text-align: left;
  padding: 3px;
  clear: both;
  opacity: 1;
  z-index: 100;
  color: #828282;
}
#egw_fw_footer a {
  color: #696969;
}
#egw_fw_footer:hover {
  opacity: 0.1;
  transition: opacity 0.5s ease-out;
  -moz-transition: opacity 0.5s ease-out;
  -webkit-transition: opacity;
}
/**
 * EGroupware: Stylite Pixelegg template
 *
 * lettersearch
 *
 * Please do NOT change css-files directly, instead change less-files and compile them!
 *
 * @link http://www.egroupware.org
 * @license http://opensource.org/licenses/gpl-license.php GPL - GNU General Public License
 * @author Stefan Reinhard <stefan.reinhard@pixelegg.de>
 * @package pixelegg
 * @version $Id: layout_table.less 3089 2014-06-11 14:02:57Z pixelegg $
 */
h1 {
  font-size: 200%;
  /*line-height: 330%;*/
  margin: 0.4em 0 0;
  font-weight: normal;
}
.headline_h1 {
  font-size: 200%;
  /*line-height: 330%;*/
  margin: 0.4em 0 0;
}
h2 {
  font-size: 150%;
  /*line-height: 270%;*/
  margin: 0.6em 0 0;
}
.headline_h2 {
  font-size: 150%;
  /*line-height: 270%;*/
  margin: 0.6em 0 0;
  font-weight: lighter;
}
h3 {
  font-size: 130%;
  /*line-height: 220%;*/
  margin: 0.8571em 0 0;
}
.headline_h3 {
  font-size: 130%;
  /*line-height: 220%;*/
  margin: 0.8571em 0 0;
}
h3 a {
  color: #999999;
}
h4 {
  font-size: 110%;
  /*line-height: 160%;*/
  margin: 1.125em 0 0;
}
.headline_h4 {
  font-size: 110%;
  /*line-height: 160%;*/
  margin: 1.125em 0 0;
}
h5 {
  font-size: 100%;
  /*line-height: 110%;*/
  margin: 1.2857em 0 0;
}
.headline_h5 {
  font-size: 100%;
  /*line-height: 110%;*/
  margin: 1.2857em 0 0;
}
h6 {
  font-size: 100%;
  font-weight: bold;
  /*line-height: 100%;*/
  margin: 1.5em 0 0;
}
.headline_h6 {
  font-size: 100%;
  font-weight: bold;
  /*line-height: 100%;*/
  margin: 1.5em 0 0;
}
/**
 * EGroupware: Stylite Pixelegg template
 *
 * lettersearch
 *
 * Please do NOT change css-files directly, instead change less-files and compile them!
 *
 * @link http://www.egroupware.org
 * @license http://opensource.org/licenses/gpl-license.php GPL - GNU General Public License
 * @author Stefan Reinhard <stefan.reinhard@pixelegg.de>
 * @package pixelegg
 * @version $Id$
 */
table.nextmatch_lettersearch {
  margin-bottom: 6px;
}
.lettersearch {
  border: 1px solid #E6E6E6;
  background: #f8f8f8;
  text-align: center;
  cursor: pointer;
}
.lettersearch:hover {
  background-color: #b3b3b3 !important;
  color: #ffffff;
}
.lettersearch_active {
  border: 1px solid #E6E6E6;
  background: #f8f8f8;
  text-align: center;
  cursor: pointer;
  background-color: #b3b3b3 !important;
  font-weight: bold;
}
td.lettersearch {
  background-image: none;
  width: 3%;
}
/*.nextmatch_header table {
        border: none !important;
        width: 99% !important;
}*/
/**
 * EGroupware: CSS with less preprocessor
 *
 * et2 Messages
 *
 * Please do NOT change css-files directly, instead change less-files and compile them!
 *
 * @link http://www.egroupware.org
 * @license http://opensource.org/licenses/gpl-license.php GPL - GNU General Public License
 * @author Stefan Reinhardt <stefan.reinhardt@pixelegg.de>
 * @package pixelegg
 * @version $Id$
 */
#egwpopup {
  top: 46px;
  right: 0px !important;
  left: auto !important;
  height: calc(100% - 69px);
  width: 277px !important;
  position: absolute;
  background: white;
  border: 1px solid silver;
  border-top: none;
  border-bottom: none;
  padding: 1em;
  /*Button*/
}
#egwpopup input#egwpopup_ok_button,
#egwpopup button#desktop_perms {
  /*.border_normal;*/
  /*.box_shadow_standard_light;*/
  /*.rounded (3px);*/
  color: #000000;
  -webkit-appearance: none;
  -webkit-transition-property: background-color;
  -moz-transition-property: background-color;
  -o-transition-property: background-color;
  transition-property: background-color;
  -webkit-transition-duration: 0.5s;
  -moz-transition-duration: 0.5s;
  -o-transition-duration: 0.5s;
  transition-duration: 0.5s;
  -webkit-transition-timing-function: linear;
  -moz-transition-timing-function: linear;
  -o-transition-timing-function: linear;
  transition-timing-function: linear;
  background-color: #E6E6E6;
  height: 24px;
  padding: 0 5px;
}
#egwpopup input#egwpopup_ok_button:hover,
#egwpopup button#desktop_perms:hover {
  -webkit-box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.6);
  -moz-box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.6);
  box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.6);
  background-color: inherit;
}
#egwpopup input#egwpopup_ok_button:active,
#egwpopup button#desktop_perms:active {
  background-color: #b3e4a6 !important;
}
#egwpopup #egwpopup_list::-webkit-scrollbar-track {
  -webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3);
  background-color: #fafafa;
}
#egwpopup #egwpopup_list::-webkit-scrollbar {
  width: 4px;
  background-color: #fafafa;
}
#egwpopup #egwpopup_list::-webkit-scrollbar-thumb {
  background-color: #6a6f71;
}
#egwpopup #egwpopup_list {
  overflow-y: auto;
  height: calc(100% - 52px);
}
#egwpopup #egwpopup_list .egwpopup_time_label {
  width: 100%;
  color: #fafafa;
  text-align: center;
  font-style: italic;
  opacity: 0.5;
  font-size: 10pt;
  background: #255ea5;
  font-weight: bold;
}
#egwpopup #egwpopup_list span.egwpopup_delete {
  display: inline-block;
  float: right;
  width: 24px;
  height: 24px;
  background-image: url(../images/delete.svg);
  background-repeat: no-repeat;
  background-position: center;
  background-size: 12px;
  cursor: pointer;
}
#egwpopup #egwpopup_list .egwpopup_mark {
  display: inline-block;
  float: right;
  width: 10px;
  height: 10px;
  border: 1px solid #b9436c;
  border-radius: 50%;
  margin: 7px;
  background: #b9436c;
  cursor: pointer;
}
#egwpopup #egwpopup_list .egwpopup_message {
  height: auto;
  overflow: hidden;
  padding: 10px;
  background-color: #fafafa;
  margin-bottom: 5px;
}
#egwpopup #egwpopup_list .egwpopup_message:hover {
  background-color: rgba(103, 159, 210, 0.2);
}
#egwpopup #egwpopup_list .egwpopup_message .egwpopup_message_inner_container {
  height: 63px;
  overflow: hidden;
}
#egwpopup #egwpopup_list .egwpopup_message .egwpopup_message_top_toolbar {
  display: inline-block;
  width: 100%;
}
#egwpopup #egwpopup_list .egwpopup_message .egwpopup_message_top_toolbar .egwpopup_message_date {
  float: left;
  color: #767676;
}
#egwpopup #egwpopup_list .egwpopup_message .egwpopup_message_top_toolbar .egwpopup_message_open {
  display: inline-block;
  float: right;
  width: 24px;
  height: 24px;
  background-image: url(../images/search.svg);
  background-repeat: no-repeat;
  background-position: center;
  background-size: 12px;
  cursor: pointer;
}
#egwpopup #egwpopup_list .egwpopup_message .egwpopup_message_top_toolbar .egwpopup_collapse {
  display: none;
}
#egwpopup #egwpopup_list .egwpopup_message .egwpopup_actions_container {
  text-align: center;
}
#egwpopup #egwpopup_list .egwpopup_message .egwpopup_actions_container > button {
  height: 24px;
  width: 80px;
  border: none;
  background: #e6e6e6;
  background-size: 16px;
  background-position: 12px center;
  background-repeat: no-repeat;
  padding-left: 26px;
}
#egwpopup #egwpopup_list .egwpopup_message .egwpopup_message_more_info {
  color: #767676;
  padding-top: 5px;
  padding-bottom: 5px;
}
#egwpopup #egwpopup_list .egwpopup_message span.egwpopup_nav_prev,
#egwpopup #egwpopup_list .egwpopup_message span.egwpopup_nav_next {
  display: none;
}
#egwpopup #egwpopup_list .egwpopup_message.egwpopup_expanded {
  position: fixed;
  top: 85px;
  height: calc(100% - 130px);
  left: 20vw;
  width: 60vw;
  box-shadow: 0 0 40px #666;
  overflow: auto;
}
#egwpopup #egwpopup_list .egwpopup_message.egwpopup_expanded:hover {
  background-color: #fafafa;
}
#egwpopup #egwpopup_list .egwpopup_message.egwpopup_expanded .egwpopup_message_inner_container {
  height: calc(100% - 62px);
  overflow: auto;
}
#egwpopup #egwpopup_list .egwpopup_message.egwpopup_expanded .egwpopup_collapse {
  float: right;
  width: 24px;
  height: 24px;
  background-image: url(../images/close.svg);
  background-repeat: no-repeat;
  background-position: center;
  background-size: 12px;
  cursor: pointer;
  display: inline-block;
}
#egwpopup #egwpopup_list .egwpopup_message.egwpopup_expanded .egwpopup_message_more_info {
  display: none;
}
#egwpopup #egwpopup_list .egwpopup_message.egwpopup_expanded span.egwpopup_nav_prev {
  display: inline-block;
  float: right;
  width: 24px;
  height: 24px;
  background-image: url(../images/back.png);
  background-repeat: no-repeat;
  background-position: center;
  background-size: 16px;
  cursor: pointer;
}
#egwpopup #egwpopup_list .egwpopup_message.egwpopup_expanded .egwpopup_nav_disable {
  opacity: 0.5;
  pointer-events: none;
}
#egwpopup #egwpopup_list .egwpopup_message.egwpopup_expanded span.egwpopup_nav_next {
  display: inline-block;
  float: right;
  width: 24px;
  height: 24px;
  background-image: url(../images/forward.png);
  background-repeat: no-repeat;
  background-position: center;
  background-size: 16px;
  cursor: pointer;
}
#egwpopup #egwpopup_list .egwpopup_message_seen .egwpopup_mark {
  cursor: auto;
  background: none;
  border-color: #666c6e;
}
#egwpopup #egwpopup_list .egwpopup_message_clone {
  border: 2px dashed silver;
  opacity: 0.3;
  height: 125px;
}
#egwpopup div#egwpopup_header {
  font-size: 16px;
  color: silver;
  text-align: center;
  padding: 15px;
}
#egwpopup div#egwpopup_header .egwpopup_seenall {
  float: right;
  width: 10px;
  height: 10px;
  border: 1px solid silver;
  border-radius: 50%;
  cursor: pointer;
  margin: 4px 0px 0px 0px;
}
#egwpopup div#egwpopup_header .egwpopup_seenall:hover {
  border-color: gray;
  background: rgba(103, 159, 210, 0.2);
}
#egwpopup div#egwpopup_header .egwpopup_deleteall {
  background-image: url(../images/delete.svg);
  width: 12px;
  height: 12px;
  background-position: center;
  background-size: 12px;
  float: right;
  background-repeat: no-repeat;
  margin-right: 15px;
  margin-top: 4px;
  cursor: pointer;
  display: inline-block;
  opacity: 0.5;
}
#egwpopup div#egwpopup_header .egwpopup_deleteall:hover {
  opacity: 1;
}
/*popup Messsage*/
div#egwpopup_message {
  background-color: .color_gray_0;
  padding: 1em;
  overflow-y: auto;
}
#msg,
.message {
  color: red;
  font-style: italic;
  background: #FFFFFF;
}
.egw_fw_ui_app_header_container {
  height: auto;
}
.egw_fw_ui_app_header_container .egw_fw_ui_app_header {
  padding: 1px 0 0 0;
  font-weight: normal;
  color: silver;
  overflow: hidden;
  height: 15px;
}
.colselection.ui-widget-content {
  width: 33%;
}
/*Calendar ##############*/
td.message {
  background-color: #E6E6E6 !important;
  height: 0px;
  padding: 0px;
}
td.message span.message {
  height: 35px;
  border-bottom: 2px solid #E6E6E6;
  color: red;
  background: #E6E6E6;
  height: auto;
  width: 100%;
}
.button_right_toggle {
  height: 32px;
  width: 32px;
  cursor: pointer;
  position: relative;
  margin-top: 1px;
  margin-left: -20px;
  float: left;
}
.button_right_toggle:after {
  content: "";
  position: absolute;
  left: 13px;
  top: 5px;
  width: 10px;
  height: 2px;
  background-color: silver;
  backface-visibility: hidden;
  border-radius: 6px;
  transform: rotate(145deg) translate(8px, -1px);
  -ms-transform: rotate(145deg) translate(8px, -1px);
  -moz-transform: rotate(145deg) translate(8px, -1px);
  -webkit-transform: rotate(145deg) translate(8px, -1px);
}
.button_right_toggle:before {
  content: "";
  position: absolute;
  left: 0px;
  top: 0px;
  width: 10px;
  height: 2px;
  background-color: silver;
  backface-visibility: hidden;
  border-radius: 6px;
  transform: rotate(45deg) translate(8px, -2px);
  -ms-transform: rotate(45deg) translate(8px, -2px);
  -moz-transform: rotate(45deg) translate(8px, -2px);
  -webkit-transform: rotate(45deg) translate(8px, -2px);
}
.button_right_toggle:hover:before,
.button_right_toggle:hover:after {
  background-color: gray;
}
/**
 * EGroupware: Stylite Pixelegg template
 *
 * lettersearch
 *
 * Please do NOT change css-files directly, instead change less-files and compile them!
 *
 * @link http://www.egroupware.org
 * @license http://opensource.org/licenses/gpl-license.php GPL - GNU General Public License
 * @author Stefan Reinhard <stefan.reinhard@pixelegg.de>
 * @package pixelegg
 * @version $Id: layout_table.less 3089 2014-06-11 14:02:57Z pixelegg $
 */
/*z.b. Dateimanager overlay*/
.egwGridView_grid span.iconOverlayContainer {
  margin: 2px 5px 2px 2px;
  position: relative;
  -moz-user-select: none;
  -khtml-user-select: none;
  user-select: none;
  overflow: visible;
  display: inline-block;
}
.egwGridView_grid span.overlayContainer {
  position: absolute;
  right: -2px;
  bottom: -2px;
  vertical-align: bottom;
  text-align: right;
}
.egwGridView_grid span.iconContainer {
  display: inline-block;
  padding: 0;
  margin: 0;
  text-align: center;
}
.egwGridView_grid span.overlayContainer img.overlay {
  position: relative;
  top: 1px;
  margin: 0;
  padding: 0;
  height: 9px;
  width: 11px;
}
/**
 * EGroupware: Stylite Pixelegg template
 *
 * Definitions for layout and raster
 *
 * Please do NOT change css-files directly, instead change less-files and compile them!
 *
 * @link http://www.egroupware.org
 * @license http://opensource.org/licenses/gpl-license.php GPL - GNU General Public License
 * @author Stefan Reinhardt <stefan.reinhardt@pixelegg.de>
 * @package pixelegg
 * @version $Id$
 */
/* #################################################
 * Basecontainer
 * #################################################
 */
.egw_fw_content_browser_iframe,
#divMainView {
  margin: 0;
}
.egw_fw_content_browser_iframe body,
#divMainView body {
  background-color: #ffffff;
}
.egwGridView_scrollarea {
  width: 100%;
  overflow-x: hidden;
}
/**
 * EGroupware: Stylite Pixelegg template
 *
 * Definitions for layout and raster
 *
 * Please do NOT change css-files directly, instead change less-files and compile them!
 *
 * @link http://www.egroupware.org
 * @license http://opensource.org/licenses/gpl-license.php GPL - GNU General Public License
 * @author Stefan Reinhardt <stefan.reinhardt@pixelegg.de>
 * @package pixelegg
 * @version $Id: layout_raster.less 3170 2014-07-16 11:24:38Z pixelegg $
 */
/*
    Created on : 23.07.2014, 13:25:11
    Author     : stefanreinhardt
*/
#egw_fw_header {
  width: 100%;
  float: left;
  position: absolute;
  border-bottom: 1px solid silver;
  /* Logo EGW or Company - left top*/
  /*  ###########################################################################################################################################
    Topmenu / Home / Einstellungen / Zugriff / Kategorien usw..
    ###########################################################################################################################################
*/
}
#egw_fw_header #egw_divLogo {
  float: left;
  width: 255px;
  display: block;
  margin-left: -8px;
  text-align: center;
  height: 45px;
  /*.background_color_5_gray;*/
}
#egw_fw_header #egw_divLogo img {
  max-width: 209px;
  border: none;
  position: absolute;
  top: 0.1em;
  left: 1em;
  height: 40px;
  /*.background_color_5_gray;*/
}
#egw_fw_header #egw_fw_topmenu ul,
#egw_fw_header #egw_fw_topmenu > * > ul > li,
#egw_fw_header .topmenu_info_item,
#egw_fw_header #egw_fw_topmenu_items,
#egw_fw_header #egw_fw_topmenu_info_items {
  display: inline;
}
#egw_fw_header #egw_fw_topmenu {
  position: absolute;
  display: none;
  right: 5px;
  width: 230px;
  z-index: 1000;
  top: 46px;
  background: white;
  box-shadow: 2px 3px 13px #666666;
  -moz-box-shadow: 2px 3px 13px #666666;
  -webkit-box-shadow: 2px 3px 13px #666666;
  -khtml-box-shadow: 2px 3px 13px #666666;
}
#egw_fw_header #egw_fw_topmenu a.powered_by {
  width: calc(100% - 20px);
  display: inline-block;
  padding: 10px;
  background-color: #fbfbfb;
}
#egw_fw_header #egw_fw_topmenu #egw_fw_topmenu_info_items {
  display: inline-block;
  background: white;
  float: right;
  height: auto;
  padding-left: 10px;
  border-top: 1px solid silver;
}
#egw_fw_header #egw_fw_topmenu #egw_fw_topmenu_info_items .topmenu_info_item {
  overflow: visible;
  display: inline-block;
}
#egw_fw_header #egw_fw_topmenu #egw_fw_topmenu_info_items .topmenu_info_item:nth-child(2) {
  margin-top: 0;
  font-size: 1em;
}
#egw_fw_header #egw_fw_topmenu #egw_fw_topmenu_info_items .topmenu_info_item:nth-child(3) {
  position: relative;
  top: 0px;
  padding-left: 3px;
  display: inline-block;
}
#egw_fw_header #egw_fw_topmenu #egw_fw_topmenu_items {
  padding-top: 14px;
  width: 100%;
  display: block;
  float: right;
  background: white;
  height: auto;
  z-index: 1000;
  top: 45px;
}
#egw_fw_header #egw_fw_topmenu #egw_fw_topmenu_items ul {
  width: 100%;
  padding: 0px;
  display: inline-grid;
  /*Home*/
  /*home*/
  /*Setup / Einstellungen*/
  /*access / Zugriff */
  /*category*/
  /*password*/
  /*help*/
  /*Search*/
  /*logout*/
  /*print*/
}
#egw_fw_header #egw_fw_topmenu #egw_fw_topmenu_items ul li {
  color: #FFFFFF;
  padding: 8px 10px;
  border-top: #E6E6E6;
}
#egw_fw_header #egw_fw_topmenu #egw_fw_topmenu_items ul li:hover {
  background: rgba(153, 204, 255, 0.4);
  color: #FFFFFF;
}
#egw_fw_header #egw_fw_topmenu #egw_fw_topmenu_items ul li a {
  color: #000000;
  text-decoration: none;
  font-size: 12px;
  line-height: 1.5em;
  display: inline-block;
}
#egw_fw_header #egw_fw_topmenu #egw_fw_topmenu_items ul li a:hover {
  text-decoration: none !important;
}
#egw_fw_header #egw_fw_topmenu #egw_fw_topmenu_items ul li:first-child :before {
  border: none;
}
#egw_fw_header #egw_fw_topmenu #egw_fw_topmenu_items ul a#topmenu_home {
  margin-left: 0px;
  background-image: url(../images/topmenu_items/home.svg);
  background-repeat: no-repeat;
  background-size: 16px;
  padding-left: 20px;
}
#egw_fw_header #egw_fw_topmenu #egw_fw_topmenu_items ul a#topmenu_prefs {
  margin-left: 0px;
  background-repeat: no-repeat;
  background-size: 16px;
  padding-left: 20px;
  background-image: url(../images/topmenu_items/setup.svg);
}
#egw_fw_header #egw_fw_topmenu #egw_fw_topmenu_items ul a#topmenu_acl {
  background-repeat: no-repeat;
  background-size: 16px;
  padding-left: 20px;
  background-image: url(../images/topmenu_items/access.svg);
}
#egw_fw_header #egw_fw_topmenu #egw_fw_topmenu_items ul a#topmenu_cats {
  background-repeat: no-repeat;
  background-size: 16px;
  padding-left: 20px;
  background-image: url(../images/topmenu_items/category.svg);
}
#egw_fw_header #egw_fw_topmenu #egw_fw_topmenu_items ul a#topmenu_password {
  background-repeat: no-repeat;
  background-size: 16px;
  padding-left: 20px;
  background-image: url(../images/topmenu_items/password.svg);
}
#egw_fw_header #egw_fw_topmenu #egw_fw_topmenu_items ul a#topmenu_manual {
  background-repeat: no-repeat;
  background-size: 16px;
  padding-left: 20px;
  background-image: url(../images/topmenu_items/help.svg);
}
#egw_fw_header #egw_fw_topmenu #egw_fw_topmenu_items ul a#topmenu_current_user {
  background-repeat: no-repeat;
  background-size: 16px;
  padding-left: 20px;
  background-image: url(../images/users.png);
}
#egw_fw_header #egw_fw_topmenu #egw_fw_topmenu_items ul a#topmenu_logout {
  background-repeat: no-repeat;
  background-size: 16px;
  padding-left: 20px;
  background-image: url(../images/topmenu_items/logout.svg);
}
#egw_fw_header #egw_fw_topmenu #egw_fw_topmenu_items ul a#topmenu_print {
  background-repeat: no-repeat;
  background-size: 16px;
  padding-left: 20px;
  background-image: url(../images/print.svg);
}
/* ###################################################
   Slide Effekt
   ###################################################*/
#egw_fw_topmenu_slide {
  width: auto;
  text-align: center;
  height: 15px;
  float: left;
  position: fixed;
  left: 194px;
}
/*ICON List*/
#egw_fw_topmenu_slide.slidedown {
  background-image: url("../images/list.png");
  background-position: center center;
  height: 15px;
  width: 15px;
  display: block;
  margin-left: 5px;
  margin-top: 10px;
  background-size: 15px 15px;
  float: left;
  position: relative;
  left: -5px;
  cursor: pointer;
}
/*Icon ARROW UP*/
#egw_fw_topmenu_slide.slideup {
  background-image: url("../images/slideup.png");
  background-position: center center;
  height: 15px;
  width: 15px;
  display: block;
  margin-top: -36px;
  margin-left: 40px;
  cursor: pointer;
}
#slidetoggle {
  width: 20px;
  height: 20px;
  display: block;
}
/**
 * EGroupware: Stylite Pixelegg template
 *
 * Definitions for layout and raster
 *
 * Please do NOT change css-files directly, instead change less-files and compile them!
 *
 * @link http://www.egroupware.org
 * @license http://opensource.org/licenses/gpl-license.php GPL - GNU General Public License
 * @author Stefan Reinhardt <stefan.reinhardt@pixelegg.de>
 * @package pixelegg
 * @version $Id: layout_raster.less 3170 2014-07-16 11:24:38Z pixelegg $
 */
/*
    Created on : 23.07.2014, 13:25:11
    Author     : stefanreinhardt
*/
/* ##################################################################################################
*  Main
// ##################################################################################
// ## egw_divLogo ##  Toggle up / down | egw_fw_topmenu                             #
// ##             ##                                                                #
// ##################################################################################
// ##             ##                                                                #
// ##             ##                                                                #
// ##             ##                                                                #
// ##             ##                                                                #
// ##             ##                                                                #
// ##  SIDEBAR    ##             MAIN                                               #
// ##             ##             #egw_fw_main                                       #
// ##             ##                                                                #
// ##             ##                                                                #
// ##             ##                                                                #
/* #####################################################################################################
*/
#egw_fw_basecontainer.egw_fw_sidebar_toggleOn #egw_fw_main #egw_fw_tabs .egw_fw_ui_tabs_header {
  padding-left: 235px;
}
#egw_fw_main {
  padding: 0;
  width: auto;
}
#egw_fw_main #egw_fw_tabs {
  position: relative;
  background-color: transparent;
  float: left;
  width: 100%;
}
#egw_fw_main #egw_fw_tabs .egw_fw_ui_tabs_header {
  margin: 0px 0 0 0;
  padding: 0px 250px 0px 60px;
  background-position: bottom;
  background-repeat: repeat-x;
  background-color: transparent;
  height: 39px;
  /*active Tabs*/
}
#egw_fw_main #egw_fw_tabs .egw_fw_ui_tabs_header h1 {
  display: inline;
  width: 100%;
  text-align: center;
  -webkit-margin-before: 0;
  -webkit-margin-after: 0;
}
#egw_fw_main #egw_fw_tabs .egw_fw_ui_tabs_header img {
  text-align: center;
  float: none;
  margin: 0 auto;
  width: 16px;
  height: 16px;
}
#egw_fw_main #egw_fw_tabs .egw_fw_ui_tabs_header .egw_fw_ui_tab_header {
  padding-left: 0;
  position: relative;
  display: inline-block;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
  margin: 0px 5px 0px 0px;
  padding: 0px 5px 0px 0px;
  cursor: pointer;
  background-repeat: repeat-x;
  height: 100%;
}
#egw_fw_main #egw_fw_tabs .egw_fw_ui_tabs_header .egw_fw_ui_tab_header:hover {
  background-color: rgba(153, 204, 255, 0.4);
  padding-bottom: 0px;
  padding-top: 8px;
  transition: none;
}
#egw_fw_main #egw_fw_tabs .egw_fw_ui_tabs_header .egw_fw_ui_tab_header:hover:not(.egw_fw_ui_tab_header_active) .egw_fw_ui_tab_close_button {
  top: 8px;
  background-image: url(../images/close.svg);
}
#egw_fw_main #egw_fw_tabs .egw_fw_ui_tabs_header .egw_fw_ui_tab_header h1 {
  font-size: 11px;
  line-height: 1em;
  margin: 0 15px 2px 2px;
  vertical-align: super;
}
#egw_fw_main #egw_fw_tabs .egw_fw_ui_tabs_header .egw_fw_ui_tab_header img.egw_fw_ui_tab_icon {
  display: inline-block;
  width: 16px;
  height: 16px;
  margin: 5px 1px 0 1em;
  /*filter grey*/
  filter: url("data:image/svg+xml;utf8,<svg xmlns=\'http://www.w3.org/2000/svg\'><filter id=\'grayscale\'><feColorMatrix type=\'matrix\' values=\'0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0 0 0 1 0\'/></filter></svg>#grayscale");
  -webkit-filter: grayscale(100%) brightness(100%) contrast(1%) saturate(0%);
  -moz-filter: grayscale(100%) brightness(100%) contrast(1%) saturate(0%);
  -ms-filter: grayscale(100%) brightness(100%) contrast(1%) saturate(0%);
  -o-filter: grayscale(100%) brightness(100%) contrast(1%) saturate(0%);
  filter: grayscale(100%) brightness(100%) contrast(1%) saturate(0%);
  /*filter: url(grayscale.svg);  Firefox 4+ */
  filter: gray;
  /* IE 6-9 */
}
#egw_fw_main #egw_fw_tabs .egw_fw_ui_tabs_header .egw_fw_ui_tab_header_active {
  border-left: 1px solid #bfc0bf;
  border-right: 1px solid #bfc0bf;
  border-bottom: 4px solid white !important;
  background-color: #ffffff;
  background-image: none !important;
}
#egw_fw_main #egw_fw_tabs .egw_fw_ui_tabs_header .egw_fw_ui_tab_header_active:hover {
  background-color: #ffffff;
  padding-top: 0px;
}
#egw_fw_main #egw_fw_tabs .egw_fw_ui_tabs_header .egw_fw_ui_tab_header_active img.egw_fw_ui_tab_icon {
  display: inline-block;
  width: 16px;
  height: 16px;
}
#egw_fw_main #egw_fw_tabs .egw_fw_ui_tab_close_button {
  right: 3px;
  top: 1px;
  display: inline-block;
  width: 12px;
  height: 12px;
  margin-left: 0px;
  background-repeat: no-repeat;
  background-position: center;
  background-size: 6px 6px;
  position: absolute;
}
#egw_fw_main .egw_fw_ui_tab_header_hover {
  background-color: rgba(153, 204, 255, 0.4);
}
#egw_fw_main .egw_fw_ui_tab_content {
  width: 100%;
  padding: 0px;
  margin: 0;
  overflow-x: hidden;
  overflow-y: hidden;
}
#egw_fw_main .egw_fw_ui_tab_content > div {
  width: 100%;
  padding: 0 0 0 0;
}
/**
 * EGroupware: Stylite Pixelegg template
 *
 * Definitions for layout and raster
 *
 * Please do NOT change css-files directly, instead change less-files and compile them!
 *
 * @link http://www.egroupware.org
 * @license http://opensource.org/licenses/gpl-license.php GPL - GNU General Public License
 * @author Stefan Reinhardt <stefan.reinhardt@pixelegg.de>
 * @package pixelegg
 * @version $Id: layout_raster.less 3170 2014-07-16 11:24:38Z pixelegg $
 */
/*
    Created on : 23.07.2014, 13:25:11
    Author     : stefanreinhardt
*/
/* ################################################################################################################
 * Sidebar
 * ################################################################################################################*/
#egw_fw_sidebar {
  position: fixed;
  overflow: hidden;
  top: 38px;
  left: 0px;
  bottom: 0px;
  width: 225px;
  /*.background_color_5_gray;*/
  /*#################################*/
}
#egw_fw_sidebar #egw_fw_sidemenu {
  position: absolute;
  top: 1px;
  bottom: 1px;
  left: 0px;
  right: 8px;
  overflow: hidden;
  z-index: 0;
  padding-top: 0.6em;
  font-size: 0.9em;
}
#egw_fw_sidebar #egw_fw_sidemenu .egw_fw_ui_scrollarea_outerdiv {
  background-color: #fafafa;
}
#egw_fw_sidebar #egw_fw_sidemenu .egw_fw_ui_scrollarea_outerdiv div.ui-sortable div {
  padding: 3px 0 1px 3px;
  cursor: pointer;
}
#egw_fw_sidebar #egw_fw_sidemenu .egw_fw_ui_scrollarea_outerdiv .egw_fw_ui_sidemenu_entry_header {
  display: block;
  margin: 0 0;
}
#egw_fw_sidebar #egw_fw_sidemenu .egw_fw_ui_scrollarea_outerdiv .egw_fw_ui_sidemenu_entry_header:hover {
  background-color: rgba(153, 204, 255, 0.4);
}
#egw_fw_sidebar #egw_fw_sidemenu .egw_fw_ui_scrollarea_outerdiv .egw_fw_ui_sidemenu_entry_header:active {
  -webkit-box-shadow: inset 1px 2px 1px rgba(0, 0, 0, 0.5);
  -moz-box-shadow: inset 1px 2px 1px rgba(0, 0, 0, 0.5);
  box-shadow: inset 1px 2px 1px rgba(0, 0, 0, 0.5);
}
#egw_fw_sidebar #egw_fw_sidemenu .egw_fw_ui_scrollarea_outerdiv .egw_fw_ui_sidemenu_entry_header h1 {
  margin: 0 0 10px 0;
  padding-top: 0.4em;
  padding-left: 3em;
  color: #999999;
  /*font-size: 12px;*/
  font-size: 12px;
  line-height: 17px;
}
#egw_fw_sidebar #egw_fw_sidemenu .egw_fw_ui_scrollarea_outerdiv .egw_fw_ui_sidemenu_entry_header object {
  background-color: #FFFFFF;
  width: 24px;
  height: 24px;
}
#egw_fw_sidebar #egw_fw_sidemenu .egw_fw_ui_scrollarea_outerdiv .egw_fw_ui_sidemenu_entry_header_active {
  cursor: pointer;
  background-image: url("../images/clear.png");
  background-position: 95% -3000px;
  background-repeat: no-repeat;
  background-color: #ffffff;
  border-top: solid 1px #B4B4B4;
  border-left: solid 1px #B4B4B4;
  border-right: solid 1px #B4B4B4;
  border-bottom: solid 1px #B4B4B4;
  margin: 0 0 0 0;
  border-bottom: none;
  height: 33px;
}
#egw_fw_sidebar #egw_fw_sidemenu .egw_fw_ui_scrollarea_outerdiv .egw_fw_ui_sidemenu_entry_header_active img {
  padding-left: 9px;
  padding-top: 7px;
  height: 18px;
}
#egw_fw_sidebar #egw_fw_sidemenu .egw_fw_ui_scrollarea_outerdiv .egw_fw_ui_sidemenu_entry_header_active h1 {
  text-transform: uppercase;
  font-size: 1.4em;
  color: #000000;
  padding-top: 0;
  line-height: 33px;
}
#egw_fw_sidebar #egw_fw_sidemenu .egw_fw_ui_scrollarea_outerdiv .egw_fw_ui_sidemenu_entry_header_active:hover img {
  content: url(../images/reload.png);
}
#egw_fw_sidebar #egw_fw_sidemenu .egw_fw_ui_scrollarea_outerdiv .egw_fw_ui_sidemenu_entry_header_active:focus {
  background-image: url("../images/ajax-loader.gif");
  background-repeat: no-repeat;
  background-position: 90% 50%;
  -webkit-box-shadow: inset 1px 2px 1px rgba(0, 0, 0, 0.5);
  -moz-box-shadow: inset 1px 2px 1px rgba(0, 0, 0, 0.5);
  box-shadow: inset 1px 2px 1px rgba(0, 0, 0, 0.5);
  background-color: #bfbfbf;
}
#egw_fw_sidebar #egw_fw_sidemenu .egw_fw_ui_scrollarea_outerdiv .egw_fw_ui_sidemenu_entry_header_active object {
  margin-left: 14px;
  margin-top: 8px;
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  border-radius: 3px;
  width: 16px;
  height: 16px;
}
#egw_fw_sidebar #egw_fw_sidemenu .egw_fw_ui_scrollarea_outerdiv .egw_fw_ui_sidemenu_entry_header_active .egw_fw_ui_ajaxloader {
  margin-top: -26px;
}
#egw_fw_sidebar #egw_fw_sidemenu .egw_fw_ui_scrollarea_outerdiv .egw_fw_ui_sidemenu_entry_content {
  display: block;
  background-image: none;
  border-color: #B4B4B4;
  border-style: solid;
  border-width: 1px;
  margin: 0 0 2em 0;
  /*######################*/
}
#egw_fw_sidebar #egw_fw_sidemenu .egw_fw_ui_scrollarea_outerdiv .egw_fw_ui_sidemenu_entry_content:nth-last-of-type(-n+3) {
  background-color: #ffffff;
  border-color: #B4B4B4;
  border-right: 0px;
  margin-bottom: 10px;
  border-top-color: white;
  padding-top: 8px;
}
#egw_fw_sidebar #egw_fw_sidemenu .egw_fw_ui_scrollarea_outerdiv .egw_fw_ui_sidemenu_entry_content .egw_fw_ui_category {
  margin: 4px 5px 5px 5px;
  padding: 0.5em 1em 0.5em 0;
  cursor: pointer;
  border-color: #B4B4B4;
  background-color: #E6E6E6;
  /*background-color: @egw_color_2_d;*/
}
#egw_fw_sidebar #egw_fw_sidemenu .egw_fw_ui_scrollarea_outerdiv .egw_fw_ui_sidemenu_entry_content .egw_fw_ui_category h1 {
  margin: 5px 0px 3px 5px;
  padding: 0px 0px 0px 15px;
  line-height: 1em;
  font-size: 12px;
  background-image: url(../images/arrow_right.png);
  background-repeat: no-repeat;
  background-position: left center;
}
#egw_fw_sidebar #egw_fw_sidemenu .egw_fw_ui_scrollarea_outerdiv .egw_fw_ui_sidemenu_entry_content .egw_fw_ui_category div.egw_fw_ui_category:nth-last-of-type(-n+3) img.egw_fw_ui_sidemenu_listitem_icon {
  display: block;
}
#egw_fw_sidebar #egw_fw_sidemenu .egw_fw_ui_scrollarea_outerdiv .egw_fw_ui_sidemenu_entry_content .egw_fw_ui_category:hover {
  background-color: #999999;
  padding: 0.5em 1em 0.5em 0;
}
#egw_fw_sidebar #egw_fw_sidemenu .egw_fw_ui_scrollarea_outerdiv .egw_fw_ui_sidemenu_entry_content .egw_fw_ui_category_active {
  border-bottom-width: 0px;
  margin-top: 4px;
  background-color: #0C5DA5;
  color: #f2f2f2;
}
#egw_fw_sidebar #egw_fw_sidemenu .egw_fw_ui_scrollarea_outerdiv .egw_fw_ui_sidemenu_entry_content .egw_fw_ui_category_active h1 {
  background-image: url(../images/arrow_down_white.png);
  line-height: 1em;
  font-size: 12px;
}
#egw_fw_sidebar #egw_fw_sidemenu .egw_fw_ui_scrollarea_outerdiv .egw_fw_ui_sidemenu_entry_content .egw_fw_ui_category_active h1 a {
  color: #FFF;
}
#egw_fw_sidebar #egw_fw_sidemenu .egw_fw_ui_scrollarea_outerdiv .egw_fw_ui_sidemenu_entry_content .egw_fw_ui_category_active h1 a img {
  width: 16px;
  height: 16px;
}
#egw_fw_sidebar #egw_fw_sidemenu .egw_fw_ui_scrollarea_outerdiv .egw_fw_ui_sidemenu_entry_content .egw_fw_ui_category_active h1 a:hover {
  padding: 5px 30px 5px 0px;
  width: 200px;
  background-color: #f0f0f0;
  color: #808080;
  -webkit-box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.6);
  -moz-box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.6);
  box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.6);
  background-color: inherit;
}
#egw_fw_sidebar #egw_fw_sidemenu .egw_fw_ui_scrollarea_outerdiv .egw_fw_ui_sidemenu_entry_content .egw_fw_ui_category_active:hover {
  background-color: #408DD2;
  -webkit-transition: all 0.2s ease-out;
  -moz-transition: all 0.2s ease-out;
  -o-transition: all 0.2s ease-out;
  transition: all 0.2s ease-out;
}
#egw_fw_sidebar #egw_fw_sidemenu .egw_fw_ui_scrollarea_outerdiv .egw_fw_ui_sidemenu_entry_content_bottom {
  border-width: 0px 1px 1px 1px;
}
#egw_fw_sidebar #egw_fw_sidemenu .egw_fw_ui_scrollarea_outerdiv .egw_fw_ui_sidemenu_entry_icon {
  display: inline-block;
  height: 24px;
  padding-left: 0;
  padding-right: 0px;
  float: left;
  /*filter grey*/
  /*filter grey*/
  filter: url("data:image/svg+xml;utf8,<svg xmlns=\'http://www.w3.org/2000/svg\'><filter id=\'grayscale\'><feColorMatrix type=\'matrix\' values=\'0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0 0 0 1 0\'/></filter></svg>#grayscale");
  -webkit-filter: grayscale(100%) brightness(100%) contrast(1%) saturate(0%);
  -moz-filter: grayscale(100%) brightness(100%) contrast(1%) saturate(0%);
  -ms-filter: grayscale(100%) brightness(100%) contrast(1%) saturate(0%);
  -o-filter: grayscale(100%) brightness(100%) contrast(1%) saturate(0%);
  filter: grayscale(100%) brightness(100%) contrast(1%) saturate(0%);
  /*filter: url(grayscale.svg);  Firefox 4+ */
  filter: gray;
  /* IE 6-9 */
}
#egw_fw_sidebar #egw_fw_splitter {
  position: absolute;
  width: 8px;
  top: 40px;
  bottom: 3px;
  right: 0px;
  border-left: 1px solid;
  border-color: #B4B4B4;
}
#egw_fw_sidebar #egw_fw_splitter:hover {
  border-color: #E6E6E6;
}
#egw_fw_basecontainer #egw_fw_toggler {
  display: block;
  width: 44px;
  height: 44px;
  position: absolute;
  z-index: 1;
  margin-top: 0px;
  left: 256px;
  background-color: #fbfbfb;
}
#egw_fw_basecontainer #egw_fw_toggler span {
  background-color: transparent;
  position: relative;
  display: block;
  width: 35px;
  height: 5px;
  backface-visibility: hidden;
  border-radius: 2px;
  top: 11px;
  left: 10px;
}
#egw_fw_basecontainer #egw_fw_toggler span:before {
  transition-duration: 0.7s;
  -webkit-transition-duration: 0.7s;
  -moz-transition-duration: 0.7s;
  transform: rotate(145deg) translate(8px, -2px);
  -ms-transform: rotate(145deg) translate(8px, -2px);
  -moz-transform: rotate(145deg) translate(8px, -2px);
  -webkit-transform: rotate(145deg) translate(8px, -2px);
  background-color: #b4b4b4;
}
#egw_fw_basecontainer #egw_fw_toggler span:before,
#egw_fw_basecontainer #egw_fw_toggler span:after {
  content: "";
  position: absolute;
  left: 0px;
  top: 3px;
  width: 35px;
  height: 4px;
  background-color: #606060;
  backface-visibility: hidden;
  border-radius: 2px;
}
#egw_fw_basecontainer #egw_fw_toggler span:after {
  top: 15px;
  transition-duration: 0.7s;
  -webkit-transition-duration: 0.7s;
  -moz-transition-duration: 0.7s;
  transform: rotate(-145deg) translate(8px, 2px);
  -ms-transform: rotate(-145deg) translate(8px, 2px);
  -moz-transform: rotate(-145deg) translate(8px, 2px);
  -webkit-transform: rotate(-145deg) translate(8px, 2px);
  background-color: #606060;
}
#egw_fw_basecontainer.egw_fw_sidebar_toggleOn {
  /* toggler button*/
}
#egw_fw_basecontainer.egw_fw_sidebar_toggleOn #egw_fw_toggler span {
  background-color: #b4b4b4;
  transition: all 0.3s;
  -webkit-transition: all 0.3s;
  -moz-transition: all 0.3s;
  left: 5px;
}
#egw_fw_basecontainer.egw_fw_sidebar_toggleOn #egw_fw_toggler span:before,
#egw_fw_basecontainer.egw_fw_sidebar_toggleOn #egw_fw_toggler span:after {
  transform: none;
  -ms-transform: none;
  -moz-transform: none;
  -webkit-transform: none;
  width: 35px;
  height: 5px;
  background-color: #b4b4b4;
}
#egw_fw_basecontainer.egw_fw_sidebar_toggleOn #egw_fw_toggler span:before {
  top: 10px;
}
#egw_fw_basecontainer.egw_fw_sidebar_toggleOn #egw_fw_toggler span:after {
  top: 20px;
}
#egw_fw_basecontainer.egw_fw_sidebar_toggleOn #egw_fw_toggler:hover span {
  background-color: #606060;
}
#egw_fw_basecontainer.egw_fw_sidebar_toggleOn #egw_fw_toggler:hover span:before {
  background-color: #606060;
}
#egw_fw_basecontainer.egw_fw_sidebar_toggleOn #egw_fw_toggler:hover span:after {
  background-color: #606060;
}
#egw_fw_basecontainer.egw_fw_sidebar_toggleOn #egw_fw_sidemenu {
  top: 1px;
  /*sidebar adjustments*/
}
#egw_fw_basecontainer.egw_fw_sidebar_toggleOn #egw_fw_sidemenu .egw_fw_ui_sidemenu_entry_content {
  display: none !important;
}
#egw_fw_basecontainer.egw_fw_sidebar_toggleOn #egw_fw_sidemenu .egw_fw_ui_sidemenu_entry_header_active {
  border-radius: 0 !important;
  width: auto !important;
  border: 0;
}
#egw_fw_basecontainer.egw_fw_sidebar_toggleOn #egw_fw_sidemenu .egw_fw_ui_sidemenu_entry_header {
  width: 50px;
  height: 35px;
}
#egw_fw_basecontainer.egw_fw_sidebar_toggleOn #egw_fw_sidemenu .egw_fw_ui_sidemenu_entry_header h1 {
  visibility: hidden;
}
#egw_fw_basecontainer.egw_fw_sidebar_toggleOn #egw_fw_sidemenu .egw_fw_ui_sidemenu_entry_header img {
  margin: 4px auto 0px !important;
  padding: 0 !important;
  float: none !important;
  display: block !important;
  height: 24px !important;
}
/** DON"T MOVE THIS **/
.egw_fw_ui_splitter_vertical {
  background-image: url(../images/splitter_vert.png);
  background-position: center;
  background-repeat: no-repeat;
  background-color: #ffffff;
  position: absolute;
  width: 5px;
  height: 100%;
  cursor: col-resize;
}
.egw_fw_ui_splitter.ui-draggable-dragging {
  background-color: #fbec88;
  border-left: 1px solid #B4B4B4;
  opacity: 1 !important;
}
.egw_fw_ui_splitter_hover {
  background-color: white;
}
.egw_fw_ui_category_content {
  background-color: #ffffff;
  border-top-width: 0;
  border-left: 0px solid;
  border-bottom: 0px solid;
  margin-left: 4px;
  margin-top: 0px;
  padding-bottom: 5px;
  padding-left: 0px;
  padding-top: 3px;
  margin-right: 5px;
  /*min-height: 50px;*/
}
.egw_fw_ui_category_content:last-of-type {
  -webkit-border-top-right-radius: 0;
  -webkit-border-bottom-right-radius: 0;
  -webkit-border-bottom-left-radius: 10px;
  -webkit-border-top-left-radius: 0;
  -moz-border-radius-topright: 0;
  -moz-border-radius-bottomright: 0;
  -moz-border-radius-bottomleft: 10px;
  -moz-border-radius-topleft: 0;
  border-top-right-radius: 0;
  border-bottom-right-radius: 0;
  border-bottom-left-radius: 10px;
  border-top-left-radius: 0;
  /*.background-clip(padding-box);*/
  border-color: #B4B4B4;
  margin-bottom: 5px;
}
.egw_fw_ui_category_content img {
  height: 16px;
  vertical-align: middle;
}
.egw_fw_ui_category_content:hover {
  background-color: #ffffff;
  border-color: #828282;
}
.egw_fw_ui_category_content input#uical_select_owner_multiple {
  height: 16px;
  vertical-align: middle;
}
.egw_fw_ui_category_content .egwTutorial div#list_grid_wrapper {
  border-bottom-left-radius: 10px;
  overflow-x: hidden !important;
}
.egw_fw_ui_category_content .egwTutorial div#list_grid_wrapper .et2_label {
  padding-bottom: 5px;
}
.egw_fw_ui_sidemenu_listitem {
  padding: 9px 0px 0px 0px;
  margin: 0px 0 1px 0px;
  position: relative;
  min-height: 18px;
  background-color: #FFFFFF;
  overflow-x: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}
.egw_fw_ui_sidemenu_listitem:hover {
  color: #000000;
  background-color: rgba(153, 204, 255, 0.4);
}
.egw_fw_ui_sidemenu_listitem img.egw_fw_ui_sidemenu_listitem_icon {
  /*display: none;*/
  width: 12px;
  height: 12px;
  padding: 0px;
  margin: 0px 5px;
  float: left;
}
.egw_fw_ui_sidemenu_listitem input {
  height: 16px;
  width: 81% !important;
}
.egw_fw_ui_sidemenu_listitem input[type="image"] {
  height: 10px;
  width: 10px !important;
  margin-left: 1px;
}
.egw_fw_ui_sidemenu_listitem select {
  max-width: 85% !important;
}
.egw_fw_ui_sidemenu_listitem img {
  height: 9px;
  width: 9px;
  padding: 0px;
  float: right;
}
.egw_fw_ui_sidemenu_listitem a {
  padding: 5px 0px 5px 5px;
  text-decoration: none;
  min-width: 5em;
  vertical-align: bottom;
  color: #000000;
}
.egw_fw_ui_sidemenu_listitem a:active {
  -webkit-box-shadow: inset 1px 2px 1px rgba(0, 0, 0, 0.5);
  -moz-box-shadow: inset 1px 2px 1px rgba(0, 0, 0, 0.5);
  box-shadow: inset 1px 2px 1px rgba(0, 0, 0, 0.5);
}
.egw_fw_ui_sidemenu_listitem div a:first-child {
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  border-radius: 3px;
  background-color: #f0f0f0;
  border-color: #828282;
  cursor: pointer;
  width: 72% !important;
}
.egw_fw_ui_sidemenu_listitem div a:nth-child(2) {
  position: absolute;
  right: 0;
  top: 0;
  background: transparent;
  padding: 0px 2px 0 2px;
  width: 10px;
  min-width: 5px;
}
.egw_fw_ui_sidemenu_listitem div a:nth-child(2) img {
  margin: 0 0 0 0;
  padding: 0em 0em 0 0em;
  height: 10px;
  width: 10px;
}
.egw_fw_ui_sidemenu_listitem div a:nth-child(2):hover {
  background-color: #FF0000;
  /*.background_color_20_gray;*/
  -webkit-box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.6);
  -moz-box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.6);
  box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.6);
  border: 1px solid rgba(0, 0, 0, 0.5);
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  border-radius: 3px;
  color: #ffffff;
}
/**
 * EGroupware: Stylite Pixelegg template
 *
 * Definitions for layout and raster
 *
 * Please do NOT change css-files directly, instead change less-files and compile them!
 *
 * @link http://www.egroupware.org
 * @license http://opensource.org/licenses/gpl-license.php GPL - GNU General Public License
 * @author Stefan Reinhardt <stefan.reinhardt@pixelegg.de>
 * @package pixelegg
 * @version $Id: layout_raster.less 3170 2014-07-16 11:24:38Z pixelegg $
 */
/*
    Created on : 23.07.2014, 13:25:11
    Author     : stefanreinhardt
*/
.egw_fw_ui_scrollarea {
  overflow: hidden;
  z-index: 0;
  background-color: #ffffff;
}
.egw_fw_ui_scrollarea_button {
  position: absolute;
  display: block;
  width: 100%;
  height: 12px;
  z-index: 2;
  display: none !important;
}
.egw_fw_ui_scrollarea_button_up.egw_fw_ui_scrollarea_button_hover,
.egw_fw_ui_scrollarea_button_down.egw_fw_ui_scrollarea_button_hover {
  background-image: none;
}
.egw_fw_ui_scrollarea_button_disabled {
  display: none !important;
}
#egw_fw_sidemenu.egw_fw_ui_scrollarea_enabled {
  top: 7px !important;
}
#egw_fw_sidemenu.egw_fw_ui_scrollarea_enabled .egw_fw_ui_sidemenu_entry_header_active {
  position: fixed;
  top: 50px;
  background: white;
  z-index: 1;
}
.egw_fw_ui_scrollarea_button_up,
.egw_fw_ui_scrollarea_button_down {
  height: 14px;
  background-image: none;
  background-color: white;
  background-repeat: no-repeat;
  background-position: center;
}
.egw_fw_ui_scrollarea_button_up {
  height: 37px;
  top: 0px;
  border-bottom: 1px solid silver;
}
.egw_fw_ui_scrollarea_button_down {
  bottom: 0px;
}
.egw_fw_ui_scrollarea_outerdiv {
  height: 100%;
}
.egw_fw_content_browser_div {
  display: block;
  overflow-x: hidden;
  overflow-y: auto;
  padding-right: 10px;
  /*	background-color: RGB(240, 240, 255);*/
}
.egw_fw_content_browser_div_loading {
  position: absolute;
  z-index: 1000;
  top: 0px;
  left: 0px;
  width: 16px;
  height: 16px;
  background-image: url(../images/ajax-loader.gif);
  background-position: center;
  background-repeat: no-repeat;
}
/**
 * EGroupware: Stylite Pixelegg template
 *
 * Definitions for layout and raster
 *
 * Please do NOT change css-files directly, instead change less-files and compile them!
 *
 * @link http://www.egroupware.org
 * @license http://opensource.org/licenses/gpl-license.php GPL - GNU General Public License
 * @author Stefan Reinhardt <stefan.reinhardt@pixelegg.de>
 * @package pixelegg
 * @version $Id: layout_raster.less 3170 2014-07-16 11:24:38Z pixelegg $
 */
/*
    Created on : 23.07.2014, 13:25:11
    Author     : stefanreinhardt
*/
#egw_fw_topmenu_info_items {
  display: inline-block;
  height: 45px;
  position: absolute;
  padding-right: 2px;
  right: 0px;
  z-index: 1000;
  background-color: #fbfbfb;
  /*Notification*/
  /*Search button*/
  /*current user info*/
  /*current user info*/
  /*time zone*/
  /*quick*/
  /* Firefox */
  /* Webkit */
  /* IE */
  /* Opera and prob css3 final iteration */
}
#egw_fw_topmenu_info_items .topmenu_info_item {
  height: 45px;
  width: 45px;
  border-left: 1px solid #bfc0bf;
  display: inline-block;
  padding-left: 3px;
  float: right;
  background-size: 20px;
  background-position: center center;
  background-repeat: no-repeat;
  cursor: pointer;
}
#egw_fw_topmenu_info_items .topmenu_info_item:hover {
  background-color: rgba(153, 204, 255, 0.4);
}
#egw_fw_topmenu_info_items #topmenu_info_user_avatar span {
  height: 40px;
  width: 40px;
  display: inline-block;
  border: none;
  margin-top: 2px;
  margin-left: 1px;
  pointer-events: none;
}
#egw_fw_topmenu_info_items #topmenu_info_user_avatar span img {
  width: 40px;
  pointer-events: none;
}
#egw_fw_topmenu_info_items #topmenu_info_logout {
  background-image: url(../images/logout.svg);
}
#egw_fw_topmenu_info_items #topmenu_info_logout a {
  width: 45px;
  height: 45px;
  display: inline-block;
}
#egw_fw_topmenu_info_items #topmenu_info_print_title {
  background-image: url(../images/print.svg);
}
#egw_fw_topmenu_info_items #topmenu_info_print_title span {
  width: 45px;
  height: 45px;
  display: inline-block;
}
#egw_fw_topmenu_info_items #topmenu_info_notifications {
  line-height: 45px;
  text-align: center;
  cursor: pointer;
  display: inline-block;
  color: #fbfbfb;
  font-weight: bold;
  opacity: 0.4;
  background-image: url(../images/notification_message.svg);
  border-left: 1px solid #636262;
}
#egw_fw_topmenu_info_items #topmenu_info_notifications .popup_note {
  position: absolute;
  width: 280px;
  height: 30px;
  left: -96px;
  top: 45px;
  border: 1px solid silver;
  background: #ffffff;
  text-align: center;
  font-size: 10pt;
  line-height: 22pt;
  color: #b9436c;
  white-space: nowrap;
  z-index: 999;
}
#egw_fw_topmenu_info_items #topmenu_info_notifications .popup_note:before {
  content: '';
  position: absolute;
  left: 252px;
  width: 0;
  height: 0px;
  border-left: 14px solid transparent;
  border-right: 15px solid transparent;
  border-bottom: 12px solid #aaa;
  margin-bottom: 12px;
  margin-left: 1px;
  top: -12px;
}
#egw_fw_topmenu_info_items #topmenu_info_notifications .popup_note:after {
  content: '';
  position: absolute;
  top: -10px;
  left: 252px;
  width: 0;
  height: 0;
  border-left: 15px solid transparent;
  border-right: 15px solid transparent;
  border-bottom: 12px solid #ffffff;
  margin-bottom: 11px;
}
#egw_fw_topmenu_info_items #topmenu_info_notifications.egwpopup_notify {
  background-image: url(../images/notification_message_active.svg);
  opacity: 1;
  border-left: 1px solid #bfc0bf;
}
#egw_fw_topmenu_info_items #topmenu_info_search {
  background-repeat: no-repeat;
  background-image: url(../images/topmenu_items/search.svg);
}
#egw_fw_topmenu_info_items #topmenu_info_search a {
  width: 45px;
  height: 45px;
  display: inline-block;
}
#egw_fw_topmenu_info_items form {
  height: 0px;
}
#egw_fw_topmenu_info_items form select {
  padding: 0px;
}
#egw_fw_topmenu_info_items #topmenu_info_quick_add span#quick_add {
  float: right;
  background-image: url(../images/add.svg);
  background-repeat: no-repeat;
  background-size: 24px;
  background-position: center;
  width: 45px;
  height: 45px;
  padding-right: 3px;
}
#egw_fw_topmenu_info_items #topmenu_info_quick_add span#quick_add:before {
  content: " ";
  font-size: 2em;
  color: #0C5DA5;
  line-height: 0.6em;
  background-color: white;
}
#egw_fw_topmenu_info_items #topmenu_info_quick_add .chzn-container {
  z-index: 1000;
  position: fixed;
  right: 93px !important;
  top: 47px;
  width: 160px !important;
  background: #FFFFFF;
}
#egw_fw_topmenu_info_items #topmenu_info_quick_add .chzn-container:before {
  content: '';
  position: absolute;
  bottom: 51%;
  left: 42%;
  width: 0;
  height: 0px;
  border-left: 14px solid transparent;
  border-right: 15px solid transparent;
  border-bottom: 12px solid #aaa;
  margin-bottom: 12px;
  margin-left: 1px;
}
#egw_fw_topmenu_info_items #topmenu_info_quick_add .chzn-container:after {
  content: '';
  position: absolute;
  bottom: 50%;
  left: 42%;
  width: 0;
  height: 0;
  border-left: 15px solid transparent;
  border-right: 15px solid transparent;
  border-bottom: 12px solid #ffffff;
  margin-bottom: 11px;
}
#egw_fw_topmenu_info_items #topmenu_info_quick_add .chzn-container .chzn-single span {
  display: none;
}
#egw_fw_topmenu_info_items #topmenu_info_quick_add .chzn-container a.chzn-single.chzn-default {
  border: 1px solid #bfc0bf;
  border-radius: 0px;
}
#egw_fw_topmenu_info_items #topmenu_info_quick_add .chzn-container .chzn-drop {
  border-radius: 0px;
  margin-top: -2px;
}
#egw_fw_topmenu_info_items #topmenu_info_quick_add select#quick_add_selectbox {
  visibility: hidden;
}
#egw_fw_topmenu_info_items img#topmenu_info_error {
  width: 16px;
  height: 16px;
  position: fixed;
  /*.Button_size_square_16;*/
  border: 1px solid rgba(0, 0, 0, 0.15);
  -webkit-box-shadow: 0px 1px 0px rgba(0, 0, 0, 0.5);
  -moz-box-shadow: 0px 1px 0px rgba(0, 0, 0, 0.5);
  box-shadow: 0px 1px 0px rgba(0, 0, 0, 0.5);
  padding: 5px;
  top: 6px;
  right: 112px;
  z-index: 200;
  background-color: #FF0000;
  -moz-transition: all 1s ease-in-out;
  -webkit-transition: all 1s ease-in-out;
  -o-transition: all 1s ease-in-out;
  -ms-transition: all 1s ease-in-out;
  transition: all 1s ease-in-out;
  /* order: name, direction, duration, iteration-count, timing-function */
  -moz-animation: blink normal 2s infinite ease-in-out;
  /* Firefox */
  -webkit-animation: blink normal 2s infinite ease-in-out;
  /* Webkit */
  -ms-animation: blink normal 2s infinite ease-in-out;
  /* IE */
  animation: blink normal 2s infinite ease-in-out;
  /* Opera and prob css3 final iteration */
}
#egw_fw_topmenu_info_items img#topmenu_info_error:hover {
  -webkit-box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.6);
  -moz-box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.6);
  box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.6);
}
#egw_fw_topmenu_info_items img#topmenu_info_error:active {
  -webkit-box-shadow: inset 1px 2px 1px rgba(0, 0, 0, 0.5);
  -moz-box-shadow: inset 1px 2px 1px rgba(0, 0, 0, 0.5);
  box-shadow: inset 1px 2px 1px rgba(0, 0, 0, 0.5);
}
#egw_fw_topmenu_info_items img#topmenu_info_error:focus {
  -webkit-box-shadow: inset 1px 2px 1px rgba(0, 0, 0, 0.5);
  -moz-box-shadow: inset 1px 2px 1px rgba(0, 0, 0, 0.5);
  box-shadow: inset 1px 2px 1px rgba(0, 0, 0, 0.5);
}
@-moz-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
@-webkit-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
@-ms-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
@keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
div#topmenu_info_update {
  display: inline-block;
}
div#topmenu_info_update img {
  -webkit-border-radius: 5px;
  -moz-border-radius: 5px;
  border-radius: 5px;
}
/**
 * EGroupware: Stylite Pixelegg template
 *
 * Definitions for layout and raster
 *
 * Please do NOT change css-files directly, instead change less-files and compile them!
 *
 * @link http://www.egroupware.org
 * @license http://opensource.org/licenses/gpl-license.php GPL - GNU General Public License
 * @author Stefan Reinhardt <stefan.reinhardt@pixelegg.de>
 * @package pixelegg
 * @version $Id: layout_raster.less 3170 2014-07-16 11:24:38Z pixelegg $
 */
/*
    Created on : 23.07.2014, 13:25:11
    Author     : stefanreinhardt
*/
/* ##################################################################
*   ADMIN INDEX Tree
/* ##################################################################
*/
.standartTreeImage {
  /*filter grey*/
  filter: url("data:image/svg+xml;utf8,<svg xmlns=\'http://www.w3.org/2000/svg\'><filter id=\'grayscale\'><feColorMatrix type=\'matrix\' values=\'0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0 0 0 1 0\'/></filter></svg>#grayscale");
  -webkit-filter: grayscale(100%) brightness(100%) contrast(1%) saturate(0%);
  -moz-filter: grayscale(100%) brightness(100%) contrast(1%) saturate(0%);
  -ms-filter: grayscale(100%) brightness(100%) contrast(1%) saturate(0%);
  -o-filter: grayscale(100%) brightness(100%) contrast(1%) saturate(0%);
  filter: grayscale(100%) brightness(100%) contrast(1%) saturate(0%);
  /*filter: url(grayscale.svg);  Firefox 4+ */
  filter: gray;
  /* IE 6-9 */
  width: 16px;
  height: 16px;
}
button.image_button {
  background: none;
  border: none;
}
/**
 * EGroupware: Stylite Pixelegg template
 *
 * lettersearch
 *
 * Please do NOT change css-files directly, instead change less-files and compile them!
 *
 * @link http://www.egroupware.org
 * @license http://opensource.org/licenses/gpl-license.php GPL - GNU General Public License
 * @author Stefan Reinhard <stefan.reinhard@pixelegg.de>
 * @package pixelegg
 * @version $Id: layout_table.less 3089 2014-06-11 14:02:57Z pixelegg $
 */
.sbHolder {
  /*.box_shadow_standard_light;*/
  width: auto;
  margin: 5px 0em 5px 0px;
  padding: 3px;
  outline: none;
  display: inline-block;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  cursor: pointer;
  font-family: Verdana, "Lucida Grande", Helvetica, Sans-Serif;
  font-size: 1.2em;
  font-weight: normal;
  height: 30px;
  position: relative;
  width: 10em;
}
.sbHolder:hover {
  -webkit-box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.6);
  -moz-box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.6);
  box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.6);
}
.sbHolder:focus {
  outline: 0;
  border-width: 1px;
  border-style: solid;
  border-color: #B4B4B4;
  -webkit-box-shadow: 0 0 2px 1px rgba(0, 0, 0, 0.1);
  -moz-box-shadow: 0 0 2px 1px rgba(0, 0, 0, 0.1);
  box-shadow: 0 0 2px 1px rgba(0, 0, 0, 0.1);
}
.sbSelector {
  display: block;
  height: 30px;
  left: 0;
  line-height: 30px;
  outline: none;
  overflow: hidden;
  position: absolute;
  text-indent: 10px;
  top: 0;
  width: 170px;
}
.sbSelector:link,
.sbSelector:visited,
.sbSelector:hover {
  color: #808080;
  outline: none;
  text-decoration: none;
}
.sbToggle {
  background: url(../img/select-icons.png) 0 -116px no-repeat;
  display: block;
  height: 30px;
  outline: none;
  position: absolute;
  right: 0;
  top: 0;
  width: 30px;
}
.sbToggle:hover {
  background: url(../images/select-icons.png) 0 -167px no-repeat;
}
.sbToggleOpen {
  background: url(../images/select-icons.png) 0 -16px no-repeat;
}
.sbToggleOpen:hover {
  background: url(../images/select-icons.png) 0 -66px no-repeat;
}
.sbHolderDisabled {
  background-color: #3C3C3C;
  border: solid 1px #515151;
}
.sbOptions {
  background-color: #ffffff;
  border: solid 1px #515151;
  list-style: none;
  left: -1px;
  margin: 0;
  padding: 0;
  position: absolute;
  top: 30px;
  width: 200px;
  z-index: 1;
  overflow-y: auto;
}
.sbOptions li {
  padding: 0 7px;
}
.sbOptions a {
  border-bottom: dotted 1px #515151;
  display: block;
  outline: none;
  padding: 7px 0 7px 3px;
  color: #26537C;
}
.sbOptions a:link,
.sbOptions a:visited {
  color: #26537C;
  text-decoration: none;
}
.sbOptions a:hover,
.sbOptions a:focus,
.sbOptions a.sbFocus {
  color: rgba(38, 83, 124, 0.6);
}
.sbOptions li.last a {
  border-bottom: none;
}
.sbOptions .sbDisabled {
  border-bottom: dotted 1px #515151;
  color: #999;
  display: block;
  padding: 7px 0 7px 3px;
}
.sbOptions .sbGroup {
  border-bottom: dotted 1px #515151;
  color: #EBB52D;
  display: block;
  font-weight: bold;
  padding: 7px 0 7px 3px;
}
.sbOptions .sbSub {
  padding-left: 17px;
}
/**
 * EGroupware: Stylite Pixelegg template
 *
 * lettersearch
 *
 * Please do NOT change css-files directly, instead change less-files and compile them!
 *
 * @link http://www.egroupware.org
 * @license http://opensource.org/licenses/gpl-license.php GPL - GNU General Public License
 * @author Stefan Reinhard <stefan.reinhard@pixelegg.de>
 * @package pixelegg
 * @version $Id: layout_table.less 3089 2014-06-11 14:02:57Z pixelegg $
 */
/* disabled for now in pixelegg.less, until we use svg outside filemanager thumbnails

//SVG Filter / not for Logo
#egw_fw_sidebar img[src$="svg"]{
            .gradient_vertical (@gray_60, @gray_60);
            .rounded(3px);
            border: 1px solid @gray_0;;
}

#egw_fw_main img[src$="svg"],
#egw_fw_footer img[src$="svg"]{
            //.gradient_vertical (@egw_color_2_a, @egw_color_2_a);
            .gradient_vertical (fade(@gray_100,50%), fade(@gray_100,50%));

}*/
/**
 * EGroupware: Stylite Pixelegg template
 *
 * et2 table
 *
 * Please do NOT change css-files directly, instead change less-files and compile them!
 *
 * @link http://www.egroupware.org
 * @license http://opensource.org/licenses/gpl-license.php GPL - GNU General Public License
 * @author Stefan Reinhard <stefan.reinhard@pixelegg.de>
 * @package pixelegg
 * @version $Id$
 */
/** #####################################################################################
 * et2
 * Tabellen
 * ######################################################################################
 */
/* TABLE STYLE */
.th {
  border-bottom: 1px solid #E6E6E6;
}
.th.thb {
  border-color: darkgray;
}
.th.thb td {
  padding-top: 10px;
}
.innerContainer {
  overflow: hidden;
  /*padding: 0;*/
}
.egwGridView_grid > tbody > tr.th > td {
  border-bottom: 1px solid darkgray;
  font-weight: normal;
  padding: 0 2px 2px 0;
  background-image: none;
  background-position: center;
  background-repeat: repeat-x;
  vertical-align: top;
}
table.egwGridView_outer {
  background-color: transparent;
  border-spacing: 0px;
  font-size: 0.9em;
}
table.egwGridView_outer thead {
  max-height: 118px;
  overflow-y: auto;
  background: white;
}
table.egwGridView_outer thead tr th {
  background-position: -200px;
  font-weight: normal;
  padding: 3px 1px 3px 4px;
  border: 1px solid #B4B4B4;
  border-top: transparent;
  vertical-align: middle;
  overflow: auto;
  background-color: #f8f8f8;
}
table.egwGridView_outer thead tr th:hover {
  background-color: #bfbfbf;
  color: #ffffff;
  /*border-right: 5px solid white;*/
  background-image: url(../images/hint-arrow-right.png);
  background-position: right bottom;
  background-repeat: no-repeat;
  background-size: 15px 15px;
  -webkit-transition: all 0s ease-out;
  -moz-transition: all 0s ease-out;
  -o-transition: all 0s ease-out;
  transition: all 0s ease-out;
  /*transition-delay: 1s;*/
}
table.egwGridView_outer thead tr th:active {
  background-color: #d9d9d9;
  -webkit-box-shadow: inset 1px 2px 1px rgba(0, 0, 0, 0.5);
  -moz-box-shadow: inset 1px 2px 1px rgba(0, 0, 0, 0.5);
  box-shadow: inset 1px 2px 1px rgba(0, 0, 0, 0.5);
  border-bottom: 1px solid silver;
}
table.egwGridView_outer thead tr th div.innerContainer {
  max-height: 10em;
  overflow-y: auto;
}
table.egwGridView_outer thead tr th.optcol {
  padding: 0;
  text-align: center;
  background-image: none;
  border-right: none;
  /*width: 32px !important;*/
  vertical-align: bottom;
  background-color: #f0f0f0;
}
table.egwGridView_outer thead tr th.optcol:hover {
  cursor: pointer;
}
table.egwGridView_outer thead tr th.optcol span.selectcols {
  height: 9px;
  padding: 4px 14px 0px 2px;
  margin-top: 4px;
  background-image: url(../images/selectcols.svg);
  background-repeat: no-repeat;
  background-size: 10px 10px;
  display: inline-block;
  background-position: top;
}
table.egwGridView_outer > tbody > tr {
  /*Elements inside td*/
}
table.egwGridView_outer > tbody > tr td.frame {
  /*border: 1px solid @gray_10; can't have - breaks grid scroll calculations'
            /*padding: 0px 5px; no need*/
}
table.egwGridView_outer > tbody > tr > td {
  /* disabled as it skrews display of svg in filemanager
        img[src$="svg"]  {
            .gradient_vertical (fade(@gray_100,50%), fade(@gray_100,50%));
        }*/
}
table.egwGridView_outer > tbody > tr > td .et2_link {
  margin-left: 0px;
  color: #26537C;
}
table.egwGridView_outer > tbody > tr > td img {
  border: 1px solid transparent;
  box-shadow: none;
}
table.egwGridView_outer > tbody > tr > td time {
  display: block;
}
/*########################################################*/
table.egwGridView_grid {
  font-size: 12px;
  background-color: #ffffff;
  border-spacing: 0px 1px;
  width: 100%;
  /*subentry*/
}
table.egwGridView_grid img {
  height: 16px;
}
table.egwGridView_grid tbody {
  border-bottom: 1px solid #000000;
  /*padding: 2px 3px 2px 4px;*/
  margin: 0;
  vertical-align: top;
  /*        tr:nth-child(even) {background: @color_even;}
        tr:nth-child(odd) {background: @color_odd;}*/
  /*multiple choise*/
}
table.egwGridView_grid tbody tr:hover {
  background: rgba(153, 204, 255, 0.4);
}
table.egwGridView_grid tbody tr.th:hover {
  background: transparent;
}
table.egwGridView_grid tbody tr.selected {
  background-image: none;
  background-color: rgba(102, 153, 204, 0.7);
}
table.egwGridView_grid tbody td {
  border-bottom: 1px solid #E6E6E6;
  color: #000000;
}
table.egwGridView_grid tbody td .innerContainer {
  padding: 3px 0 3px 3px;
}
table.egwGridView_grid tbody td table.customfields tbody {
  border-bottom: 0px;
}
table.egwGridView_grid tbody td table.customfields tbody tr {
  border-bottom: 0px;
  /*background-size: 12px 12px;*/
}
table.egwGridView_grid tbody td table.customfields tbody tr td {
  border-bottom: 0px;
  border: 0px;
  padding: 0;
  /*height: 12px;*/
}
table.egwGridView_grid tbody td table.customfields tbody tr td .et2_textbox_ro {
  /*white-space: inherit;*/
}
table.egwGridView_grid tbody td[align="right"] {
  padding: 3px 5px 3px 0;
}
table.egwGridView_grid > tr {
  border-bottom: 1px solid;
  border-color: #828282;
}
table.egwGridView_grid > tr > td {
  border-left: 1px;
  border-right: 1px;
  padding: 0.3em 0 0.3em 0.3em;
  border-bottom: 1px solid;
  color: #E6E6E6;
  /*&:hover {background-color: @egw_color_2_e;} legacy*/
}
table.egwGridView_grid > tr > td:active {
  /*background-color: @egw_color_2_a;*/
  -webkit-box-shadow: inset 1px 2px 1px rgba(0, 0, 0, 0.5);
  -moz-box-shadow: inset 1px 2px 1px rgba(0, 0, 0, 0.5);
  box-shadow: inset 1px 2px 1px rgba(0, 0, 0, 0.5);
  color: #ffffff;
}
table.egwGridView_grid > tr > td span {
  color: #505050;
}
table.egwGridView_grid > tr > td span[id*="[info_subject]"] {
  margin-right: 30px;
}
table.egwGridView_grid > tr > td span.high {
  color: red;
}
table.egwGridView_grid > tr > td span.urgent {
  color: red;
  background-color: rgba(153, 204, 255, 0.4);
}
table.egwGridView_grid > tr > td span.low {
  color: #373737;
}
table.egwGridView_grid tr.subentry {
  background: rgba(102, 153, 204, 0.2);
}
table.egwGridView_grid tr.subentry:hover {
  background: rgba(102, 153, 204, 0.7) !important;
}
table.egwGridView_grid tr.drop-hover {
  background: rgba(102, 153, 204, 0.7) !important;
}
table.egwGridView_grid span.arrow {
  -moz-user-select: none;
  background-repeat: no-repeat;
  display: inline-block;
  height: 8px;
  margin-right: 2px;
  vertical-align: middle;
  width: 8px;
}
table.egwGridView_grid span.arrow.opened {
  background-image: url("../images/egw_action/arrows.png");
  background-position: -8px 0;
  cursor: pointer;
}
table.egwGridView_grid span.arrow.closed {
  background-image: url("../images/egw_action/arrows.png");
  background-position: 0 0;
  cursor: pointer;
}
table.egwGridView_grid span.arrow.loading {
  background-image: url("../egw_action/ajax-loader.gif");
  background-position: 0 0;
  cursor: pointer;
}
.nextmatch_header .selectcols {
  background: none;
}
.nextmatch_header tr {
  background: none;
}
/*Custom Fields*/
table.customfields tbody tr:nth-child(2n) {
  background: inherit;
}
table.customfields tr {
  background-color: inherit !important;
}
table.customfields td span > div {
  display: inherit;
  margin: 0px;
}
/*########################################################*/
table.nextmatch_header img {
  width: 16px;
  height: 16px;
}
.egwGridView_empty {
  text-align: center;
  border-bottom: 1px solid silver;
  font-size: 1.5em;
}
.egwGridView_empty td {
  color: #1E1E1E !important;
}
/**
 * EGroupware: Stylite Pixelegg template
 *
 * lettersearch
 *
 * Please do NOT change css-files directly, instead change less-files and compile them!
 *
 * @link http://www.egroupware.org
 * @license http://opensource.org/licenses/gpl-license.php GPL - GNU General Public License
 * @author Stefan Reinhard <stefan.reinhard@pixelegg.de>
 * @package pixelegg
 * @version $Id$
 */
/* traditional */
form {
  margin: 0px;
  padding: 0px;
}
img {
  border: 0;
}
div {
  color: #000000;
}
input[type=submit],
input[type=button],
input[type=reset],
button,
.egwbutton {
  background-color: #f0f0f0;
  background-image: none;
  border: outset 1px #b9d5e3;
  margin: 1px;
  padding: 1px;
  cursor: pointer;
  color: #004e7d;
}
input[type=submit] {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
}
input[type=submit]:hover,
input[type=button]:hover,
input[type=reset]:hover,
button:hover,
.egwbutton:hover {
  background-color: #d9d9d9 !important;
  background-image: none;
  border: outset 1px #b9d5e3;
  color: #004e7d;
}
input[type=submit]:active,
input[type=button]:active,
input[type=reset]:active,
button:active,
.egwbutton:active {
  border: inset 1px #bbbbbb;
}
input[type=submit]:disabled,
input[type=button]:disabled,
input[type=reset]:disabled,
button:disabled,
.egwbutton:disabled {
  background-color: transparent;
  color: gray;
}
input.egwbutton {
  background-color: #b9d5e3;
  border: outset 1px #b9d5e3;
  margin: 1px;
  padding: 1px;
  cursor: pointer;
  color: #004e7d;
}
input.egwbutton:hover {
  background-color: #94bfd4;
  border: outset 1px #b9d5e3;
  color: #004e7d;
}
input.egwbutton:active {
  border: inset 1px #bbbbbb;
}
input[type=image] {
  cursor: pointer;
  border: 0;
  width: 16px;
  height: 16px;
}
#thesideboxcolumn {
  width: 177px;
  position: relative;
}
#sideresize {
  background-image: url(../images/resize.png);
  width: 13px;
  height: 13px;
  right: 1px;
  top: 1px;
  position: absolute;
  z-index: 9999;
}
.divSidebox {
  position: relative;
  border: #9c9c9c 1px solid;
  overflow: auto;
}
.divSideboxHeader {
  text-align: center;
  background-color: #d9d9d9;
  padding-top: 2px;
  color: #808080;
}
a.divSideboxEntry,
.divSideboxEntry {
  text-align: left;
  background-color: #FDFDFD;
}
a.appTitles,
.appTitles {
  height: 18px;
  padding-top: 2px;
  padding-bottom: 2px;
}
a.textSidebox {
  padding: 0;
  border-top: 0;
}
.textSidebox {
  padding-top: 3px;
  padding-bottom: 3px;
  padding-left: 1px;
  border-top: solid #aaaaaa 1px;
  overflow: auto;
}
.sideboxSpace {
  height: 9px;
}
.greyLine {
  margin: 1px;
  border-top: solid 1px #7e7e7e;
  height: 1px;
}
#extraIcons {
  background-color: #eeeeee;
  border: solid 1px #7e7e7e;
}
.extraIconsRow {
  border: solid 1px #dddddd;
  padding: 2px;
}
#topmenu {
  background-color: #0081c1;
  background-image: url(../images/bgtopmenu2.png);
  color: #006699;
  /*border-top: solid 1px #7e7e7e;*/
  border-bottom: solid #5793ff 1px;
  height: 20px;
  padding-top: 4px ;
  line-height: 16px;
}
#topmenu a {
  color: #006699;
}
#topmenu_items {
  float: left;
}
#topmenu_info {
  float: right;
}
#divUpperTabs {
  text-align: right;
  height: 15px;
  margin-right: 10px;
}
#divUpperTabs ul {
  display: inline;
  margin: 0;
  padding: 10px 10px 0 1px;
  list-style: none;
}
#divUpperTabs li {
  float: right;
  margin: 0 5px 0 0;
  padding: 0 5px 0 5px;
  border: solid 1px #9c9c9c;
  border-bottom: 0px;
}
/* Star-Plus-HTML Hack fix for the above */
*:first-child + html #divAppIconBar {
  height: 60px;
}
#divAppTextBar {
  background-color: white;
}
#divStatusBar {
  background-color: white;
  height: 18px;
  padding-left: 3px;
}
#tdSidebox {
  width: 170px;
  background-color: white;
  overflow: visible;
}
#tdAppbox {
  background-color: white;
  padding-left: 5px;
  width: 100%;
}
#divAppboxHeader {
  background-image: url(../images/appbox-header-background.png);
  background-repeat: repeat-x;
  height: 25px;
  border-bottom: solid 1px #c0c0c0;
  text-align: center;
  padding-bottom: 0px;
  border-top: solid 1px #9c9c9c;
  border-left: solid 1px #9c9c9c;
  border-right: solid 1px #9c9c9c;
}
#divAppboxHeader table img {
  height: 16px;
}
#divAppbox {
  background-color: #ffffff;
  padding: 5px;
  border-bottom: solid 1px #9c9c9c;
  border-left: solid 1px #9c9c9c;
  border-right: solid 1px #9c9c9c;
}
#divGenTime,
#divPoweredBy {
  bottom: 4px;
  text-align: center;
  width: 99%;
}
.pageGenTime,
#divPoweredBy {
  font-size: 80%;
  color: #ff0000;
  text-align: center;
}
.pageGenTime {
  margin-top: 1em;
  position: absolute;
  bottom: -18px;
  left: 25%;
}
.pageGenTime > span:after {
  content: ", ";
}
.pageGenTime > span:last-child:after {
  content: "";
}
@keyframes loading-prompt-spinner {
  from {
    transform: rotateZ(0deg);
  }
  to {
    transform: rotateZ(360deg);
  }
}
.egw-loading-prompt-container::before {
  opacity: .3;
  content: "";
  background-color: #aaaaaa;
  width: 100%;
  height: 100%;
  position: absolute;
  z-index: 999;
}
.egw-loading-prompt-container .egw-loading-prompt-spinner-msg {
  position: absolute;
  width: 100%;
  text-align: center;
  left: 0;
  top: 48%;
  z-index: 999;
  text-shadow: 4px 4px 7px #679FD2;
  color: #0B5FA4;
  margin-top: 52px;
}
.egw-loading-prompt-container .egw-loading-prompt-spinner-animator {
  width: 38px;
  height: 38px;
  position: absolute;
  margin-left: 50%;
  left: -17px;
  top: 48%;
  z-index: 999;
  background-position: 3px 3px;
  opacity: 1;
  background-repeat: no-repeat;
  vertical-align: middle;
  border: 5px solid;
  background: #FBC200;
  border: 6px #679fd2 solid;
  border-top: 6px #0C5DA5 solid;
  border-radius: 50%;
  -webkit-animation: loading-prompt-spinner 1.2s infinite linear;
  animation: loading-prompt-spinner 1.2s infinite linear;
}
@keyframes loading-prompt-horizental {
  0% {
    transform: translate(-52.5px, -7.5px);
  }
  100% {
    transform: translate(38.5px, -7.5px);
  }
}
.egw-loading-prompt-container .egw-loading-prompt-horizental-animator::after {
  content: '';
  position: absolute;
  top: 48%;
  left: 50%;
  width: 15px;
  height: 15px;
  z-index: 999;
  border-radius: 30%;
  background: #FBC200;
  animation-name: loading-prompt-horizental;
  animation-duration: 1.5s;
  animation-direction: alternate;
  animation-timing-function: ease-in-out;
  animation-iteration-count: infinite;
}
.egw-loading-prompt-container .egw-loading-prompt-horizental-msg {
  position: absolute;
  left: 50%;
  top: 50%;
  z-index: 999;
  text-shadow: 4px 4px 7px #679FD2;
  color: #0B5FA4;
  margin-left: -35px;
}
.egw-loading-prompt-container .egw-loading-prompt-horizental-animator::before {
  content: '';
  position: absolute;
  top: 48%;
  left: 50%;
  z-index: 999;
  width: 100px;
  border-radius: 5px;
  border: solid 10px  #679FD2;
  transform: translate(-50%, -50%);
}
/**
 * EGroupware: Pixelegg styles
 *
 * Pixelegg definitions for tutorials
 *
 * Please do NOT change css-files directly, instead change less-files and compile them!
 *
 * @link http://www.egroupware.org
 * @license http://opensource.org/licenses/gpl-license.php GPL - GNU General Public License
 * @author Hadi Nategh <hn@stylite.de>
 * @package pixelegg
 * @version $Id$
 */
/**
 * EGroupware: CSS with less preprocessor
 *
 * Definitions for tutorials
 *
 * Please do NOT change css-files directly, instead change less-files and compile them!
 *
 * @link http://www.egroupware.org
 * @license http://opensource.org/licenses/gpl-license.php GPL - GNU General Public License
 * @author Hadi NAtegh <hn@stylite.de>
 * @package phpgwapi
 * @version $Id$
 */
span.egw_tutorial_title {
  color: black;
  font-weight: bold;
  text-align: left;
  width: 99%;
  background-color: #D6DEF0;
  border: 1px solid #B3B3B3;
  padding-top: 4px;
  padding-left: 5px;
  padding-bottom: 5px;
  border-radius: 2px;
  text-overflow: ellipsis;
  white-space: nowrap;
  overflow-x: hidden;
}
.egw_tutorial_thumb:hover [id^="egw_tutorial_"][id$="_play"].egw_tutorial_playBtn,
.egw_tutorial_thumb:hover #home-tutorial_play.egw_tutorial_playBtn {
  background-color: #FF0000;
  opacity: 0.68;
}
.egw_tutorial_thumb:hover [id^="egw_tutorial_"][id$="_play"].egw_tutorial_playBtn > div,
.egw_tutorial_thumb:hover #home-tutorial_play.egw_tutorial_playBtn > div {
  border-left-color: white;
}
.egw_tutorial_thumb {
  background-repeat: no-repeat;
  background-position: -2px;
  border-radius: 5px;
  display: block !important;
}
[id^="egw_tutorial_"][id$="_play"].egw_tutorial_playBtn,
#home-tutorial_play.egw_tutorial_playBtn {
  display: block;
  margin: 10%;
  border: 2px solid rgba(0, 0, 0, 0.7);
  -webkit-border-radius: 100%;
  -moz-border-radius: 100%;
  border-radius: 100%;
  width: 40px;
  height: 40px;
  cursor: pointer;
}
[id^="egw_tutorial_"][id$="_play"].egw_tutorial_playBtn > div,
#home-tutorial_play.egw_tutorial_playBtn > div {
  display: block;
  position: relative;
  top: 10px;
  left: 45%;
  width: 0;
  height: 0;
  border-top: 10px solid transparent;
  border-bottom: 10px solid transparent;
  border-left: 10px solid rgba(0, 0, 0, 0.8);
}
[id^="egw_tutorial_"][id$="sidebox_list"] {
  overflow-x: hidden;
  overflow-y: auto;
  max-height: 200px;
}
#list_grid_wrapper {
  max-height: 200px;
}
#home-tutorial_list {
  float: left;
}
#home-tutorial_list .egw_tutorial_thumb {
  display: block;
}
#home-tutorial_list .th .et2_label {
  font-size: 12px;
  padding-left: 7px;
}
#home-tutorial_list .th #home-tutorial_apps {
  margin-left: 5px;
}
#home-tutorial_list tbody td:first-child {
  padding-top: 4px;
}
#home-tutorial_src {
  border-left: 6px solid #E0E0E0;
}
.tutorial_popup {
  background-color: white;
  padding-top: 5px;
  overflow-y: hidden;
}
.tutorial_videoList {
  overflow-x: hidden;
  overflow-y: auto;
  height: 100%;
  display: inline-block !important;
}
div.tutorial_iframe_wrapper {
  position: absolute;
  left: 225px;
  right: 12px;
  height: 90%;
}
span.egw_tutorial_title {
  color: #FFFFFF;
  font-weight: bold;
  text-align: left;
  width: 99%;
  background-color: #434343;
  border: 1px solid #B3B3B3;
  padding-top: 4px;
  padding-left: 5px;
  border-radius: 2px;
  text-overflow: ellipsis;
  white-space: nowrap;
  overflow-x: hidden;
}
/*@import "../less/layout_buttons_global.less";*/
/*@import "../less/layout_chosen.less";*/
/*@import "../less/layout_messages.less";*/
/*@import "../less/layout_content_elements.less";*/
/*@import "../less/layout_table.less";*/
/*@import "../less/layout_loginPage.less";*/
/*@import "../less/layout_raster.less";*/
/*@import "../less/layout_nextmatch.less";*/
/*@import "../less/layout_footer.less";*/
/*@import "../less/layout_dialog.less";*/