/** Below styles may need to be adjusted according to calendar program content*/

/***** background images for each tab are defined here*/
.calendar.tab1 {
	background: url(/customer-service/rewards/images/calendar/bg-sandals.jpg) bottom left no-repeat;
}

.calendar.tab2 {
	background: url(/customer-service/rewards/images/calendar/bg-paint.jpg) bottom left no-repeat;
}

.calendar.tab3 {
	background: url(/customer-service/rewards/images/calendar/bg-gas.jpg) bottom left no-repeat;
}

.calendar.tab4 {
	background: url(/customer-service/rewards/images/calendar/bg-apples.jpg) bottom left no-repeat;
}

.calendar.tab5 {
	background: url(/customer-service/rewards/images/calendar/bg-silverware.jpg) bottom left no-repeat;


}


/***** adjust these min-heights if the amount of text in the tabs increases and breaks the design
       make sure to adjust the ie stylesheet for the two min heights as well*/
.calendar .tab,
.calendar .tab-active {
	/*min-height: 110px;*/
	min-height: 100px;
}

.calendar .tab-special,
.calendar .tab-special-on,
.calendar .tab-special-active {
	/*min-height: 130px;*/
	min-height: 120px;
}


/** general*/

.calendar {
	min-height:422px;
	position:relative;
}

.hide {
	height:1em;
	left:-9999em !important;
	overflow:hidden;
	position:absolute;
}

#footer {
	clear:left;
}

.header-container:after,
.tab-content-text:after,
.calendar .tab-content-text .description ul:after {
	display:block;
	content:"";
	clear:both;
}

/** header*/


#calendar-top {
	background: #FFFFFF url(/images/top-gradient.gif) repeat-x scroll center top;
	clear: both;
	overflow: hidden;
	width: 100%;
}

.calendar-header {
	padding: 10px 0 0 25px;
}

.headline {
	float: left;
	width: 500px;
}

.headline img {
	float: left;
	padding-right: 15px;
}

.headline h1 {
	padding: 0 0 5px 0;
	font-size: 34px;
	color: #FF6600;
	font-weight: 600;
	line-height: .85;
}

.headline h2 {
	font-size: 20px;
	color: #8A9499;
	font-weight: normal;
}


/** calendar*/

.calendar .tab {
	width: 195px;
	float: left;
	margin-top: 20px;
	border-right: 5px solid #FFFFFF;
	font-size: 14px;
	background: url(/customer-service/rewards/images/calendar/bg-tab.png) 0 0 no-repeat;
	cursor: pointer;
}

.calendar .tab-special {
	width: 149px;
	float: left;
	margin-top: 0;
	background: url(/customer-service/rewards/images/calendar/bg-special-tab.jpg) 0 0 no-repeat;
	border-right: 5px solid #FFFFFF;
	font-size: 12px;
	cursor: pointer;
}

.calendar .tab-special-on {
	width: 149px;
	float: left;
	margin-top: 0;
	background: url(/customer-service/rewards/images/calendar/bg-special-tab.jpg) 0 -200px no-repeat;
	border-right: 5px solid #FFFFFF;
	font-size: 12px;
	cursor: pointer;
}

.calendar .tab.on {
	background: url(/customer-service/rewards/images/calendar/bg-tab.png) 0 -150px no-repeat;
}

.calendar .tab-active {
	width: 195px;
	float: left;
	margin-top: 20px;
	border-right: 5px solid #FFFFFF;
	font-size: 12px;
	background: url(/customer-service/rewards/images/calendar/bg-tab.png) 0 -300px no-repeat;
	cursor: pointer;
}

.calendar .tab-special-active {
	width: 149px;
	float: left;
	margin-top: 0;
	background: url(/customer-service/rewards/images/calendar/bg-special-tab.jpg) 0 -400px no-repeat;
	border-right: 5px solid #FFFFFF;
	font-size: 12px;
	cursor: pointer;
}

