group.css

/* 
#sidebar .include-container {
    padding: .5rem .95rem .5rem .95rem;
} */

.page-content {
    width: 100%;
    padding-left:0px;
    max-width:1280px
}

#sidebar-open {
    float:left;
    margin-right:10px;
}

#sidebar-close {
    float:right; 
    cursor:pointer; 
    padding:10px;
}

.userstitle {
    font-size:22px;
    font-weight:bold;
    padding:5px;
}

#groupdescription {
    padding:5px;
}

#addmember, #createuseraddtogroup, #editgroup, #deletegroup, #create-inputs-feeds {
    display:none;
    float:right;
    margin-left: 10px
}

#groupcreate {
    padding:15px;
    cursor:pointer;
}

#groupcreate:hover {
    background-color: #fafafa;
}
.afeed {
    color:#00aa00;
    font-weight:bold;
}

.nafeed {
    color:#aa0000;
    font-weight:bold;
}

#previous_user{
    display:none;
}

input:disabled+span{
    opacity: 0.4;
}

#userlist-table th.userlistactions{
    padding:0;
    width:20px;
}

#userlist-div{  
    font-weight:normal;
    padding:10px;
    cursor:pointer;
}

#userlist-div .user-info{
    font-weight:normal;
    cursor:pointer;
}



.content-container .user{
    border-top: 1px solid #ccc;
    border-left: 1px solid #ccc;
    border-right: 1px solid #ccc;
    background-color:white;
    padding: 10px;
}

/* .user:nth-child(2) {
    background-color: #f4f4f4;
} */


.user:last-child {
    border-bottom: 1px solid #ccc;
}

.user-feedslist{
    margin-left: -1px;
    padding-top:10px;
}

.user-feedslist input[type="checkbox"] {
    width: 20px;
    height: 20px;
    margin: 0;
    margin-right: 10px;
}

.user-tasks{
    padding:0 5px 5px;
    margin-top:-5px;
}


.feed, .task{
    padding:10px;
    border-top: 1px solid #ccc;
    border-left: 1px solid #ccc;
    border-right: 1px solid #ccc;
    cursor:default
}

.feed:last-child, .task:last-child  {
    border-bottom: 1px solid #ccc;
}

.feed:hover, .task:hover{ border-left:2px solid #44b3e2; }

.feed-value, .feed-time, .feed-download {
    width:60px;
    padding-top:0px;
    float:right;
    text-align:center;
}

.feed input {
    width:20px;
    padding: 10px;
    display:inline-block;
    text-align:center;
}

.feed .feed-name, .task .task-name {
    display:inline-block;
    padding-left:10px

}

.user-name, .user-role, .user-active-feeds{
    width:27%;
    display:inline-block;
    box-sizing:border-box
}
.multiple-feeds-actions{
    width:15%;
    text-align: right;
    display:inline-block;
    box-sizing:border-box
}

.user-actions{
    width:19%;
    display:inline-block;
    text-align:right;
    box-sizing:border-box
}

.user-actions button {
    padding: 0 5px;
    margin: 0 3px 0;
}

.table-headers{
    font-weight: bold;
    padding:5px 5px 0;
    line-height:12px
}

.table-headers .user-name{
    padding-left:10px;
}

.matched-tag:hover{
    background-color:#f2f2f2;
}

#edit-user-tags-wrapper{
    position:relative;
}

#edit-user-matching-tags{
    position:absolute;
    background-color:#fcfcfc;
    padding:5px 15px;
    border: solid #ddd 1px;
    border-radius:5px;
    left:41px;
    top:30px;
    z-index:1;
}

.matched-tag{
    padding:0;
    margin:0;
}

#group-search-box{
    width: 12rem;
}

.user-feedslist-inner .feed, .user-taskslist-inner .task{
    background-color:#f3f3f3; 
    margin:0
}

.user-feedslist-inner > div, .user-taskslist-inner > div {
    background-color:#ddd;
    padding: 5px;
    margin:2px
}

.user-taskslist-inner > div {
    padding-left: 31px
}

.feed:nth-child(2), .task:nth-child(1){
    margin-top:10px
}

input.feed-tag-checkbox{
    margin-right:8px
}

.task div{
    display:inline-block;
    box-sizing: border-box;
}
.user-taskslist-inner > div {
    background-color:#c6c6c6;
}

.task-name{
    min-width:150px;
    width:30%
}

.task-processlist{
    min-width:150px;
    width:30%
}
.task-frequency{
    min-width:120px;
    width:20%;
    margin: 0 15px
}
.task-enabled{
    min-width:10px;
    width:6%;
}

#task-actions{
    width:10%;
    text-align:right
}
#task-actions div{
    margin:0 5px;
}

.email-div{
    padding: 0 50px 25px;
}
.email-div textarea {
    display:block;
    width: 100%;
    height:100px
}


/* Feed ages */
.age-new { color: rgb(50,200,50); }
.age-recent { color: rgb(240,180,20); }
.age-stale { color: rgb(255,125,20); }
.age-ancient { color: rgb(255,0,0); }

/* Notification bar */

#snackbar {
    visibility: hidden;
    min-width: 250px;
    margin-left: -125px;
    background-color: #333;
    color: #fff;
    text-align: center;
    border-radius: 2px;
    padding: 16px;
    position: fixed;
    z-index: 1;
    left: 50%;
    bottom: 30px;
    font-size: 17px;
}

#snackbar.show {
    visibility: visible;
    animation: fadein 0.5s, fadeout 0.5s 2.5s;
}

@keyframes fadein {
    from {bottom: 0; opacity: 0;}
    to {bottom: 30px; opacity: 1;}
}

@keyframes fadeout {
    from {bottom: 30px; opacity: 1;}
    to {bottom: 0; opacity: 0;}
}