/* CSS Document */
#calendar_display{
	width:100%;
	float:none;
	
}
#calendar_display .calendar{
	width:100%;
	
}
#calendar_display td{
	
}
#calendar_display #calHead{
	text-align:center;
	color:#fff;
	padding-bottom:15px;
    background-color:#88a83e;
}
#calendar_display .current.month_lable{
	font-size:1.8em;
	display:inline-block;
	margin-left:4%;
	margin-right:4%;
	color:#fff;
	
}
#calendar_display .prev.month_lable{
	display:inline-block;
	width:1.8em;
	height:1.8em;
	position:relative;
	top:5px;
	
	cursor:pointer;
	
}
#calendar_display .prev.month_lable{
	width:32px;
    height: 32px;
    border-radius: 50%;
    background-color:#fff;
	background-size:contain;
}
#calendar_display .next.month_lable{
	display:inline-block;
	width:1.8em;
	height:1.8em;
	position:relative;
	top:5px;
	cursor:pointer;
	
}
#calendar_display .next.month_lable{
	width:32px;
    height: 32px;
    border-radius: 50%;
    background-color:#fff;
	background-size:contain;
}
#calendar_display .prev.month_lable:before{content:''; display: block; width:40%; height: 40%; border-top:2px solid #88a83e; border-left: 2px solid #88a83e; position: absolute; top:0px; left:0px; right:0px; bottom:0px; margin: auto; transform: rotate(-45deg) translateX(2px); transform-origin: center center;}

#calendar_display .next.month_lable:before{content:''; display: block; width:40%; height: 40%; border-top:2px solid #88a83e; border-right: 2px solid #88a83e; position: absolute; top:0px; left:0px; right:0px; bottom:0px; margin: auto; transform: rotate(45deg) translateX(-2px); transform-origin: center center;}
#calendar_display table{border-collapse: collapse;}
#calendar_display td{
     border:1px solid #ccc;
    border-collapse: collapse;
}

#calendar_display .week td{
	text-align:center;
	padding-bottom:10px;padding-top:10px;
    color:#477838;
	font-weight: 700;
}
#calendar_display .date{
	width:14.2857%;
	color:#1072ba;
    border-bottom-width:0px;
    border-bottom-color:#fff;
}
#calendar_display .date_label{
    display:block; padding:4px 0px; width:36px; text-align: center;
}
#calendar_display .date.Saturday{
}

#calendar_display .date.has_events .date_label{
	background-color:#1072ba;
	color:#fff;
}

#calendar_display .event{
	
}
#calendar_display .single{
	
	
}
#calendar_display .span{
	
	
}
#calendar_display .NoEvent{
	
	
}
#calendar_display .single_day_events{min-height: 100px;}
#calendar_display .event .summary{font-size: 12px; font-style: italic; color:#fff; padding:4px 0px 12px 4px; display: block; background-color:#1072ba; box-shadow: rgba(0,0,0,0.0) 0px 0px 1px; transition: all 0.3s ease-in-out; cursor: pointer}
#calendar_display .event .summary:hover{background-color:#f0f4f7; box-shadow: rgba(0,0,0,0.5) 1px 1px 1px;}
#calendar_display .event .eventTime{display: none;}
#calendar_display .event .description{display: none;}

#events_list{
    display: none;
	width:55%;
	float:left;
	margin-top:25px;
}
#events_list .date{
	float:left;
	width:10%;
	max-width:60px;
	clear:both;
	background-color: #A20104;
	border-radius:5px;
	text-align:center;
	margin-top:4px;
}
#events_list .month{
	display:block;	
	padding:2px;
	color:#FFFFFF;
}
#events_list .month_day{
	display:block;
	background-color:#D0CDCD;
	padding:2px;
	border-bottom-left-radius:5px;
	border-bottom-right-radius:5px;
}

#events_list .event{
	float:right;
	width:85%;
	margin-bottom:35px;
	padding-bottom:25px;
	border-bottom:1px solid #DCDCDC;
	cursor:pointer;
}

#events_list .summary{
	font-size:1.2em;
	color:#709AFB;
}
#events_list .time {
	color:#666666;
	font-size:.8em;
	
}

#recurrence_pattern ul{
	list-style:none;
	padding-left:0px;
}

#FREQ{
	
	height:150px;
	border:1px solid #666;
	padding:15px;
	
	margin:5px;
	float:left;

}

#recurrence_pattern .rRule{
	display:inline;
	width:400px;
	border:1px solid #666;
	padding:15px;
	margin:5px;
	float:left;
	height:150px;
	
}

#recurrence_pattern .rRule .DOW li{
	float:left;
	width:8em;
	margin-right:5px;
}


/*#test_button:enabled{
	border:1px solid #F7070B;
	background-color:#F7070B;
}*/
#contextMenu, #library_context, .context_menu{
	position:absolute;
	border:1px solid #000;
	background-color:#FFF;
	padding:0px;
	list-style:none;
	margin:0px;
	z-index:1000;
}
#contextMenu li, #library_context li, .context_menu li{
	list-style:none;
	padding:2px;
	padding-left:10px;
	padding-right:10px;
	cursor:pointer;
	font-size:0.7em;
	line-height:1.5em;
}
#contextMenu li:hover, #library_context li:hover, .context_menu li:hover{
	background-color:#BFFFFE;	
}


@media screen and (max-width:740px){
    /*#calendar_display{display: none;}
    #events_list{display: block;}*/
    
    #calendar_display{width:auto;}
    #calendar_display .calendar{table-layout: fixed;}
    #calendar_display .single_day_events{min-height: 50px; overflow: hidden;}
    #calendar_display td{width:14.28%; overflow: hidden;}
    #calendar_display .event{width:100%; overflow: hidden; height: 1.5em; background-color:#1072ba; color:#fff;}
    #calendar_display .event .summary{white-space: nowrap;}
}


@media (min-width:50px) and (max-width:500px){
#events_list .date{
	width:50px;
	float:none;
	clear:both;
	margin-left:auto;
	margin-right:auto;
	margin-bottom:15px;
	
}
#events_list .event{
	width:auto;
	float:none;
	clear:both;
	margin-bottom:15px;
	
}
.context_menu li{
	font-size:1.2em;
	line-height:2em;
	
}
#calendar_display .current.month_lable{
	font-size:1.4em;
	
}
#calendar_display .next.month_lable, #calendar_display .prev.month_lable{
	width:2.2em;
	height:2.2em;
	top:10px;
}/* CSS Document */

