/* this file has been modifed to add some additional grid options by kevin lahoda, wnyc */
/* I modified it too so I could just reuse all the grid_x stuff on the inner
 * iframe. See anything under .container_stripped. */
.container_12,.container_16{margin-left:auto;margin-right:auto;width:960px}.grid_1,.grid_2,.grid_3,.grid_4,.grid_5,.grid_6,.grid_7,.grid_8,.grid_9,.grid_10,.grid_11,.grid_12,.grid_13,.grid_14,.grid_15,.grid_16,.sub-alt-show-special{display:inline;float:left;margin-left:10px;margin-right:10px}.container_12 .grid_3,.container_16 .grid_4{width:220px}.sub-alt-show-special{width:193px;}.container_12 .grid_6,.container_16 .grid_8{width:460px}.container_12 .grid_9,.container_16 .grid_12{width:700px}.container_12 .grid_12,.container_16 .grid_16{width:940px}.alpha{margin-left:0}.omega{margin-right:0}.container_12 .grid_1{width:60px}.container_12 .grid_2{width:140px}.container_12 .grid_4{width:300px}.container_12 .grid_5,.container_stripped .grid_5{width:380px}.container_12 .grid_7{width:540px}.container_12 .grid_8,.container_stripped .grid_8{width:620px}.container_12 .grid_10{width:780px}.container_12 .grid_11{width:860px}.container_16 .grid_1{width:40px}.container_16 .grid_2{width:100px}.container_16 .grid_3{width:160px}.container_16 .grid_5{width:280px}.container_16 .grid_6{width:340px}.container_16 .grid_7{width:400px}.container_16 .grid_9{width:520px}.container_16 .grid_10{width:580px}.container_16 .grid_11{width:640px}.container_16 .grid_13{width:760px}.container_16 .grid_14{width:820px}.container_16 .grid_15{width:880px}.container_12 .prefix_3,.container_16 .prefix_4{padding-left:240px}.container_12 .prefix_6,.container_16 .prefix_8{padding-left:480px}.container_12 .prefix_9,.container_16 .prefix_12{padding-left:720px}.container_12 .prefix_1{padding-left:80px}.container_12 .prefix_2{padding-left:160px}.container_12 .prefix_4{padding-left:320px}.container_12 .prefix_5{padding-left:400px}.container_12 .prefix_7{padding-left:560px}.container_12 .prefix_8{padding-left:640px}.container_12 .prefix_10{padding-left:800px}.container_12 .prefix_11{padding-left:880px}.container_16 .prefix_1{padding-left:60px}.container_16 .prefix_2{padding-left:120px}.container_16 .prefix_3{padding-left:180px}.container_16 .prefix_5{padding-left:300px}.container_16 .prefix_6{padding-left:360px}.container_16 .prefix_7{padding-left:420px}.container_16 .prefix_9{padding-left:540px}.container_16 .prefix_10{padding-left:600px}.container_16 .prefix_11{padding-left:660px}.container_16 .prefix_13{padding-left:780px}.container_16 .prefix_14{padding-left:840px}.container_16 .prefix_15{padding-left:900px}.container_12 .suffix_3,.container_16 .suffix_4{padding-right:240px}.container_12 .suffix_6,.container_16 .suffix_8{padding-right:480px}.container_12 .suffix_9,.container_16 .suffix_12{padding-right:720px}.container_12 .suffix_1{padding-right:80px}.container_12 .suffix_2{padding-right:160px}.container_12 .suffix_4{padding-right:320px}.container_12 .suffix_5{padding-right:400px}.container_12 .suffix_7{padding-right:560px}.container_12 .suffix_8{padding-right:640px}.container_12 .suffix_10{padding-right:800px}.container_12 .suffix_11{padding-right:880px}.container_16 .suffix_1{padding-right:60px}.container_16 .suffix_2{padding-right:120px}.container_16 .suffix_3{padding-right:180px}.container_16 .suffix_5{padding-right:300px}.container_16 .suffix_6{padding-right:360px}.container_16 .suffix_7{padding-right:420px}.container_16 .suffix_9{padding-right:540px}.container_16 .suffix_10{padding-right:600px}.container_16 .suffix_11{padding-right:660px}.container_16 .suffix_13{padding-right:780px}.container_16 .suffix_14{padding-right:840px}.container_16 .suffix_15{padding-right:900px}.clear{clear:both;display:block;overflow:hidden;width:0;height:0}.clearfix:after{clear:both;content:' ';display:block;font-size:0;line-height:0;visibility:hidden;width:0;height:0}* html .clearfix,*:first-child+html .clearfix{zoom:1}.grid_8 .nomargins, .grid_12 .nomargins {margin: 0;}

