/* AmRiCal Default Style for first calendar on page 
This file should have been copied to a css folder in your uploads directory.  It may safely be edited in the uploads folder and will not be overwritten by upgrades,
If you have multiple icals on a page (ie not multiple urls in a shortcode, but multiple instances of the shortcode,
then you will need to add css for any further calendars - simply copy the compprop0 to compprop1 

You can always refer back to the default css in the plugin folder for the latest suggested or example css.


This file now includes the box calendar css - it may need modification for your theme, if your theme does not have the #content selector
*/
/* Note #content works for 2010 theme to override default table settings.  You need to find out what works for your theme */
#wp-calendar td.next,
div.event-calendar td.next {text-align:right;}
div.event-calendar td.prev {text-align:left;}

#content table.boxical {
	border-collapse: collapse;
	border-spacing: 0;
	table-layout: fixed;
	font-size: 12px;
	line-height: 16px;
	border: 0;
	margin-left:auto; margin-right:auto;	
}
#content table.boxical td.today {
	background: #ddd;	
}
#content table.boxical td.day6,
#content table.boxical td.day7 { /* to style the weekend  */
/*	background: #eee;	*/
}
#content table.boxical tbody td.pad {  /* to style the non month boxes */
/*	background: #eee;	 */
}
#content table.smallcalendar,  
table.smallcalendar {
	width: 200px;
}
#content table.largecalendar caption { 
		font-weight: bold;
		font-size: 1.2em;
		padding: 5px;
}	
#content table.smallcalendar tbody td {
	background: #f5f5f5;
	border: 1px solid #fff;
	padding: 3px 0 2px;
	text-align: center;	
}
#content table.largecalendar tbody td {
	height:100px; /* it will expand if necessary */
}

#content table.largecalendar  td.views{
	text-align: right;
}
#content table.largecalendar .navigation form{ 
	display: inline;
	padding: 0 8px;
}
#content table.largecalendar .navigation input,
#content table.largecalendar .navigation select{ 
	margin: 0;
	line-height: 14px;
	font-size: 12px;
}
#content table.largecalendar  .navigation a { 
	font-weight: bold;
}
#content table.boxical tr th,
#content table.boxical tr td {
	padding: 3px;
}
#content table.boxical thead tr th {
	text-align: center;
}
#content table.boxical td a {
	text-decoration: none;
}
#content table.boxical tfoot tr td,		 
#content table.boxical tfoot tr {
	border: none;
}	
#content table.boxical  div.event a: hover {
	
}

/* unfortunately we need to use divs to hide the details if we want to allow html in details and keep html valid */
/* ------------------------------  hide the details until we want them -----------*/
#content table.boxical td div.event div.details2{ /* hide column 2 */
	display: none;
}
#content table.boxical div.event:hover  div.details2 {
        color:#333333; 
        background:#ffffff; 
        display:block;
        position:absolute; 
        margin-top: 12px; 
		margin-left: 50px;
        padding:10px; 
        width:200px; 
        z-index:100;
		border: 1px solid #000000;
        }
#content table.boxical div.event:hover  div.details2 {
	display: block;
         }
#content table.boxical div.event:hover  div.details2 img {
	width: 200px;  /* make any images smaller */
         }		
#content table.boxical td.endweek div.event:hover  div.details2 {  /* shift the last column right side over a bit so it fits on the page*/
		margin-left: -110px;
        }		 
/* -----------------------------------------------------------------*/		 
#content table.boxical td div.event { /* use this if you want to force each event to take one line only */
 /*       overflow: hidden;
	  height: 16px;    */
       }	
#content table.largecalendar tbody td div.day	    { /* use this if you want to force each box to be a fixed size - day div required becuase cannot force a td height  */
 /*     height: 66px; 
	  overflow: hidden;	   */
 }
 #content table.largecalendar tbody td:hover div.day { /* and then use this to see the day box on hover - confusing with too manu hover's though, so maybe do not use desc hover then */
/*	position: absolute;
	border: 1px solid #000000;
	padding: 10px;
	background: #eee; 
	overflow: visible;
	z-index:100; */
} 
	 
/*@import url("icalbox.css");*/

/* ======================================================================*/

.history { 
	/* to style past events */
}
.ical td {
	vertical-align: top;
}
.wical .group {  
	font-weight: bolder; 
}
.wical .today {  
/*	font-weight: bolder !important; */
}	
.calendarviews {
	clear: both;
	width: 100%;
	text-align: right;
}
/* -------------------------------------------------------------------------------------*/
/* Table related definitions - delete these if your theme does tables nicely already  */
.ical thead  { /* Make the table heading row a bit bigger */
	font-size: larger;
	}
.ical tfoot a,   /* make footer look subtle */
.wical tfoot a {
	color: #777;
	}
.icalprop th,
.icalprop td,
.ical th,
.ical td { /* space the table elements out a bit */
	padding: 0.5em;
	text-align: left;
	}	
