.min400{
    min-height: 400px;
}
.ListDiv{
    max-height: 86vh;
    max-width: 90%;
    aspect-ratio: 9 / 16;
    margin: 0 auto;
    border-radius: 10px;
    border: 1px solid var(--header_bg);
    position: relative;
    background-size:contain;
    background-repeat: no-repeat;
}
.TaskListContainer{
    /*height: 98%;*/
    overflow-y: auto;
}
.ListContainerNoOverflow{
    height: 98%;
    overflow: hidden;
}
.ListHeadDiv{
    /*min-width: 225px;*/
    /*min-height: 400px;*/
    /*width: 18%;*/
    height: 33vh;
    aspect-ratio: 9 / 16;
    border-radius: 10px;
    border: 1px solid var(--header_bg);
    display: inline-block;
    position: relative;
    background-size:contain;
    background-repeat: no-repeat;
    float: right;
    margin-left: 20px;
    margin-bottom: 20px;
}
.ListHeadDiv h3{
    position: absolute;
    top:0;
    background-color: var(--header_bg);
    width: 100%;
    margin: 0;
    border-top-left-radius: 10px;
    border-top-right-radius: 10px;
    text-align: center;
    font-size: 90%;
}
/*
.ListHeadDiv form{
    text-align: center;
    position: absolute;
    bottom:0px;
    width: 30%;
}
.ListHeadDiv .right_third{
    right: 0;
}
.ListHeadDiv .left_third{
    left: 0;
}
.ListHeadDiv button{
    background-color: transparent;
    background-repeat: no-repeat;
    background-position: center center;
    background-size: contain;
    height: 40px;
    width: 40px;
    border: none;
    cursor: pointer;
}
*/

.GoToPrev,.GoToNext{
    position: absolute;
    top: 46vh;
    z-index: 111;
}
.GoToPrev{
    right: 0;
}
.GoToNext{
    left: 0;
}
.PrevListBtn , .NextListBtn{
    background-color: transparent;
    background-repeat: no-repeat;
    background-position: center center;
    background-size: contain;
    height: 40px;
    width: 40px;
    border: none;
    display: block;
    cursor: pointer;
}
.PrevListBtn{
    background-image: url("/images/prevList.png");
 }
.NextListBtn{
    background-image: url("/images/nextList.png");
 }

.ListOfTopTasks{
    margin-top: 40px;
    overflow: hidden;
    height: calc(90% - 40px);
}

.ListSubMenu{
    position: absolute;
    left: 0;
    bottom: 1px;
}
.toggleListSubMenuBtn{
    position: absolute;
    left: 0;
    bottom: 0;
    width: 40px;
    height: 30px;
    background-color: transparent;
    background-image: url("/images/dot3_in_box.png");
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center center;
    border: none;
    margin-left: 3px;
    cursor: pointer;
}
.threeDotsContentList{
    position: absolute;
    left: 10px;
    bottom: 30px;
    z-index: 444;
    width: 130px;
    background-color: white;/* #eeeeee; */
}
.threeDotsContentList button{
    background-color: transparent;
    padding: 10px 5px;
    padding-right: 45px;
    background-repeat: no-repeat;
    background-position: right center;
    background-size: contain;
    height: 40px;
    width: 100%;
    border: none;
    border-top: 1px solid black;
    border-bottom: 1px solid black;
    margin-bottom: 3px;
    display: block;
    cursor: pointer;
    font-size: 11px;
}

.LogOutBtn{
    background-image: url("/images/logout.png");
}
.ProfileBtn{
    background-image: url("/images/profile.png");
}
.AboutBtn{
    background-image: url("/images/info.png");
}
.LogInBtn{
    background-image: url("/images/login.png");
}