.calendar .tab.last,
.calendar .tab-active.last {
	border-right: none;
}

.calendar .tab-active.last {
	margin-left: 1px;
}

.calendar .tab ul,
.calendar .tab-active ul {
	padding: 10px 5px 0 15px;
	line-height: 1.2;
	color: #576166;
	height: 100%;
}

.calendar .tab-special ul,
.calendar .tab-special-active ul,
.calendar .tab-special-on ul {
	padding: 47px 2px 0 15px;
	line-height: 1.2;
	color: #576166;
	height: 100%;
}

.calendar .tab li,
.calendar .tab-special li,
.calendar .tab-active li,
.calendar .tab-special-active li,
.calendar .tab-special-on li {
	margin-bottom: 3px;
	font-size: 12px;
}

.calendar .tab li.last {
	font-weight: bold;
}

.calendar .tab li strong,
.calendar .tab-active li strong,
.calendar .tab-special li strong,
.calendar .tab-special-active li strong,
.calendar .tab-special-on li strong {
	color: #293033;
}

.calendar .tab ul li.category,
.calendar .tab-active ul li.category {
	width: 170px;
	min-height: 50px;
}

.calendar .tab-special ul li.category,
.calendar .tab-special-active ul li.category,
.calendar .tab-special-on ul li.category  {
	width: 127px;
	min-height: 33px;
	font-size: 12px;
}

.calendar .tab-special ul li.last,
.calendar .tab-special-on ul li.last {
	font-size: 12px;
	font-weight: bold;
}

.calendar .tab ul li a,
.calendar .tab-special ul li a,
.calendar .tab-special-on ul li a {
	color: #FF6600;
	font-weight: bold;
	text-decoration: none;
}

.calendar .tab-active ul li.last,
.calendar .tab-special-active ul li.last {
	display: none;
}

/**gutters*/
.calendar .gutter {
	clear: left;
}

.calendar .gutter .top-gutter .gutter-section {
	height: 5px;
	width: 195px;
	float: left;
	background: url(/customer-service/rewards/images/calendar/gutter-top-bg.png) 0 0 repeat-x;
	position: relative;
	border-right: 5px solid #FFFFFF;
}

.calendar .gutter .top-gutter .gutter-section-special {
	width: 149px;
	height: 5px;
	float: left;
	background: url(/customer-service/rewards/images/calendar/gutter-top-bg.png) 0 0 repeat-x;
	position: relative;
	border-right: 5px solid #FFFFFF;
}

.calendar .gutter .top-gutter .gutter-section.on,
.calendar .gutter .top-gutter .gutter-section-special.on {
	background: url(/customer-service/rewards/images/calendar/gutter-top-bg-on.png) 0 0 repeat-x;
}

.calendar .gutter .top-gutter .gutter-section.last {
	border-right: none;
}

.calendar .gutter .top-gutter .gutter-section .top-gutter-right,
.calendar .gutter .top-gutter .gutter-section-special .top-gutter-right {
	height: 5px;
	width: 5px;
	position: absolute;
	top: 0;
	right: 0;
	background: url(/customer-service/rewards/images/calendar/gutter-right.png) 0 0 no-repeat;
}

.calendar .gutter .top-gutter .gutter-section.on .top-gutter-right,
.calendar .gutter .top-gutter .gutter-section-special.on .top-gutter-right
 {
	background: url(/customer-service/rewards/images/calendar/gutter-right-orange.png) 0 0 no-repeat;
}

.calendar .gutter .top-gutter .gutter-section.active,
.calendar .gutter .top-gutter .gutter-section-special.active {
	background: url(/customer-service/rewards/images/calendar/gutter-top2-bg.png) 0 0 no-repeat;
}

.calendar .gutter .top-gutter .gutter-section.active .top-gutter-right,
.calendar .gutter .top-gutter .gutter-section-special.active .top-gutter-right {
	width: 10px;
	background: url(/customer-service/rewards/images/calendar/gutter-mask-right.png) 0 0 repeat-y;
}

