﻿#cel_datepicker {
    position: absolute;
    background-color: #ffffff;
    border-radius: 15px;
    color: hsl(0, 0%, 13.3%);
    box-shadow: 2px 12px 13px hsl(0deg 0% 48.24% / 19%);
    z-index: 3001;
    outline: none;
	padding:10px;
}

.cal_dlg {
    width: 300px;
    height: 290px;
    z-index: 3000;
}

    .cal_dlg .cal_dlg_title {
        width: 100%;
		padding-bottom:10px;
    }

        .cal_dlg .cal_dlg_title .cal_pp_list_title {
            color: #3b3939;
            margin-left: 10px;
            line-height: 40px;
            font-size: 1.3em;
            width: 70%;
            display: flex;
            flex-direction: row;
            flex-wrap: nowrap;
        }
        .cal_dlg .cal_dlg_title .cal_title_mth {
            margin-right: 5px;
            cursor: pointer;
        }
        .cal_dlg .cal_dlg_title .cal_title_yr {
            cursor: pointer;
        }

    .cal_dlg .cal_nav_prev {
        width: 40px;
        height: 40px;
        line-height: 40px;
        cursor: pointer;
    }

        .cal_dlg .cal_nav_prev:after {
            content: 'keyboard_arrow_left';
            font-size: 22pt;
        }

    .cal_dlg .cal_nav_next {
        width: 40px;
        height: 40px;
        line-height: 40px;
        cursor: pointer;
    }

        .cal_dlg .cal_nav_next:after {
            content: 'keyboard_arrow_right';
            font-size: 22pt;
        }

     .cal_dlg .cal_data {
    }

    .cal_dlg .cal_tb {
        width: 96%;
        margin-left: 2%;
        margin-right: 2%;
    }

        .cal_dlg .cal_tb th {
            font-weight: normal;
        }
        
        .cal_dlg .cal_tb td {
            width: 14.3%;
        }

    .cal_dlg .cal_header_row {
        text-align: center;
        line-height: 25px;
        font-size: 9pt;
        border-bottom: 1px solid hsl(210,32%,71%);
    }

        .cal_dlg .cal_header_row .cal_day_header {
            color: #828282;
        }

        .cal_dlg .cal_header_row .cal_wday_header {
        }

        .cal_dlg .cal_header_row .cal_wend_header {
        }

    .cal_dlg .cal_day_row {
        font-size: 1em;
        border-bottom: 1px solid hsl(210,32%,71%);
    }

        .cal_dlg .cal_day_row .cal_day_cell {
            text-align: center;
            cursor: pointer;
            color: #3b3939;
        }

        .cal_dlg .cal_day_row .cal_wday {
            height: 30px;
            line-height: 30px;
        }

        .cal_dlg .cal_day_row .cal_wend {
            height: 30px;
            line-height: 30px;
            color: #3b3939;
        }

        .cal_dlg .cal_day_row .cal_sel_day {
            background-color: hsl(211,21%,77%);
            color: #000;
        }

        .cal_dlg .cal_day_row .cal_today {
            background-color: hsl(211,21%,77%);
        }

        .cal_dlg .cal_day_row .cal_out_of_range {
            background-color: #ffffff;
            cursor: default;
            border: 0;
        }
    
        
    /***************************/
    /* for nav by year/month */
    /***************************/
    .cal_dlg .cal_il {
        width:100%;
        height: 240px;
    }

    .cal_dlg .cal_il_r {
        width:100%;
        height: 25%;
        border-bottom: 1px solid hsl(210,32%,71%);
    }
    .cal_dlg .cal_il_cell {
        width:33%;
        padding: 20px 10px;
        text-align: center;
        color: hsl(55, 91%, 72%);
        cursor: pointer;
    }