1

/* The calendar uses up all available horizontal width */

     2

table.calendar

     3

{

     4

    width: 100%;

     5

}

     6

     7

/* Each column in the table is approximately the same width */

     8

table.calendar th

     9

{

    10

    width: 14%;

    11

}

    12

    13

/* The prev-month link is on the left edge */

    14

table.calendar a.prev-month

    15

{

    16

    float: left;

    17

}

    18

    19

/* The next-month link is on the right edge */

    20

table.calendar a.next-month

    21

{

    22

    float: right;

    23

}

    24

    25

/* The weekdays-in-week header is fixed-height */

    26

table.calendar thead tr

    27

{

    28

    height: 1em;

    29

}

    30

    31

/* A day's header is a fixed height cell */

    32

table.calendar tbody tr.week-header

    33

{    

    34

    height: 1em;

    35

}

    36

    37

/* The day number is visible inside the header */

    38

table.calendar tbody tr.week-header th

    39

{

    40

    padding-left: 0.5em;

    41

    42

    text-align: left;

    43

}

    44

    45

/* The numbers of days that are a part of the current month are clearly visible */

    46

table.calendar tbody th.in-month

    47

{

    48

    background-color: #eeeeee;

    49

}

    50

    51

/* The numbers of days that are outside the current month are less noticable */

    52

table.calendar tbody th.out-month

    53

{

    54

    background-color: #ffffff;

    55

    56

    color: #888888;

    57

}

    58

    59

/* Each row of day-event-data for a week is fixed height */

    60

table.calendar tbody tr.week-data

    61

{

    62

    height: 1em;

    63

}

    64

    65

/* Each event is visible as its own block */

    67

{

    68

    display: block;

    69

    70

    background-color: #A6C6E3;

    71

    72

    padding: 4px;

    73

    74

    /* Rounded corner for cosmetic effect */

    75

    border-radius: 4px;

    76

    -moz-border-radius: 6px;

    77

    78

    text-align: center;

    79

}

    80

   127

/* Borders ? */

   128

table.calendar tbody td

   129

{

   130

    border: 1px solid #d8d8d8;

   131

   132

    border-style: none solid;

   133

}

   134

   135