#calendar_div{ float: none; margin-top: 40px; }
div#calendar_div select {padding: 0px 0px 0px 0px !important;}
body{ font-family: sans-serif;}
.none{ display:none; }
#event_add, #event_list1, #event_list, #event_update, #assign_shift, #allocate_employee, #remove_employee, #edit_employee, #remove_shift, #accept_shift, #reject_shift, #request_shift, #approve_shift_request, #reject_shift_request { border: 1px solid #cccccc; padding: 10px; }
#event_add, #event_list, #event_update, #shift_list, #assign_shift, #allocate_employee,#remove_employee,#edit_employee,#remove_shift,#accept_shift,#reject_shift,#request_shift,#approve_shift_request,#reject_shift_request {
    width: 98%;
    margin-left: 1%;
    background: #fafafa;
}
#event_list
 table, #event_list
 th, #event_list
 td {
    border: 1px solid #ccc;
    text-shadow: none;
    color: #444;
    background: #fff;
}

#event_list th {
    background: #f1f1f1;
    padding: 4px 0;
    border-bottom: 2px solid #bbb;
    text-shadow: 1px 1px 1px rgba(255,255,255,0.9);
    text-align: left;
    text-indent: 10px;
    font-weight: bold;
    color: #888;
}
#event_add b, #event_update b { display: block; width: 150px; float: left; font-weight: 100; }
/* .dropdown{color: #444444;font-size:17px;} */
#calender_section{ width:auto; margin:30px auto 0;}
#calender_section h2{
    /* background-color:#e64611;  */
    background-color:#337ab7;
    color:#444444;
    font-size:17px;
    text-align:left;
    /* line-height:40px;
    padding: 10px 0 0 20px; */
    padding: 10px 0 7px 20px;
    width: 98%;
    margin-left: 1%;
}
#calender_section h2.text-white{ color:#ffffff; }
#calender_section h2 a{
    /* color:#F58220;  */
    float:none;
    text-decoration: none;
    /* vertical-align: super; */
    /* margin-right: 20px; */
}
#calender_section h2 a.text-white{ color:#ffffff !important; }
#event_add h2, #event_list h2, #event_update h2 , #shift_list h2, #assign_shift h2, #allocate_employee h2,#remove_employee h2,#edit_employee h2,#remove_shift h2,#accept_shift h2,#reject_shift h2,#request_shift h2,#approve_shift_request h2,#reject_shift_request h2 {
    color: #fff;
    width: 100%;
    margin-left: 0;
    line-height: normal;
    margin-top: 0;
    background: grey;
}
#calender_section_top{
    width:100%;
    float:left;
    margin-top:20px;
    margin-left: 1%;
}
#calender_section_top ul{padding:0; list-style-type:none; margin: 0;}
#calender_section_top ul li{
    float:left;
    display:block;
    width:14%;
    /* border-right:1px solid #fff; */
    /* text-align:center;  */
    font-size:14px;
    min-height:0;
    /* background:none;  */
    box-shadow:none;
    margin:0;
    /* padding:0; */
    background: #f1f1f1;
    border: 1px solid #ddd;
    padding: 4px 0;
    /* border-right: 1px solid #bbb; */
    border-bottom: 2px solid #bbb;
    text-shadow: 1px 1px 1px rgba(255,255,255,0.9);
    text-align: left;
    text-indent: 10px;
    font-weight: bold;
    color: #888;
}
#calender_section_top.weekly ul li{ width:12%; }
#calender_section_top.rota-weekly ul li{ width:9%; }
#calender_section_top.rota-weekly.dayview ul li{ width:7%; }
#calender_section_bot{
    width:100%;
    /* margin-top:20px; */
    float:left;
    border-left:1px solid #ccc;
    border-bottom:1px solid #ccc;
    margin-top: 0;
    margin-left: 1%;
}
#calender_section_bot.day{ width:80%; margin:40px 0 0 10%; float:left; border-left:1px solid #ccc; border-bottom:1px solid #ccc;}
#calender_section_bot.weekly.attendance ul li{ width:100%; }
#calender_section_bot.weekly ul li{ width:12%; }
#calender_section_bot.rota-weekly ul li{ width:9%; height:150px; }
#calender_section_bot.rota-weekly.dayview ul li{ width:7%; height:150px;     word-wrap: break-word; }
#calender_section_bot.day{ width:80%; margin:40px 0 0 10%; float:left; border-left:1px solid #ccc; border-bottom:1px solid #ccc;}
#calender_section_bot ul{ margin:0; padding:0; list-style-type:none;}
#calender_section_bot ul li{
    float:left; width:14%;
    /* height:150px;  */
    height: 100px;
    text-align:center;
    border-top:1px solid #ccc;
    border-right:1px solid #ccc;
    min-height:0; background:none;
    box-shadow:none; margin:0;
    padding:0;
    position:relative;
}
#calender_section_bot ul li span{ /* margin-top: 7px; */ float: left; margin-left: 3px; text-align: left; width: 92%; }

