body { font-family: sans-serif; }
.none { display:none; }
.dropdown { color: #444444; font-size:17px; }

#calender_section .col-sm-4 h2 { background-color:#7d7d7d; color:#fff; font-size:17px; text-align:center; line-height:40px; float: left; width:100%; margin-bottom: 0px; padding: 2px 0px; margin-top: 0px; }
#calender_section_top { width:100%; float:left; margin-top:20px; }
#calender_section_top ul { padding:0; list-style-type:none; }
#calender_section_top ul li { float:left; display:block; width:99px; border-right:1px solid #fff; text-align:center; font-size:14px; min-height:0; background:none; box-shadow:none; margin:0; padding:0; }
#calender_section_bot { width:100%; margin-top:20px; 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:99px; height:80px; 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:7px; text-align:center; }
.grey { background-color:#d1befe !important; }
.light_sky { background-color:#; color:#8a58ff; }
.light_sky a{color: #8a58ff;
    float: left;
    position: relative;
    text-align: center;
    width: 100%; }
 .light_sky a:hover{color: #8a58ff;}   
    

.light_sky a span{ position: absolute;
    width: 100%;
    /* left: 50%; */
    right: 0%;
    z-index: 1100000;}
/*========== Hover Popup ===============*/
.date_cell { cursor: pointer; cursor: hand; }
.date_cell:hover { background: #DDDDDD !important; }
.date_popup_wrap { position: absolute; width: 143px; height: 115px; z-index: 9999; top: -115px; left:-55px; /* background: transparent url(add-new-event.png) no-repeat top left; */
	color: #666 !important; }
.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 }
.popup_event { margin-bottom: 2px; padding: 2px; font-size: 16px; width:100%; }
.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:100%;
}
#calender_section_top ul li {
width:100%;
}
#calender_section_bot ul li {
width:100%;
}
}
@media only screen and (min-width: 320px) and (max-width: 479px) {
#calender_section {
width:100%
}
#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: 100%;
}
#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 button,
select { text-transform: none; border:0px; background:#c3c3c3; font-size:25px; }

#calender_section_top_bot table { margin-bottom:0px; }
#calender_section_top_bot table thead { background:#ffffff; }
#calender_section_top_bot table thead { border:0px; }

#calender_section select option.font_small { font-size: 16px; padding:10px;  background: #;
text-transform:capitalize; }
#calender_section .dropdown,

#calender_section .col-sm-8 { padding:0px; }
#calender_section .col-sm-4 { padding:0px; }
.disp_events { float:left; width:100%;  font-family: "Roboto", sans-serif;}