.container_stripped .main { margin: 0px; }

#show_calendar {
}

.calendar {  }

h1.month-title {
	color: #dd0000;
	margin: 0 0 5px 15px;
}

.calendar table { 
  width: 100%;
  background-color: #fff;
}

.calendar td { 
	height: 42px; 
	width: 42px; 
	border: 1px solid #fff;
	text-align: center;
	vertical-align: middle;
}

.calendar tr.monthRow td { 
	height: 25px;
	text-transform: uppercase;
	border-bottom: 1px solid #ccc;
	border-left: 0;
	border-right: 0;
	background-color: #f1f1f1;
}

.calendar tr.monthRow td.month {
	width: 210px;
}

.calendar tr.dayRow td { 
	height: 25px;
	text-transform: uppercase;
	font-weight: bold;
	font-size: 8pt;
	border-left: 0;
	border-right: 0;
}

.calendar tr.dateRow td { 
	background-color: #F1F1F1;
	color: #888;
	font-size: 8pt;
	font-weight: bold;
}

.calendar tr.dateRow td.emptyDate {
 	background-color: #fff;
}
	
.calendar tr.dateRow td.active a div { 
	background-color: #D9F2D3;
	color: #888;
	padding: 11px 0;
}

.calendar tr.dateRow td.active a:hover div {
	background-color: #bfe2b7;
}

.calendar_detail { 
	width: 300px;
	z-index: 500;
}

/* See http://www.dracos.co.uk/code/ie6-css-bug/ for line height in IE7 */
.calendar_detail_inner {
	line-height: 1.1em;
	background: transparent url(/media/img/wnyc/calendar-bg.gif) no-repeat bottom left; 
	padding: 10px 10px 30px;
	z-index: 600;
	zoom: 1;
}

.calendar_detail h4 { /* date */
	font-weight: normal;
	font-size: 9pt;
	color: #666;
	text-transform: uppercase;
	margin: -20px -10px 5px;
	padding: 10px 10px 0;
	background: transparent url(/media/img/wnyc/calendar-bg.gif) no-repeat top left; 
	zoom: 1;
}

.calendar_detail h1 { /* episode title */
	font-size: 13pt;
	font-weight: normal;
	color: #dd0000;
	margin: 2px 0 3px;
}

.calendar_detail h2 {
	padding: 0 9px 0 1px;
}

.calendar_detail h2 a { /* segment titles */
	font-size: 9pt;
	color: #666;
  	font-weight: normal;
}

/* Don't mess with these. They are necessary programatically. */
.calendar tr.monthRow td.move { cursor: pointer; }
.calendar_detail { position: absolute; left: -9999px; }
.calendar tr.dateRow td.active div { width: 100%; cursor: pointer; } /* IE6 */

.episode-archive-month .calendar tr.monthRow td.move {
  text-indent: -9999px;
  /*  Only on the episode archive page, hide the calendar arrows and use the
      the episode archive nav instead so the page results refresh */
}

div.calendar-fullpage table {
    width:100%;
    /*max-width:680px;*/
    margin:10px 0 0 0;
}

div.calendar-fullpage thead tr.calendar-caption td {
    height:38px;
    background-color:black;
    color:white;
    border:none;
    font-weight:bold;
    font-size:12pt;
}

div.calendar-fullpage thead tr.calendar-caption td a {
    height:19px;
    width:12px;
}

div.calendar-fullpage thead  tr.calendar-weekdays td {
    height:29px;
    vertical-align:middle;
    text-align:center;
    text-transform:uppercase;
    background-color:#0073d5;
    border-bottom:1px solid white;
    color:white;
    border:none;
    font-size:8pt;
}

div.calendar-fullpage td.calendar-prev a,
div.calendar-fullpage td.calendar-next a {
    text-indent:-9999px;/*not working in calendar-next with text-align:right, so just display-none'ing */
    display:block;
    margin-left:15px;
    margin-right:15px;
}