.icalprop td.col2 {
	text-align: right;
}
/* -----------------------------------------for the list style ------------------------- */
.icalprop span.col1 {
	float: left;
}	
.icalprop span.col2 {
	text-align: right;
	float: right;
}
/* -------------------------------------------------------------------------------------*/	
.ical .summary h3{ /* make the summaries take on whatever the theme's h3 is, but not extra space above */
	padding-top: 0;
	margin-top: 0;
}
#content .icalprop ,
#content .icalprop tr,
#content .icalprop tr td,
#content .icalprop tr th,
.icalprop,
.icalprop tr,
.icalprop tr td,
.icalprop tr th {	
	border: 0px;
	padding: 0;
	margin: 0;
	vertical-align:bottom;
}
.ical,
.icalprop {	
	width: 100%;   /* force the calendar  to take as much space as it can so floated items don't force a wrap */
	margin: auto;
	/* table-layout:fixed; /* prevent the table from being too big */
	word-wrap:break-word; /* to make content wrap rather than overflowing */
	overflow:hidden; /* some browser don't support word -wrap */
	}

/* --------------------Delete this is not required   - Needed in some themes that force list bullets in-----------------------------*/
/* Do our very best to re move the list bullets from some weird themes where we do not want them.
   Themes  specify list bullet styling in many (okay maybe only 3 ) different ways and it is hard to force precdence sometimes! */
.wical ul li.group,
.wicalprop ul  li,
.icalprop ul  li {  /* remove list bullets for calendar properties and groups */	
	list-style: none !important;
	text-indent: 0;
	padding: 0;
	margin: 0;
	background: none !important;
    }

.ical ul.amrcol  li:before,
.wcalprop ul.amrcol  li:before ,
.icalprop ul.amrcol  li:before  {  /* remove list bullets in the default theme and similar themes */
		content:"" !important; /* none should work, but chrome seems to ignore it */
}
#sidebar #wccalprop0  li:before,
#sidebar .wical  li:before {  /* remove list bullets in the default theme and similar themes , for all fields*/
		content:"" !important; 
}
/* Default Theme and similar only ---------------------------------------------------------------*/
/* add back list bullets for a field only  - see what your theme is using and put it in here */
#sidebar .wical  li {  
}
#sidebar .wical  li.eventdate:before {
/*  	content: "\00BB \0020" !important;  */
}
/* ------------------------ ----        End list bullets---------------------------------------------------------------*/
#menu .wical  ul { /* to override classic theme where all appears greyed out */
	color: #000;
}
/* -------------------------------images can look strange in some themes -------------------------------*/
.wical img,
.wicalprop img,
.ical img ,
.icalprop img {
	border: none !important;
	vertical-align: text-bottom;
	}
.wcalprop , /* if someone wants the calendar level on the widget, then float the bits to the left */
.ical .addevent,
.ical .subscribeevent,
.ical .icsurl ,
.ical .map,
.icalprop .addtogoogle,
.icalprop .icsurl ,
.icalprop .icalrefresh ,
.icalprop .x-wr-timezone { /* float our little icons to the right */
	float: right;
	padding: 0 0 0 0.5em;
	margin-bottom: 0;   /* required where sometimes they don't line up nicely if limited text */
	font-size: small;
}
.ical li.icalnav {
	padding: 0 1em 0 0 ;
	}
.wical td { /* for the widget only if using table - remove any additional table spacing, so that we are left with li spacing for consistency with other widgets */
    margin: 0;
	padding: 0;
}
/* css based description hide/display for the widget  -----------------------------*/
.wical li .description, 
.wical tr .description  {
	display:none; 
	z-index:-1;
} 
.wical li,
.wical tr   { 
	position:relative;
}
.wical li:hover .description,
.wical tr:hover .description {	
	background:#fff; 
	color: #111;
	display:block; width: 90%;
	position:relative; 
	right:1px; top:10px;  
	z-index:100;
	margin:0 0 10px 0;  
	padding:2%; 
	overflow: hidden;
}

/* forevent info  when it goes live ------------------------------------------------------- */
.eventdates ul,
#content .eventdates ul  {
	list-style: none;
	margin: 0;
	padding:0;
}
.eventdates ul  li,
#content .eventdates ul  li{
	margin: 0;
	padding:0;
}
/* for semi paginate when it goes live ------------------------------------------------------- */	

#icalnavs {width: 250px;
	text-align: center; 
	vertical-align: middle;
	margin: 0 auto;
	font-size:small;
	}
.icalnav { vertical-align:middle;}
.icalnav a { text-decoration: none; color: 	#ADADAD;}
.icalnav a.symbol {font-size:x-large; }
.icalnavs:hover  { background-color: #ffffff;}
.icalnav a:hover  { color: #000000;}

.add-new-event {display: block; clear:both;}
/* for credits if shown - keep it low key  ------------------------------------------------------- */	
.amrical_credit,.amrical_credit a,.amrical_credit a:visited {
	font-size:x-small; 
	color: 	#ADADAD;
	font-style: italic;
	vertical-align: middle;
}
.amrical_credit a:hover
 {
	font-size: x-small; 
	font-style: italic;
	color: #000000;
}