.mnth_selected { width: 100%; text-align: center; float: left; font-size:25px; font-weight: bold; padding:0px; }
.mnth_selected p { text-align:center; border-bottom:1px solid #000; width:45%; margin:auto }
.disp_events span { float: left; width: 100%; text-align: center; }
.disp_events ul{ padding:0% 0% 0% 30%; margin:0px; float:left; width:100%; }
.disp_events ul li{     float: left;
    margin: 0px;
    padding: 0px;
    list-style: none;
    width: 100%; text-align:left;}
.disp_events ul li a { text-decoration:none; float:left; font-size:18px; line-height:20px; padding:8px 0px; width:100%; color:#000; text-align:left;}
.disp_events ul li a:hover{color:#8953ff;}
.disp_events a { text-decoration:none; float:left; font-size:18px; line-height:20px; padding:1% 0% 0% 0%; width:100%; color:#000; text-align:center; }

@media only screen and (min-width:601px) and (max-width:6000px) {
 #calender_section select { -webkit-appearance: none; -webkit-appearance: none; font-size: 25px; text-transform: uppercase; top: 3px; font-weight: bold;     width: 150px; }
 .day_selected { width: 100%; text-align: center; float: left; font-size: 58px;     line-height: 45px; font-weight: bold; padding-top: 10px; width:100%; position:relative; }
 #calender_section { width:100%; margin:30px 0px; float:left; border: 3px solid #8852ff; background:#fff }
#calender_section .col-sm-8 h2 { background-color:#c3c3c3; color:#444444; font-size:17px; text-align:center; line-height:40px; float: left; width:100%; margin-bottom: 0px; margin-top: 0px; }
#calender_section .col-sm-8 h2 a { color:#000000; float:none; padding-left: 0px; }
#calender_section .col-sm-8 h2 a i { text-decoration: none; width: 25px; height: 25px; cursor: pointer; color: #fff; border: 1px solid #fff; border-radius: 50%; background: #8a8a89; text-align: center; float: none; padding: 2px 0px 0px 0px; margin: 0px; vertical-align: middle; line-height: 20px; top: -2px; position: relative; font-size: 19px; }
 #calender_section .col-sm-8 h2 a:nth-child(1) {
padding-right:70px;
}   

.dropup { position: relative; width: 150px; }
    
#calender_section_top_bot table thead th { border:0px; text-transform:uppercase; font-size:25px; color:#000; font-weight:bold; text-align:center; font-family: "Roboto", sans-serif;}
#calender_section_top_bot .table-bordered { border-top:0px; }
#calender_section_top_bot table tbody td { background:#fff; padding:25px 10px; font-size:25px; font-weight:bold; border:#6b6b6b 1px solid; text-align:center; font-family: "Roboto", sans-serif;}   
  }


@media only screen and (min-width:400px) and (max-width:600px) {
#calender_section select { -webkit-appearance: none; -webkit-appearance: none; font-size:12px; text-transform: uppercase; top: 3px; font-weight: bold; }    
    
    .day_selected { width: 120%; text-align: center; float: left; font-size:14px;     line-height:20px; font-weight: bold; padding-top: 10px; width:100%; position:relative; }
   .dropup { position: relative; width:100px; } 
    
 #calender_section { width:100%; margin:30px 0px; float:left; border: 3px solid #8852ff; background:#fff }
#calender_section .col-sm-8 h2 { background-color:#c3c3c3; color:#444444; font-size:12px; 
text-align:center; line-height:20px; float: left; width:100%; margin-bottom: 0px; margin-top: 0px; padding:8px 0px; }
#calender_section .col-sm-8 h2 a { color:#000000; float:none; padding-left: 0px; font-size: 12px; }
#calender_section .col-sm-8 h2 a i { text-decoration: none; width:15px; height:15px; cursor: pointer; color: #fff; border: 1px solid #fff; border-radius: 50%; background: #8a8a89; text-align: center; float: none; padding: 2px 0px 0px 0px; margin: 0px; vertical-align: middle; line-height: 8px; top: -2px; position: relative; font-size:10px; }
 #calender_section .col-sm-8 h2 a:nth-child(1) {
padding-right:20px;
}   
    
#calender_section_top_bot table thead th { border:0px; text-transform:uppercase; font-size:16px; color:#000; font-weight:bold; text-align:center; font-family: "Roboto", sans-serif;}
#calender_section_top_bot .table-bordered { border-top:0px; }
#calender_section_top_bot table tbody td { background:#fff; padding:5px 5px; font-size:14px; font-weight:bold; border:#6b6b6b 1px solid; text-align:center; font-family: "Roboto", sans-serif;}
    }
    
    
 @media only screen and (min-width:100px) and (max-width:399px) {
#calender_section select { -webkit-appearance: none; -webkit-appearance: none; font-size:12px; text-transform: uppercase; top: 3px; font-weight: bold; }    
    
    .day_selected { width: 120%; text-align: center; float: left; font-size:14px;     line-height:20px; font-weight: bold; padding-top: 10px; width:100%; position:relative; }
   .dropup { position: relative; width:100px; } 
    
 #calender_section { width:100%; margin:30px 0px; float:left; border: 3px solid #8852ff; background:#fff }
#calender_section .col-sm-8 h2 { background-color:#c3c3c3; color:#444444; font-size:12px; 
text-align:center; line-height:20px; float: left; width:100%; margin-bottom: 0px; margin-top: 0px; padding:8px 0px; }
#calender_section .col-sm-8 h2 a { color:#000000; float:none; padding-left: 0px; font-size: 12px; }
#calender_section .col-sm-8 h2 a i { text-decoration: none; width:15px; height:15px; cursor: pointer; color: #fff; border: 1px solid #fff; border-radius: 50%; background: #8a8a89; text-align: center; float: none; padding: 2px 0px 0px 0px; margin: 0px; vertical-align: middle; line-height: 8px; top: -2px; position: relative; font-size:10px; }
 #calender_section .col-sm-8 h2 a:nth-child(1) {
padding-right:20px;
}   
    
#calender_section_top_bot table thead th { border:0px; text-transform:uppercase; font-size:11px; color:#000; font-weight:bold; text-align:center; font-family: "Roboto", sans-serif;}
#calender_section_top_bot .table-bordered { border-top:0px; }
#calender_section_top_bot table tbody td { background:#fff; padding:5px 3px; font-size:12px; font-weight:bold; border:#6b6b6b 1px solid; text-align:center; font-family: "Roboto", sans-serif;}
    }