div.calendar-fullpage td.calendar-prev a span,
div.calendar-fullpage td.calendar-next a span {
    display:none;
}

div.calendar-fullpage thead td.calendar-prev a  {
    background:transparent url("/media/img/greenespace/events/calendar-left.png") no-repeat top left;
}
div.calendar-fullpage thead td.calendar-next a  {
    float:right;
    background:transparent url("/media/img/greenespace/events/calendar-right.png") no-repeat top right;
}
div.calendar-fullpage tfoot td.calendar-prev a  {
    background:transparent url("/media/img/greenespace/events/calendar-left-small.png") no-repeat top left;
}
div.calendar-fullpage tfoot td.calendar-next a  {
    float:right;
    background:transparent url("/media/img/greenespace/events/calendar-right-small.png") no-repeat top right;
}

div.calendar-fullpage tfoot tr.calendar-footspacer td {
    /*weird, but necessary, to get the space in between tbody and tfoot
      without showing 'teeth' between colspan'd cells
     */
    background-color:white;
    height:5px;
    border-top:0px;
    border-bottom:0px;
}

div.calendar-fullpage tfoot tr.calendar-caption td {
    height:24px;
    background-color:black;
    border:none;
}

div.calendar-fullpage tfoot tr.calendar-caption td a {
    height:12px;
    width:8px;
}

div.calendar-fullpage tfoot tr.calendar-caption td.monthtitle {
    color:black;
}



div.calendar-fullpage tbody  td {
    background-color:#e5e5e5;
    min-height:39px;
    text-align:left;
    vertical-align:top;
    min-width:94px;
    border-top:2px solid white;
    border-bottom:none;
    padding:5px 7px 13px 7px;
    font-size:10pt;
    line-height:1.3;
}

div.calendar-fullpage tbody  td.other_month {
    background-color:#dbdad9;
}

div.calendar-fullpage td .calendar-day {
    font-size:15pt;
    color:#5f605f;
    padding:0;
}
div.calendar-fullpage td.other_month .calendar-day {
    color:#adaeaf;
}

div.calendar-fullpage .event-item {
    margin-top:6px;
}

div.calendar-fullpage a.event-link {
    text-decoration:none;
    color:inherit;
    display:block;
    margin-bottom:5px;
}

div.calendar-fullpage a.event-link:hover {
    text-decoration:underline;
}

div.calendar-fullpage .event-time {
    color: #0073d5;
    display:block;
    font-weight:bold;
}

div.calendar-fullpage .tickets-msg {
    padding:3px 7px 3px 7px;
    text-transform:uppercase;
    border-radius: 2px;
    -moz-border-radius: 2px;
    font-size:80%;
}

div.calendar-fullpage a.tickets-buy {
    background-color:#f47628;
    color:white;
}

div.calendar-fullpage .tickets-free {
    background-color:#2fa9da;
    color:white;
}
div.calendar-fullpage .tickets-soldout {
    background-color:white;
    color:#b3b3b3;
}
/*today*/
div.calendar-fullpage td.today0 {
    background-color:#f4f4f4;
}
/*past events*/
div.calendar-fullpage td.today-1 .event-item {
    opacity:0.6;
}

div.calendar-fullpage td.today-1 .tickets-free {
    display:none;
}

.enlarge_link {
	cursor: pointer;
}

#enlarge_bg {
	left: 0;
	top: 0;
	position: fixed;
	width: 100%;
	height: 100%;
	z-index: 1000;
	background-color: #000;
}

#enlarge {
	padding: 10px;
	position: absolute;
	z-index: 5000001;
	background-color: #fff;
}

#enlarge .close {
	text-align: right;
	padding-bottom: 2px;
}

#enlarge .close a {
	cursor: pointer;
	background-repeat: no-repeat;
	background-position: center right;
	background-color: transparent;
	text-align: right;
	padding-right: 12px;
	font-size: 11px;
}

#enlarge .right {
	text-align: right;
}

.enlarge_div {
	position: relative;
	display: block;
	overflow: hidden;
}

.enlarge_link {
	display: block;
	position: absolute;
	bottom: 4px;
	right: 4px;
	text-indent: -9999px;
	background-repeat: no-repeat;
	background-position: 0px 0px;
	background-color: transparent;
	width: 17px;
	height: 17px;
	cursor: pointer;
}
