/* events */
.events {}
.events a:hover .EventPopover .eventButtons *{color: #fff}
.calToggle{text-align:right;}
.calToggle a{ opacity:.5}
.calToggle a.on, .calToggle a:hover{opacity:1}
.eventCategory{line-height:0;height:.5em;width:.5em;}
#calendarToggle {margin-left: .5em}
.calNav{ color:#CCC}
#content .eventsCalendar article div h1{color: #702785}
#content .eventsCalendar article h1, .eventsAgenda section>article p{color:rgba(0,0,0,1)}

/* agenda view */
.eventsAgenda{border-bottom:1px solid rgba(0,0,0,.2);margin-bottom:2em;}
.eventsAgenda section{border-top:1px solid rgba(0,0,0,.2)}
#content .eventsAgenda section>h1{font-size:1em;color:rgba(0,0,0,.5);font-style:italic;padding:2px 5px;margin-bottom:0;background:rgba(0,0,0,.1);border-top:1px solid rgba(255,255,255,.5);border-bottom:1px solid rgba(0,0,0,.05)}
.eventsAgenda section>article{border-top:1px solid rgba(0,0,0,.1)}
.eventsAgenda section>h1+article{border-top:none}
.eventsAgenda section>article a{padding:.5em 5px;display:block;position:relative;overflow:auto}
.eventsAgenda section>article a>*{margin-left:1em}
.eventsAgenda section>article a:hover,.eventsAgenda section>article a:active,.eventsAgenda section>article a:focus{background:#E8F8D6}
.eventsAgenda section>article p{margin-bottom:0}
#content .eventsAgenda article h1{font-size:1em;margin-bottom:0;float:left}

.eventsAgenda section>article p{float:left;clear:left; font-size: .9em}
.eventsAgenda article .eventCategory{margin-left:0;background:rgba(0,0,0,.3);border:1px solid rgba(0,0,0,.15);position:absolute;left:.5em;top:.85em}



/* calendar view */
.eventsCalendar{margin-bottom:2em;margin-top:-2.5em}
.eventsCalendar table{width:100%;border-top:solid 1px rgba(0,0,0,.2);border-bottom:solid 1px rgba(0,0,0,.15);margin-top:0}
.eventsCalendar th{padding:.5em .4em;text-align:left;text-transform:uppercase;font-size:.8em;line-height:1em;color:#fff;background:#702785}
.eventsCalendar td{border-top:solid 1px rgba(0,0,0,.15);border-left:solid 1px rgba(0,0,0,.15);height:100px;width:14%}
.eventsCalendar td:first-child{border-left:0}
.eventsCalendar td.disable { opacity:.2;}
.eventsCalendar td.today { background-color: rgba(0,0,0,.05)}
.eventsCalendar td>*{display:block;float:left;width:100%}
.eventsCalendar td>time {padding:.2em .3em;font-size:1.15em;line-height:1em;display:block;color:rgba(0,0,0,1)}
.eventsCalendar article{border-top:1px dotted rgba(0,0,0,.15)}
.eventsCalendar article>a{padding:.5em .3em;display:block;float:left;width:100%}
.eventsCalendar article>a:hover{background:#E6DBE9 !important}
.eventsCalendar article>a>*{display:block;float:left;width:100%}
.eventsCalendar article time{font-size:.8em;line-height:1.2em}
.eventsCalendar article time span{white-space:nowrap}
#content .eventsCalendar article h1{font-size:.9em;margin-bottom:0;float:left;line-height:1.2em}
.eventLocation {margin:.5em 0 .5em 0}

/************************ Calendar/List Popovers */
/* Calendar */
.eventsCalendar article {position: relative;}
//.events section { margin-bottom:1.85em}
.eventsCalendar article div { background:#fff; position:absolute;top:-1em; width:35em;max-width:300%; color:rgba(0, 0, 0, 0.7); z-index:1; padding:2em 2em 1em 2em; border:1px solid rgba(0,0,0,.2); font-size:.85em; line-height:1.4em}

.eventsCalendar article a:hover.EventPopover .eventButtons:hover {color: #fff!important}
	.eventsCalendar td:nth-child(1) article div, .eventsCalendar td:nth-child(2) article div, .eventsCalendar td:nth-child(3) article div, .eventsCalendar td:nth-child(4) article div {left:95%;}
	.eventsCalendar td:nth-child(5) article div, .eventsCalendar td:nth-child(6) article div, .eventsCalendar td:nth-child(7) article div{right: 95%}

.eventsCalendar article div:after {
    content: "";
	border-bottom: 0.7em solid rgba(0, 0, 0, 0);
	border-top: 0.7em solid rgba(0, 0, 0, 0);
    display: block;
    height: 0;
    position: absolute;
    top: 2.5em;
    width: 0;
}
	.eventsCalendar td:nth-child(1) article div:after,
	.eventsCalendar td:nth-child(2) article div:after,
	.eventsCalendar td:nth-child(3) article div:after,
	.eventsCalendar td:nth-child(4) article div:after
		{border-right: 0.7em solid #702785;right: 100%;}
	.eventsCalendar td:nth-child(5) article div:after,
	.eventsCalendar td:nth-child(6) article div:after,
	.eventsCalendar td:nth-child(7) article div:after
		{border-left: 0.7em solid #702785;left:100%}

#content .eventsCalendar article div h1, .popover h1{ display:block; float:none; font-size:1.5em; margin-bottom:.2em}
#content .eventsCalendar article div h2, .popover h2 {padding:0; margin-bottom:0; font-size:1.2em}
#content .eventsCalendar article div time, .popover time { font-size:1em}
.eventsCalendar article div .button, .popover .button { padding:.5em 1em; margin:.3em .3em 1em 0}
#content .eventsCalendar article div strong { color:#333}
#content .eventButtons { margin:1em 0; display:block; color: #fff}
/* Calendar Thumbs */
.eventsMiniCal{position:relative;overflow:auto;width:100%;margin-top:2em}
.eventsCalendar .eventsMiniCal a{display:block;float:left}
.eventsMiniCal table{width:100%;margin-top:0}
.eventsMiniCal a:first-child{margin-right:20px}
.eventsMiniCal td{height:1.4em;width:1.4em;padding:.2em;line-height:1em}
.eventsMiniCal td time{height:1em;padding:0;font-size:.8em}
.eventsMiniCal a:hover th{color:#fff;background:#8BCA41}




@media screen and (max-width:750px) {
    .calNav {font-size: 5.5vw}
    .eventsAgenda section>article time{padding-bottom: 6px;display: block}
    .eventsAgenda section {margin-top: 1em;}
}
@media screen and (min-width:750px) {
    .eventsAgenda section>article time{float:right}
}

@media only screen 
and (min-device-width : 768px) 
and (max-device-width : 1024px) 
and (orientation : portrait) {
    main > div > aside {padding-right: 2em; width: 14em}
    #content {width: calc(100% - 12rem);}
    .eventsCalendar td > time, #content .eventsCalendar article h1 {font-size: .8em}
    .eventsCalendar article div {max-width: 400%}
}



/* categories */
.eventsAgenda .eventCategory.eventCat1,.eventsCatKey .eventCat1{background:rgba(0,51,255,.3);border:1px solid rgba(0,0,153,.15)}
.eventsCalendar article>a.eventCat1{background:rgba(0,51,255,.03)}

.eventsAgenda .eventCategory.eventCat2,.eventsCatKey .eventCat2{background:rgba(255,102,0,.3);border:1px solid rgba(255,102,0,.15)}
.eventsCalendar article>a.eventCat2{background:rgba(255,102,0,.03)}

.eventsAgenda .eventCategory.eventCat3,.eventsCatKey .eventCat3{background:rgba(0,102,0,.15);border:1px solid rgba(0,102,0,.15)}
.eventsCalendar article>a.eventCat3{background:rgba(0,102,0,.03)}

.eventsAgenda .eventCategory.eventCat4,.eventsCatKey .eventCat4{background:rgba(153,0,255,.15);border:1px solid rgba(153,0,255,.15)}
.eventsCalendar article>a.eventCat4{background:rgba(153,0,255,.03)}

#content .eventsCalendar .eventsCatKey{float:left}
#content .eventsCatKey li{background-image:none; font-style:italic}
.eventsCatKey .eventCategory{display:inline-block;margin:0 .3em .1em 0;position:relative; left:auto;top:auto}