ul,ol{
    list-style: none;
}

.todo_wrapper{
    background: #fff;
    padding-bottom: 60px;
    .top{
        .head{
            display: flex;
            height: 45px;
            justify-content: center;
            align-items: center;
            padding: 0 8px;
           
        }
        .nav{
            display: flex;
            justify-content: space-between;
            align-items: center;
            border-bottom: 1px #eeeeee solid;
            li{
                text-align: center;
                height: 40px;
                line-height: 40px;
                font-size: 18px;
                width: 30%;
                span{
                    display: inline-block;
                    height: 40px;
                    line-height: 40px;
                }
            }
            li.selected{
                span{
                    color: #f8002e;
                    border-bottom: 2px #f8002e solid;
                }
                
            }
        }
    }
    .task_content_wrapper{
        .part_wrapper{
            margin-top: 15px;
            position: relative;
            padding: 0 4%;
            ul{
                display: flex;
                flex-wrap: wrap;
           
            }
            ul.part1_list{
                li{
                    width: 31%;
                    text-align: center;
                    height: 35px;
                    line-height: 35px;
                    background: #f6f6f6;
                    border-radius: 10px;
                    margin:5px 1%;
                    position: relative;
                    white-space: nowrap;
                    font-size: 12px;
                }
                li.selected{
                    background: #1b5b99;
                    color: #fff;
                }
            }
            
            .important_mark{
                font-size: 12px;
                color: #a0a0a0;
                display: flex;
                align-items: center;

                span{
                    width: 15px;
                    height: 15px;
                    border-radius: 50%;
                    border: 1px #8d92ad solid;
                    margin-right: 5px;
                }
                span.circle{
                    background: #f8002e;
                    border: none;
                }
            }
            .timeContent{
                display: flex;
                justify-content: space-evenly;
                align-items: center;
                height: 100px;
                overflow: hidden;
                .picker_list{
                    width: 35%;
                }
            }
            ul.part3_list{
                li{
                    width: 25%;
                    text-align: center;
                    display: flex;
                    align-items: center;
                    span{
                        width: 15px;
                        height: 15px;
                        border: 1px #787e9e solid;
                        margin-right: 10%;
                    }
                }
                li.selectedLongTerm{
                   span{
                       background: #1b5b99;
                   } 
                }
            }
        }
    }
   
}

.footer{
    width: 100%;
    min-width: 320px;
    max-width: 640px;
    height: 55px;
    line-height: 55px;
    background: #1b5b99;
    color: #fff;
    text-align: center;
    position: fixed;
    bottom: 70px;
    color: #fff;
    text-align: center;
    width: 100%;
    font-size: 20px;
    font-weight: bold;
}
.link_totast_wrapper{
    .link_mask{
        position: fixed;
        top: 0;
        right: 0;
        left: 0;
        bottom: 0;
        height: 100%;
        z-index: 2001;
        background-color: rgba(0,0,0,.4);
    }
    .link_totast_content_wrapper{
        position: fixed;
        overflow: auto;
        top: 0;
        right: 0;
        bottom: 0;
        left: 0;
        height: 100%;
        z-index: 2001;
        -webkit-overflow-scrolling: touch;
        outline: 0;
        display: -webkit-flex;
        display: flex;
        -webkit-align-items: center;
        align-items: center;
        -webkit-justify-content: center;
        justify-content: center;
        -webkit-transform: translateZ(1px);
        transform: translateZ(1px);
        .link_content{
            width: 270px;
            position: relative;
            background-color: #fff;
            border: 0;
            background-clip: padding-box;
            text-align: center;
            height: auto;
            overflow: hidden;
            border-radius: 7px;
            padding-top: 15px;
            .close{
                background: transparent;
                filter: alpha(opacity=100);
                opacity: 1;
                top: -15px;
                right: 5px;
                position: relative;
            }
            .link_body{
                .title{
                    padding: 10px 15px 20px 15px;
                }
            }
            .link_footer{
                display: flex;
                height: 50px;
                line-height: 50px;
                border-top: 1px #d1d1d1 solid;
                justify-content: space-around;
                div{
                    font-size: 14px;
                    width: 50%;
                }
            }
        }
    }
}