Universal CSS

This page contains Universal CSS: i.e. CSS applicable for all types of calendars

/* Basic simpleCal Styling */
.cal-main-table a, .cal-full-wrap a, .cal-wrap-table a{ color: #2191D1; text-decoration: none; background: none; background-color: inherit; background-color: transparent; }/* Remove any formatting for links */
.cal-main-table{ width: 100%; table-layout: fixed; }
.cal-wrap-table,.cal-full-wrap{ font-family: "Segoe UI", Frutiger, "Frutiger Linotype", "Dejavu Sans", "Helvetica Neue", Arial, sans-serif;color: #444;font-size: 13px;font-style: normal;font-variant: normal;font-weight: normal;line-height: 17px; }
.cal-main-table p{ padding: 0; margin: 0 !important; }
.date-header td{ font-weight: bold; } /* Set width for each col */
.cal-main-table .previous a,.cal-main-table .next a{ color: #AAA; } /* Gray dates for next/prev month */
/* But remember, we have hover thingos... so we'll make that text black */
.cal-main-table .hover-mini-event a {color: black;text-decoration: none;}
.cal-event-list .odate, .cal-wrap-table .odate, .cal-full-wrap .odate, .cal-main-table .odate{ font-size: 100%; color: inherit; font-weight: inherit; } /* Normalize odate */
 
.cal-header{ font-size: 140%; }
 
/* Cards (shadowed white box) */
.cal-card, .cal-main-table{
    box-shadow: 0 2px 4px rgba(0, 0, 0, .2);
    background: white;
    border: 1px solid #CCC;
    -moz-box-shadow: 0 2px 4px rgba(0,0,0,.2);
    -webkit-box-shadow: 0 2px 4px rgba(0, 0, 0, .2);
    padding: 2px;
}
.cal-card p{ margin: 0; padding: 0; }
.cal-card{ padding: 5px; margin-bottom: 4px; }
 
/* Number of events -- adjust font-weight accordingly */
.cal-main-table .date a{ font-weight: 800; }
.cal-main-table .date.count_0_entries a{ font-weight: 400; }
.cal-main-table .date.count_1_entries a{ font-weight: 600; }
.cal-main-table .date.count_2_entries a{ font-weight: 800; }
.cal-main-table .date.count_3_entries a{ font-weight: 1000; }
 
/* Fake popup-modals */
.cal-main-table .collapsible-block-link{ border: none; padding: 0; margin: 0; }
.cal-main-table .collapsible-block-unfolded-link{
position: fixed;
top: 20px;
right: 20px;
padding: 10px;
z-index: 100;
background-color: black;
    overflow: hidden;
    box-shadow: 0 2px 4px rgba(0, 0, 0, .2);
    background-color: #333;
    background-color: rgba(20,20,20,0.83617);
    -moz-border-radius: 3px;
    border-radius: 3px;
    color: #fff;
    border: 1px solid #CCC;
    -moz-box-shadow: 0 2px 4px rgba(0,0,0,.2);
    -webkit-box-shadow: 0 2px 4px rgba(0, 0, 0, .2);
}
.cal-main-table .collapsible-block-unfolded-link a{ font-weight: bold; color: white; text-decoration: none; }
 
.cal-modal-bg{
-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=70)";
filter: alpha(opacity=70);
background-color: #333; opacity: 0.7;
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
z-index: 98;
}
.cal-modal-wrap{ position: fixed; top: 0; left: 0; width: 100%; height: 100%;  z-index: 99; text-align: center;}
.cal-modal-content{ width: 60%; min-height: 400px; max-height: 80%; overflow: auto; display: inline-block; }
 
.cal-event-list .mini-event{ border: 1px solid #DB7972; background: #F0D0CE; padding: 2px 9px; font-size: 90%; margin-bottom: 1px; }
.cal-event-list .mini-event p{ padding: 0; margin: 0; }
.cal-event-list .mini-event a{ color: #000; text-decoration: none; }
.cal-event-list .mini-event-inner{ overflow: hidden; white-space: nowrap; }
/* ldh details: hover*/
.ldh .ldh-content{
    z-index: 1;
    text-align: left;
    /* Transition: uses opacity, width and height */
    display: block;
    transition: opacity 500ms ease-out;
    -webkit-transition: opacity 500ms ease-out;
    -moz-transition: opacity 500ms ease-out;
    -o-transition: opacity 500ms ease-out;
    -ms-transition: opacity 500ms ease-out;
    opacity: 0;
    height: 0;
    width: 0;
    overflow: hidden;
}
.ldh:hover .ldh-content{
    opacity: 1;
    height: auto;
    width: 280px;
    padding: 4px 8px; 
    overflow: hidden;
    box-shadow: 0 2px 4px rgba(0, 0, 0, .2);
    background-color: #333;
    background-color: rgba(20,20,20,0.83617);
    -moz-border-radius: 3px;
    border-radius: 3px;
    color: #fff;
    border: 1px solid #CCC;
    position: absolute;
    -moz-box-shadow: 0 2px 4px rgba(0,0,0,.2);
    -webkit-box-shadow: 0 2px 4px rgba(0, 0, 0, .2);
    margin: 5px -10px;
}
.ldh-content .odate{ display: inline !important; }
 
/* Fixes some issue with IE not showing modal? */
#content-wrap{ position: static; }
 
/* Fixes odialogs not showing up over */
#odialog-container{ z-index: 110; }
Without explicit permission from the author, no part of simpleCal's code can be copied, reproduced or altered in any way, shape of form.
Using CSS or other techniques to hide the Powered by simpleCal statement is also forbidden.