#calendar_div.multipleul #calender_section_bot ul { height: auto; }
#calendar_div.multipleul #calender_section_bot ul li { height: 100%; }
.img-hover { width: 27px; }
#calendar_div.multipleul #calender_section .form-actions { float: none; }
#calendar_div.multipleul #calender_section p b { width: 150px; display: inline-block; vertical-align: super; }
.chzn-container { width: 300px!important; }
.none p { color: #277160 !important; }
.none p b { font-weight: 100; color: #277160 !important; }
/*
#calendar_div.multipleul #calender_section_bot ul .date_cell span.title { border-radius: 0; font-size: 11px; margin: 0; text-align: center; width: 100%; min-height: 80px; float: left; height: 100%; }
#calendar_div.multipleul #calender_section p .chzn-container { width: 222px!important; text-align: left; }
*/

/* table, td, th {
    border: 1px solid black ;
} */

table {
    border-collapse: collapse;
    width: 100%;
}
th, td {
    padding: 13px;
    text-align: left;
    }
.grey{
    /* background-color:#DDDDDD !important; */
    border-top: 3px solid #aaa !important;
    background: #efefef !important;
}
.light_sky{
    /* background-color:#B9FFFF !important; */
}

/*========== Hover Popup ===============*/
.date_cell { cursor: pointer; cursor: hand; }
.date_cell:hover { background: #DDDDDD !important; }
.date_popup_wrap {
    position: absolute;
    width: 100%;
    height: 100%;
    z-index: 9999;
    top: 0px;
    /* left:-55px; */
    left:0;
    background: #8bc34a;
    color: #FFF !important;
    text-shadow: none;
}
.events_window {
    overflow: hidden;
    overflow-y: auto;
    width: 133px;
    height: 115px;
    margin-top: 28px;
    margin-left: 25px;
}
.event_wrap {
    margin-bottom: 10px; padding-bottom: 10px;
    border-bottom: solid 1px #E4E4E7;
    font-size: 12px;
    padding: 3px;
}
.date_window {
    margin-top:20px;
    margin-bottom: 2px;
    padding: 5px;
    font-size: 16px;
    margin-left:9px;
    margin-right:14px
    /* font-size: 14px; */
    /* margin-top: 15px; */
}
.popup_event {
    margin-bottom: 2px;
    padding: 2px;
    font-size: 16px;
    width:100%;
    /* font-size: 15px; */
}

.popup_event a {color: #000000 !important;}
.packeg_box a {color: #F58220;float: right;}
a:hover {color: #181919;text-decoration: underline;}

@media only screen and (min-width:480px) and (max-width:767px) {
#calender_section{ width:336px;}
#calender_section_top ul li{ width:47px;}
#calender_section_bot ul li{ width:47px;}
}
@media only screen and (min-width: 320px) and (max-width: 479px) {
#calender_section{ width:219px;}
#calender_section_top ul li{ width:30px; font-size:11px;}
#calender_section_bot ul li{ width:30px;}
#calender_section_bot{ width:217px;}
#calender_section_bot ul li{ height:50px;}
}

@media only screen and (min-width: 768px) and (max-width: 1023px) {
#calender_section{ width:530px;}
#calender_section_top ul li{ width:74px;}
#calender_section_bot ul li{ width:74px;}
#calender_section_bot{ width:525px;}
#calender_section_bot ul li{ height:50px;}
}

#calender_section_bot .week li { float: none; width:100%; } */
#calender_section_bot .week li span { float: left; height:100%; display:block; width:275px; margin:0px; }
#calender_section_bot ul .date_cell span.title { /* border-radius: 10px; font-size: 11px; margin-top: 3px; text-align: center;  */ border-radius: 0; font-size: 14px !important; margin-top: 3px; text-align: center; text-shadow: none; color: #fff; background: #8BC34A; }
#calendar_div .progress-group { text-align: center; margin-bottom: 10px; }
#calendar_div .progress-group .progress-text { margin-left: 10px; margin-right: 10px; font-size: 17px; }
#calendar_div .progress-group .progress { margin: 4px; }
#calendar_div .progress-group .progress-bar { width: 100%; height: auto; line-height: normal; }

#calendar_div .progress-group .shiftStyle1, #calender_section_bot ul .date_cell span.title.shiftStyle1 { background: none; border: 1px solid #449d44; background-color: #449d44; color: white; }
#calendar_div .progress-group .shiftStyle2, #calender_section_bot ul .date_cell span.title.shiftStyle2 { background: none; border: 1px solid #357ebd; background-color: #357ebd; color: white; }
#calendar_div .progress-group .shiftStyle3, #calender_section_bot ul .date_cell span.title.shiftStyle3 { background: none; border: 1px solid #c9302c; background-color: #c9302c; color: white; }
#calendar_div .progress-group .shiftStyle4, #calender_section_bot ul .date_cell span.title.shiftStyle4 { background: none; border: 1px solid #ec971f; background-color: #ec971f; color: white; }
#calendar_div .progress-group .shiftStyle5, #calender_section_bot ul .date_cell span.title.shiftStyle5 { background: none; border: 1px solid #337ab7; background-color: #337ab7; color: white; }
#calendar_div .progress-group .shiftStyle6, #calender_section_bot ul .date_cell span.title.shiftStyle6 { background: none; border: 1px solid #5bc0de; background-color: #5bc0de; color: white; }
#calendar_div .progress-group .shiftStyle7, #calender_section_bot ul .date_cell span.title.shiftStyle7 { background: none; border: 1px solid #39a38f; background-color: #39a38f; color: white; }
#calendar_div .progress-group .shiftStyle8, #calender_section_bot ul .date_cell span.title.shiftStyle8 { background: none; border: 1px solid #dd5600; background-color: #dd5600; color: white; }
#calendar_div .progress-group .shiftStyle9, #calender_section_bot ul .date_cell span.title.shiftStyle9 { background: none; border: 1px solid #009688; background-color: #009688; color: white; }
#calendar_div .progress-group .shiftStyle10, #calender_section_bot ul .date_cell span.title.shiftStyle10 { background: none; border: 1px solid #795548; background-color: #795548; color: white; }
#calendar_div .progress-group .shiftStyle11, #calender_section_bot ul .date_cell span.title.shiftStyle11 { background: none; border: 1px solid #607d8b; background-color: #607d8b; color: white; }
#calendar_div .progress-group .shiftStyle12, #calender_section_bot ul .date_cell span.title.shiftStyle12 { background: none; border: 1px solid #ff5722; background-color: #ff5722; color: white; }
.btn-primary {color: #ffffff !important;}