.peoplePickerContainer {
    position: relative;
}

.peoplePickerDisplayArea {
    /*position: absolute;*/
    display: table;
    width: 100%;
}

.peoplePickerDisplayRow {
    display: table-row;
}

.peoplePickerDisplayCell {
    display: table-cell;
    padding: 2px 5px 2px 0px;
    vertical-align: top;
}

    .peoplePickerDisplayCell:last-child {
        width: 72px;
        padding-right: 0px;
    }

.peoplePicker-transparent {
    /*opacity: 0.7;*/
}

.peoplePickerAdvancedButton {
    display: inline-block;
    background-color: lightgray;
    background-image: url("Images/FilterPeoplePickerAdv.png");
    background-repeat: no-repeat;
    background-position: center center;
    border-radius: 4px;
    cursor: pointer;
    height: 34px;
    width: 34px;
    vertical-align: top;
}

.peoplePickerFilterButton {
    display: inline-block;
    background-color: lightgray;
    background-image: url("Images/FilterActive.png");
    background-repeat: no-repeat;
    background-position: center center;
    border-radius: 4px;
    cursor: pointer;
    height: 34px;
    width: 34px;
    vertical-align: top;
}

    .peoplePickerFilterButton.whithoutFilter {
        background-image: url("Images/FilterInactive.png");
    }

.peoplePickerResultArea {
    border: 1px solid gray;
    border-radius: 3px;
    margin-top: 3px;
    margin-bottom: 3px;
    padding: 5px;
    display: block;
    position: absolute;
    min-height: 190px;
    width: 100%;
    min-width: 350px;
    background-color: white;
    z-index: 1;
    color: #222222;
    background-color: white;
    overflow-y: auto;
    max-height: 400px;
}

.peoplePickerResultTable {
    display: table;
    max-height: 230px;
}

.peoplePickerResultHeaderRow {
    display: table-header-group;
    background-color: lightgray;
}

.peoplePickerResultColumn {
    display: table-cell;
    padding: 2px 5px;
}

.peoplePickerResultRow {
    display: table-row;
}

    .peoplePickerResultRow.selected {
        background-color: #eeeeee;
    }

    .peoplePickerResultRow:hover {
        cursor: pointer;
        background-color: #eeeeee;
    }

.peoplePickerResultCell {
    display: table-cell;
    padding: 2px 5px;
}

.peoplePickerGroupArea {
    border: 1px solid gray;
    border-radius: 3px;
    margin-top: 3px;
    margin-bottom: 3px;
    padding: 5px;
    display: block;
    position: absolute;
    min-height: 190px;
    width: 100%;
    min-width: 350px;
    background-color: white;
    z-index: 1;
    color: #222222;
    background-color: white;
}

.peoplePickerGroupHeader {
    border-bottom: 1px solid lightgray;
}

.peoplePickerGroupBtnArea {
    border-top: 1px solid lightgray;
    text-align: right;
    padding: 5px 10px;
}

.peoplePickerGroupTable {
    /*display: table;*/
    max-height: 330px;
    width: 338px;
    overflow-y: auto;
}

.peoplePickerGroupHeaderRow {
    display: table-header-group;
    background-color: lightgray;
}

.peoplePickerGroupColumn {
    display: table-cell;
    padding: 2px 5px;
}

.peoplePickerGroupRow {
    display: table-row;
    width: 338px;
}

    .peoplePickerGroupRow:hover {
        cursor: pointer;
        background-color: #eeeeee;
    }

.peoplePickerGroupCell {
    display: table-cell;
    padding: 2px 5px;
}

/*nur ein Flyout für alle Picker*/
#peoplePickerAdvancedFlyout {
    display: none;
}

#peoplePickerSearchArea {
}

    #peoplePickerSearchArea .filter,
    #peoplePickerSearchArea input[type=text] {
        width: 200px;
    }

    #peoplePickerSearchArea button {
    }

#peoplePickerSearchTitle {
}

#peoplePickerSelectedTitle {
}
/*Anzeige der bisher ausgewählten People in eigener 'Textbox' für multiselect wie im SharePoint*/
#peoplePickerSelectedArea {
}

    #peoplePickerSelectedArea .personItem {
        /*float: left;*/
        margin-right: 10px;
        margin-bottom: 2px;
        padding: 2px 10px;
        background-color: #555554;
        color: white;
        border-radius: 3px;
        display: inline-block;
        font-size: 13px;
        white-space: nowrap;
    }

        #peoplePickerSelectedArea .personItem:hover {
            background-color: #0f6c9c;
        }

        #peoplePickerSelectedArea .personItem .displayName {
        }

        #peoplePickerSelectedArea .personItem .deleteBtn {
            font-weight: 700;
            padding: 3px;
        }

            #peoplePickerSelectedArea .personItem .deleteBtn:hover {
                cursor: pointer;
            }

#peoplePickerAdvancedResultArea {
}