.calendar #gutter-section5.active {
	margin-left: 1px; 
}

#bottom-gutter {
	clear: left;
	height: 13px;
}

.calendar .gutter .bottom-gutter1 {
	background: url(/customer-service/rewards/images/calendar/bg-5tabs.png) 0 0 no-repeat;
}

.calendar .gutter .bottom-gutter2 {
	background: url(/customer-service/rewards/images/calendar/bg-5tabs.png) 0 -104px no-repeat;
}

.calendar .gutter .bottom-gutter-special2 {
	background: url(/customer-service/rewards/images/calendar/bg-5tabs.png) 0 -13px no-repeat;
}

.calendar .gutter .bottom-gutter3 {
	background: url(/customer-service/rewards/images/calendar/bg-5tabs.png) 0 -26px no-repeat;
}

.calendar .gutter .bottom-gutter-special3 {
	background: url(/customer-service/rewards/images/calendar/bg-5tabs.png) 0 -39px no-repeat;
}

.calendar .gutter .bottom-gutter3-active4 {
	background: url(/customer-service/rewards/images/calendar/bg-5tabs.png) 0 -52px no-repeat;
}

.calendar .gutter .bottom-gutter4 {
	background: url(/customer-service/rewards/images/calendar/bg-5tabs.png) 0 -65px no-repeat;
}

.calendar .gutter .bottom-gutter-special4 {
	background: url(/customer-service/rewards/images/calendar/bg-5tabs.png) 0 -78px no-repeat;
}

.calendar .gutter .bottom-gutter5 {
	background: url(/customer-service/rewards/images/calendar/bg-5tabs.png) 0 -91px no-repeat;
}


/**tab content*/
 
.calendar .tab-content {
	clear: left;
	min-height: 290px;
	background: url(/customer-service/rewards/images/calendar/content-bg.png) 0 0 repeat-y;
}

.calendar .tab-content-text {
	width: 590px;
	padding: 35px 0 0 331px;
	font-size: 12px;
	line-height: 1.3;
}

.calendar .tab-content-text h1 {
	padding-bottom: 15px;
	font-size: 28px;
	color: #FF6600;
	line-height: 1.2;
	font-weight: bolder;
}

.calendar .tab-content-text h2 {
	font-size: 16px;
	font-weight: bold;
	color: #293033;
}

.calendar .tab-content-text ul {
	margin-top: 15px;
	font-size: 14px;
	font-weight: bold;
}

.calendar .tab-content-text li {
	padding-bottom: 4px;
	padding-left: 10px;
	background: url(/customer-service/rewards/images/calendar/lg-bullet.png) 0 .5em no-repeat;
}

.calendar .tab-content-text .description {
	width: 320px;
	float: left;
	margin-top: 25px;
}

.calendar .tab-content-text .description p {
	width: 275px;
}

.calendar .tab-content-text .description ul {
	width: 320px;
	padding-bottom: 10px;
	font-size: 14px;
}

.calendar .tab-content-text .description ul li {
	float: left;
	width: 145px;
	padding-right: 5px;
	font-weight: bold;
}

.calendar .tab-content-text .description ul.one-column li {
	float: none;
	width: 290px;
}

.calendar .tab-bottom {
	background: url(/customer-service/rewards/images/calendar/tab-bottom.png) 0 0 no-repeat;
	height: 10px;
	font-size: 1%;
}

/** no javascript messaging*/
.no-javascript { 
	width: 950px;
	height: 325px;
	padding: 130px 0 0 0;
	background: url(/customer-service/rewards/images/calendar/bg-nonjs.png) 0 0 no-repeat;
	text-align: center;
	font-size: 12px;
}

.no-javascript h4 {
	width: 540px;
	margin: 5px auto 15px auto;
	font-size: 18px;
	font-weight: bold;
}
	
