﻿#categories
{
    width:100%;
    margin:0 auto 15px auto;
	float:left;
}
    #categories .category
    {
        float:left;
        height:22px;
    }
        #categories .category .swatch
        {
            float:left;
            width:30px;
            height:30px;
            border:solid 1px #999;
            margin-left:5px;
            margin-right:5px;
        }
        #categories .category .name
        {
            float:left;
            height:20px;
            padding-top:5px;
        }

.calendar
{
    width:100%;
}
    .calendar td
    { }
    .calendar .title
    {
        background-color:#666;
        font-size:16px;
        color:#fff;
    }
    .calendar .title td
    {
        padding:5px 0 2px 0;
    }
    .calendar .title .navigation
    {
        background-color:#fff;
        font-size:11px;
        color:#666;
    }
    .calendar .dayheader,
    .calendar .day,
    .calendar .today,
    .calendar .othermonth,
    .calendar .weekendday
    { 
        border:solid 1px #ccc;
    }
    .calendar .othermonth
    {
        background-color:#ccc;
    }
    .calendar .dayheader
    {
        text-transform:uppercase;
        font-size:10px;
        color:#fff;
        background-color:#a44323;
        padding:5px 0 0 3px;
    }
    .calendar .day .heading,
    .calendar .othermonth .heading,
    .calendar .weekendday .heading
    {
        display:block;
        background-color:#838789;
        background-image:url(images/day-heading-bg.gif);
        background-position:center top;
        background-repeat:repeat-x;
        text-align:left;
        padding:2px 0px 2px 5px;
    }
    .calendar .today .heading
    {
        display:block;
        background-color:#bfc39a;
        background-image:url(images/today-heading-bg.gif);
        background-position:center top;
        background-repeat:repeat-x;
        text-align:left;
        padding:2px 0px 2px 5px;
    }
    .calendar .day .events,
    .calendar .othermonth .events,
    .calendar .weekendday .events
    {
        min-height:75px;
    }
    .calendar .today .events
    {
        min-height:75px;
        background-color:#f8f6c3;
    }
    .calendar .events .event .positioner
    {
        position:relative;
    }
    .calendar .events .event
    {
        background-image:url(images/day-event-arrow-right.gif);
        background-position:right center;
        background-repeat:no-repeat;
        border:solid 1px #aaa;
        float:left;
        width:60px;
        text-align:left !important;
        margin:1px 1px 0px 1px;
        padding:2px 15px 2px 4px;
        z-index:0;
        clear:both;
    }
    .calendar .events .event a
    {
        color:#333;
        font-weight:bold;
    }
    .calendar .events .eventdetails
    {
        border-top:solid 1px #aaa;
        width:0px;
        margin-left:75px;
        position:absolute;
        text-align:left;
        top:-3px;
        overflow:hidden;
        z-index:5000;
    }
    .calendar .events .eventdetails .inner
    {
        padding:10px;
        min-height:105px;
        width:225px;
    }
    
    .calendar .events .eventdetails .link
    {
        text-align:right;
        margin:10px 5px 0px 0px;
    }
    
#event
{
   float:left;
}
    #event #title
    {
        margin-top:20px;
        font-size:32px;
    }
    #event #datestamp
    {
        margin-top:2px;
        font-size:12px;
        font-style:italic;
        color:#aaa;
    }
    #event #description
    {
        margin:20px 0 10px;
        font-size:12px;
    }
    #event #category
    {
        margin-top:20px;
    }
        #event #category .swatch
        {
            float:left;
            width:20px;
            height:20px;
            border:solid 1px #999;
            margin-left:5px;
            margin-right:5px;
        }
        #event #category .name
        {
            font-size:16px;
            float:left;
            height:20px;
            padding-top:5px;
        }

#eventlist
{}
    #eventlist .month
    {
        margin:10px 0;
    }
        #eventlist .month .name
        {
			color:#e38927;
            font-weight:bold;
            font-size:16px;
            display:block;
            margin-bottom:10px;
        }
            #eventlist .month .event
            {
                margin-bottom:5px;
                clear:both;
                padding-bottom:5px;			
				border-bottom:1px solid #333;
            }
                #eventlist .month .event .date,
                #eventlist .month .event .title
                {
                    display:block;
                }
                #eventlist .month .event .date
                {
                    color:#aaa;
                }
                #eventlist .month .event a.title
                {
                    color:#ddd;
					font-weight:bold;
                    font-size:14px;
                }
                #eventlist .month .event .swatch
                {
                    float:left;
                    width:30px;
                    height:30px;
                    border:solid 1px #999;
                    margin-left:5px;
                    margin-right:5px;
                }
