
.code{border:1px solid #80cbea;background-color:#fafafa;padding:10px;margin-bottom:15px;}
.code .title{font-size:14px;font-weight:bold;color:#80cbea;border-bottom:1px solid #ddd;margin-bottom:10px;}
#result{border:1px solid #ddd;background-color:#eee;padding:5px 10px;margin:10px 0;}
.observation{color:#f00;}

/* Copy from this line onward to style your select element */
input.sortbyDownInput{font-family:sans-serif;font-weight:normal;width:140px;height:19px;cursor:default;color:#8c8b79;padding:3px 0 0 5px;background:url(../images/back-nice-select.jpg) no-repeat left top;border:0;float:none;font-size:10px;}
input.pagesizeDownInput{font-family:sans-serif;font-weight:normal;height:19px;width:80px;cursor:default;color:#8c8b79;padding:3px 0 0 5px;background:url(../images/back-nice-select_sort.jpg) no-repeat left top;border:0;float:none;font-size:10px;width:80px;}
input.stateDownInput{font-family:Arial,Helvetica,sans-serif;font-weight:normal;height:19px;width:320px;cursor:default;padding:3px 0 0 3px;background:url(../images/bg_prof_select.jpg) no-repeat left top;border:0;float:none;}
#pagesize input.sortbyDownInput, #pagesize input.pagesizeDownInput , #pagesize input.stateDownInput{
	text-indent:5px;
}

ul.sortbyDown{max-height:170px;width:140px;overflow:auto;list-style-type:none;margin:0;padding:0;display:block;position:absolute;display:none;}
ul.sortbyDown li{display:block;height:18px;padding:2px 0 0 5px;margin:0;border:1px solid #ddd;border-bottom:1px solid #fafafa;border-top:0;cursor:pointer;background-color:#fff;}
ul.sortbyDown li.last{border-bottom:1px solid #ddd !important;}
ul.sortbyDown li.over, ul.sortbyDown li.selected{background-color:#FAFAFA;color:#000;}
ul.sortbyDown li.selected{border:1px solid #ddd;}


ul.pagesizeDown{max-height:170px;width:48px;overflow:auto;list-style-type:none;margin:0;padding:0;display:block;position:absolute;display:none;}
ul.pagesizeDown li{display:block;height:18px;padding:2px 0 0 5px;margin:0;border:1px solid #ddd;border-bottom:1px solid #fafafa;border-top:0;cursor:pointer;background-color:#fff;}
ul.pagesizeDown li.last{border-bottom:1px solid #ddd !important;}
ul.pagesizeDown li.over, ul.pagesizeDown li.selected{background-color:#FAFAFA;color:#000;}
ul.pagesizeDown li.selected{border:1px solid #ddd;}



ul.stateDown{max-height:170px;width:320px;overflow:auto;list-style-type:none;margin:0;padding:0;display:block;position:absolute;display:none;z-index:100;}
ul.stateDown li{display:block;height:18px;padding:2px 0 0 5px;margin:0;border:1px solid #ddd;border-bottom:1px solid #fafafa;border-top:0;cursor:pointer;background-color:#fff;}
ul.stateDown li.last{border-bottom:1px solid #ddd !important;}
ul.stateDown li.over, ul.pagesizeDown li.selected{background-color:#FAFAFA;color:#000;}
ul.stateDown li.selected{border:1px solid #ddd;}


/*alert*/
input.todoDownInput{font-family:Arial,Helvetica,sans-serif;font-weight:normal;width:99px;height:19px;cursor:default;color:#8c8b79;padding:3px 0 0 5px;background:url(../images/alert/bg-select-todo.jpg) no-repeat left top;border:0;float:none;font-size:9px;}
ul.todoDown{max-height:170px;width:99px;overflow:auto;list-style-type:none;margin:0;padding:0;display:block;position:absolute;display:none;}
ul.todoDown li{font-size:10px;display:block;height:18px;padding:2px 0 0 5px;margin:0;border:1px solid #ddd;border-bottom:1px solid #fafafa;border-top:0;cursor:pointer;background-color:#fff;}
ul.todoDown li.last{border-bottom:1px solid #ddd !important;}
ul.todoDown li.over, ul.sortbyDown li.selected{background-color:#FAFAFA;color:#000;}
ul.todoDown li.selected{border:1px solid #ddd;}


input.taskcatInput{font-family:Arial,Helvetica,sans-serif;margin-top:5px;margin-left:8px;font-weight:normal;width:221px;height:19px;cursor:default;color:#8c8b79;padding:3px 0 0 5px;background:url(../images/alert/bg-select-cat.jpg) no-repeat left top;border:0;float:none;font-size:9px;}
ul.taskcat{max-height:170px;width:226px;overflow:auto;list-style-type:none;margin:0;padding:0;display:block;position:absolute;display:none;}
ul.taskcat li{display:block;height:18px;padding:2px 0 0 5px;margin:0;border:1px solid #ddd;border-bottom:1px solid #fafafa;border-top:0;cursor:pointer;background-color:#fff;}
ul.taskcat li.last{border-bottom:1px solid #ddd !important;}
ul.taskcat li.over, ul.sortbyDown li.selected{background-color:#FAFAFA;color:#000;}
ul.taskcat li.selected{border:1px solid #ddd;}

input.tasknameInput{font-family:Arial,Helvetica,sans-serif;margin-top:5px;margin-left:8px;font-weight:normal;width:222px;height:19px;cursor:default;color:#8c8b79;padding:3px 0 0 5px;background:url(../images/alert/bg-select-taskname.jpg) no-repeat left top;border:0;float:none;font-size:9px;}
ul.taskname{max-height:170px;width:227px;overflow:auto;list-style-type:none;margin:0;padding:0;display:block;position:absolute;display:none;}
ul.taskname li{display:block;height:18px;padding:2px 0 0 5px;margin:0;border:1px solid #ddd;border-bottom:1px solid #fafafa;border-top:0;cursor:pointer;background-color:#fff;}
ul.taskname li.last{border-bottom:1px solid #ddd !important;}
ul.taskname li.over, ul.sortbyDown li.selected{background-color:#FAFAFA;color:#000;}
ul.taskname li.selected{border:1px solid #ddd;}


input.monthInput{font-family:Arial,Helvetica,sans-serif;margin-top:5px;margin-bottom:3px;margin-left:8px;font-weight:normal;width:75px;height:19px;cursor:default;color:#8c8b79;padding:3px 0 0 5px;background:url(../images/alert/bg-select-month.jpg) no-repeat left top;border:0;float:none;font-size:9px;}
ul.month{max-height:170px;width:80px;overflow:auto;list-style-type:none;margin:0;padding:0;display:block;position:absolute;display:none;}
ul.month li{display:block;height:18px;padding:2px 0 0 5px;margin:0;border:1px solid #ddd;border-bottom:1px solid #fafafa;border-top:0;cursor:pointer;background-color:#fff;}
ul.month li.last{border-bottom:1px solid #ddd !important;}
ul.month li.over, ul.sortbyDown li.selected{background-color:#FAFAFA;color:#000;}
ul.month li.selected{border:1px solid #ddd;}


input.dayInput{font-family:Arial,Helvetica,sans-serif;margin-top:5px;margin-bottom:3px;margin-left:3px;font-weight:normal;width:52px;height:19px;cursor:default;color:#8c8b79;padding:3px 0 0 5px;background:url(../images/alert/bg-select-day.jpg) no-repeat left top;border:0;float:none;font-size:9px;}
ul.day{max-height:170px;width:57px;overflow:auto;list-style-type:none;margin:0;padding:0;display:block;position:absolute;display:none;}
ul.day li{display:block;height:18px;padding:2px 0 0 5px;margin:0;border:1px solid #ddd;border-bottom:1px solid #fafafa;border-top:0;cursor:pointer;background-color:#fff;}
ul.day li.last{border-bottom:1px solid #ddd !important;}
ul.day li.over, ul.sortbyDown li.selected{background-color:#FAFAFA;color:#000;}
ul.day li.selected{border:1px solid #ddd;}


input.yearInput{font-family:Arial,Helvetica,sans-serif;margin-top:5px;margin-bottom:3px;margin-left:3px;font-weight:normal;width:72px;height:19px;cursor:default;color:#8c8b79;padding:3px 0 0 5px;background:url(../images/alert/bg-select-year.jpg) no-repeat left top;border:0;float:none;font-size:9px;}
ul.year{max-height:170px;width:77px;overflow:auto;list-style-type:none;margin:0;padding:0;display:block;position:absolute;display:none;}
ul.year li{display:block;height:18px;padding:2px 0 0 5px;margin:0;border:1px solid #ddd;border-bottom:1px solid #fafafa;border-top:0;cursor:pointer;background-color:#fff;}
ul.year li.last{border-bottom:1px solid #ddd !important;}
ul.year li.over, ul.sortbyDown li.selected{background-color:#FAFAFA;color:#000;}
ul.year li.selected{border:1px solid #ddd;}

input.monthlyInput{font-family:Arial,Helvetica,sans-serif;margin-top:5px;margin-bottom:3px;margin-left:3px;font-weight:normal;width:96px;height:19px;cursor:default;color:#8c8b79;padding:3px 0 0 5px;background:url(../images/alert/bg-select-date.jpg) no-repeat left top;border:0;float:none;font-size:9px;}
ul.monthly{max-height:170px;width:101px;overflow:auto;list-style-type:none;margin:0;padding:0;display:block;position:absolute;display:none;}
ul.monthly li{display:block;height:18px;padding:2px 0 0 5px;margin:0;border:1px solid #ddd;border-bottom:1px solid #fafafa;border-top:0;cursor:pointer;background-color:#fff;}
ul.monthly li.last{border-bottom:1px solid #ddd !important;}
ul.monthly li.over, ul.sortbyDown li.selected{background-color:#FAFAFA;color:#000;}
ul.monthly li.selected{border:1px solid #ddd;}


input.protypeInput{font-family:Arial,Helvetica,sans-serif;margin-top:5px;margin-left:8px;font-weight:normal;width:221px;height:19px;cursor:default;color:#8c8b79;padding:3px 0 0 5px;background:url(../images/alert/bg-select-cat.jpg) no-repeat left top;border:0;float:none;font-size:9px;}
ul.protype{max-height:170px;width:226px;overflow:auto;list-style-type:none;margin:0;padding:0;display:block;position:absolute;display:none;}
ul.protype li{display:block;height:18px;padding:2px 0 0 5px;margin:0;border:1px solid #ddd;border-bottom:1px solid #fafafa;border-top:0;cursor:pointer;background-color:#fff;}
ul.protype li.last{border-bottom:1px solid #ddd !important;}
ul.protype li.over, ul.sortbyDown li.selected{background-color:#FAFAFA;color:#000;}
ul.protype li.selected{border:1px solid #ddd;}