.list_Star{
    background-image: url("/images/star_on.png?c=2");
}
.list_UnStar{
    background-image: url("/images/star_off.png?c=2");
}
.list_Share{
    background-image: url("/images/share_btn.png?c=2");
}
.list_DelBtn{
    background-image: url("/images/trash.png?c=2");
}
.list_DelDone{
    background-image: url("/images/DelDone.png?c=2");
}
.list_DoneDown{
    background-image: url("/images/DoneDown.png?c=2");
}
.list_starred{
    position: absolute;
    right: 0;
    bottom: 0;
    width: 30px;
    height: 30px;
    background-color: transparent;
    background-image: url("/images/star.png?c=2");
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center center;
    border: none;
    margin-left: 3px;
}
.list_shared{
    position: absolute;
    right: 40px;
    bottom: 0;
    width: 30px;
    height: 30px;
    background-color: transparent;
    background-image: url("/images/sharing_on.png?c=2");
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center center;
    border: none;
    margin-left: 3px;
}
.plusInput{
    background: none;
    border-radius: 5px;
    font-size: 120%;
    width: 50%;
}
.plusBtn{
    background-color: transparent;
    border: none;
    cursor: pointer;
    width:  20px;
    height: 20px;
    background-image: url("/images/plus.png");
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center center;
    padding: 0px;
    /*position: relative;*/
    /*top: 6px;*/
}
.RemoveUserFromShare{
    background-color: transparent;
    padding-right: 45px;
    background-repeat: no-repeat;
    background-position: right center;
    background-size: contain;
    height: 30px;
    width: 90%;
    border: none;
    line-height: 30px;
    margin-bottom: 10px;
    margin-right: 5%;
    display: block;
    cursor: pointer;
    text-align: right;
    background-image: url("/images/trash.png?c=2");
}
.RemoveShare{
    background-color: rgba(139, 0, 0, 0.6);
    color: white;
    border-radius: 5px;
    padding-right: 45px;
    background-repeat: no-repeat;
    background-position: right center;
    background-size: contain;
    height: 30px;
    width: 80%;
    border: none;
    line-height: 30px;
    margin-bottom: 10px;
    margin-right: 10%;
    display: block;
    cursor: pointer;
    text-align: right;
    background-image: url("/images/trash.png?c=2");
}

.lowerMenu{
    position: relative;
    position: -webkit-sticky;
    position: sticky;
    bottom: 0;
    background-color: var(--header_bg);
    width: 100%;
    height: var(--header_size);
}
.addNewList{
    background-color: transparent;
    /*background-color: var(--side_bg);*/
    /*color: var(--side_text);*/
    border: none;
    /*padding: 3px 6px;*/
    cursor: pointer;
    /*border-radius: 10px;*/
    width:  30px;
    height: 30px;
    background-image: url("/images/plus.png");
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center center;
    padding: 0px;
    position: absolute;
    left: calc(50% - 15px);
    top: 5px;
}
.ListFilterSubMenu{
    position: absolute;
    right: 5px;
    bottom: 1px;
}
.toggleFilterMenuBtn{
    position: absolute;
    right: 0;
    bottom: 0;
    width: 30px;
    height: 30px;
    background-color: transparent;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center center;
    border: none;
    margin-left: 3px;
    cursor: pointer;
}
.FilterEmpty{
    background-image: url("/images/filter_btn.png?c=2");
}
.FilterFull{
    background-image: url("/images/filter_btn_full.png?c=2");
}
.FilterSubMenu{
    position: absolute;
    right: 1px;
    bottom: 30px;
    z-index: 444;
    width: 130px;
    background-color: white;/* #eeeeee; */
}
.FilterSubMenu button{
    background-color: transparent;
    padding: 10px 5px;
    padding-right: 45px;
    background-repeat: no-repeat;
    background-position: right center;
    background-size: contain;
    height: 40px;
    width: 100%;
    border: none;
    border-top: 1px solid black;
    border-bottom: 1px solid black;
    margin-bottom: 3px;
    display: block;
    cursor: pointer;
}

/*.FavorLists{*/
/*    background-color: transparent;*/
/*    border: none;*/
/*    cursor: pointer;*/
/*    width:  30px;*/
/*    height: 30px;*/
/*    background-size: contain;*/
/*    background-repeat: no-repeat;*/
/*    background-position: center center;*/
/*    padding: 0px;*/
/*    position: absolute;*/
/*    right: 5px;*/
/*    top: 5px;*/
/*}*/
.filterMenuItemSelected{
    background-color: #d8d9d9 !important;
}
.showFavorites{
    background-image: url("/images/star.png?c=2");
}
.showAllLists{
    background-image: url("/images/star_empty.png?c=2");
}
.showShared{
    background-image: url("/images/sharing_on.png?c=2");
}
.showSharedAndNot{
    background-image: url("/images/sharing_off.png?c=2");
}
.smallLogo{
    position: absolute;
    left: 5px;
    top: 2px;
}
.smallLogo img{
    height: 36px;
}