/*
Site: The Children's Museum of Houston
Design: Brandi Lalanne, Lyndia Haryanto, and Daniel Meza for Schipul
Build: Brandi Lalanne for Schipul
Contributions by: David Stagg
URI: www.cmhouston.org
*/

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
margin:0px;
padding:0px;
} 

p { margin-bottom: 8px; color:#5c5c5c; font-size:12px}

body {
	font: 12px Arial, Helvetica, sans-serif;
	color: #6f6f6f;
	background: #d4eaf6 url(/images/home09/body-bg.jpg) repeat-x top center;
	}
	/* Hides from IE5-mac \*/
* html #content {height: 1%;}
/* End hide from IE5-mac */


ul, ol { margin: 1em 0; padding-left: 2.5em;}
dt { margin: 0.5em 0 0; }
dd { margin: 0.25em 0 0.5em 2.5em; }

h1, h2, h3, h5, h5, h6 { font-weight: bold; margin-bottom: 8px; } 

h1 { font-size: 18px; font-weight: bold; 	color: #2788cd; }
h2 { font-size: 16px; font-weight: bold; 	color: #2788cd; }
h3 { font-size: 12px; font-weight: bold; 	color: #2788cd; }
h4 { font-size: 12px; font-weight: bold; 	color: #666; }
h5 { font-size: 12px; font-weight: bold; 	color: #666; }
h6 { font-size: 12px; font-weight: bold; 	color: #666; }

a { color: #1e73c2; outline:none; text-decoration:none }
a:hover {color:#779B3B}


.clear {clear:both; margin:0; padding:0;}



/** STRUCTURE **/

#cloud-bg {background:url(/images/home09/cloud-bg.jpg) top no-repeat; width:100%} 

#chopper {
background: url(/images/home09/chopper.png) no-repeat right top; display:block; height:129px; position:absolute;
right:0;  top:0; width:138px; padding: 141px 0 0 0}

	#chopper input {color:#666; font-style:italic; font-size:12px}
	


#header {width: 100%; height: 313px; background:url(/images/home10/header.jpg) top center no-repeat;}

	#header #wrap {width: 960px; margin:0 auto}
	#header h1 { margin:0 !important}
	h1#logo a {display:block; float:left; width: 194px; height: 91px; text-indent:-9999px; background:url(/images/home10/logo.jpg) top right no-repeat}
	#flash {width: 960px; height:155px; background:url(/images/home10/flash-bg.jpg) top left no-repeat}
	
#content-top {width: 960px; margin:0 auto; height: 471px; background:url(/images/home10/content-top.jpg) top center no-repeat}

	#content-top .left {float:left; width: 303px; margin: 47px 0 0 22px; display:inline}
	
	.vid-top {width: 290px; height:14px; background:url(/images/home10/vid-top.jpg) top left no-repeat}
	.vid {width: 280px; background: #ac2a28; padding:0 5px; color:#FFF; position:relative; z-index:10} .vid a {color:#FFF; text-decoration:underline}
	.vid-btm {width: 290px; height:14px; background:url(/images/home10/vid-btm.jpg) top left no-repeat; position:relative; z-index:2}
	
	#video-object {
	position:relative;
	z-index:2;
	color:#FFF;
	padding-bottom:4px
	}
	#video-object p {color:#FFF; margin:0}
	
	#scroll {width:280px; height:123px; background:url(/images/home10/scroll-bg.jpg) top left no-repeat; margin:17px 0 0 0}
	
	#content-top .right {float:right; width: 610px; padding: 12px 18px 0 0; display:inline}
	
		#story-frame {width: 602px; height:297px; background: url(/images/home10/story-frame.jpg) top left no-repeat #F0F0EE; 
		padding: 8px 8px 9px 0px}
				
		
		/*******************************************************************Main Story - Category "Main -Top */
		.stories {display: block; width: 605px;  overflow: hidden !importants; position: relative;}
		
		.story-item { overflow: hidden !important; width:605px; height:391px; background:none !important}
		.story-item img { margin: 0 0 0 9px; padding: 0;width: 602px; height: 296px; }
		
		div.story-content {margin: 14px 0 0 0; width: 585px; height: 53px; padding: 10px; z-index: 1500; 
		position:relative; background: url(/images/home10/txt-bg.jpg) top left no-repeat; display:block}
		
		.story-content h1 {color: #FFF; margin: 0px 0 3px 0; padding: 0; line-height:14px; font-size:16px; 
		font-family: Arial, Helvetica, sans-serif; }	
		.story-content p {color: #FFF; margin:0; padding:0x; line-height:13px;  }
		.story-content a {color: #FFF; text-decoration:underline}
		.story-content a:hover {color:#FFF; text-decoration:none}
		
		.story-item .image-header {display: block; width: 602px; height: 296px; overflow: hidden !important; z-index: 10;}

		#nav-stories {display: block; height: 15px; padding: 5px 10px 0 0; text-align:right; float:right; margin: -122px 0 0 0; 
		position:relative; z-index:888 }
			#nav-stories a { display: block; width: 15px; height:15px;  float: left; margin-right: 5px;
			text-align: center; text-decoration: none; color:#FFF; font-size:11px; 
			background:url(/images/home10/page-non.png) repeat }
			#nav-stories a.activeSlide {width: 15px; height:15px; color: #FFF; background:url(/images/home10/page-active.png) repeat }
			
		#fullevents {width: 153px; height: 23px; background:url(/images/home10/story-event.jpg) top left no-repeat;
		display:block; text-indent: -9999px; position:relative; z-index:87; margin: -391px 0 0 449px} 
		#fullevents a {display:block; height: 23px; width: 153px}
		
		/**********************************************************************************************end story*/
		
		#sm-icons {width: 191px;  height:26px; background:url(/images/home10/sm-icons.jpg) top right no-repeat; float:right; clear:both; display:inline; margin-right:22px; position:relative; z-index:999}
		
		#sm-icons a {display:block; height:26px; width: 25px; text-indent:-9999px; float:left; margin-right: 6px}
		
	
#content-mid {width: 100%; background:url(/images/home10/mid-content.jpg) top center repeat-y; padding-bottom:20px}

	#content-mid #wrap {width: 1039px; margin:0 auto}
	
		#content-mid .left {width: 298px; float:left}
		
		#content-mid .right {width: 675px; float:left; padding-left:5px}
		
			#content-mid .right #carousel-title {width: 675px; height:70px; background:url(/images/home10/carousel-title.jpg) top center no-repeat}

			/******************************Story Area of Carousel - Category "Rotator - Bottom" **/
			
			#port-left {background:url(/images/home10/port-left.jpg) top left no-repeat; width: 25px; height:196px; 
		float:left; cursor:pointer; display:inline; margin-left:10px}
		#port-right {background:url(/images/home10/port-right.jpg) top left no-repeat; width: 25px; height:196px; 
		float:left;cursor:pointer;}
		
		
		div.thumbnails {float: left; width: 615px!important;}
		.thumbnails li {list-style:none;list-style-type:none;width: 195px;display:block;height: 377px;float: left; margin-right:15px}
		.thumbnails li img {margin: 0 auto; width: 189px; height: 189px; border: 3px solid #0C6AC1}		
		.thumbnails h2 a {font-size: 14px;display:block;clear:both; padding: 4px; width: 187px;
		margin: 0 !important; color: #A92727 !important; font-weight:normal !important; background-color:#efeeed}
		.thumbnails ul {margin:0 0 0 10px;padding:0; width: 623px;}
		.thumbnails ul li a {color: #D18E26; font-weight:bold;}
		.thumbnails p {display:block; width: 187px; margin: 0 0 0 4px; color:#737373}
		
		#btn-learn-more { background:url(/images/home10/blue-btn.jpg) top left no-repeat; line-height: 25px; width: 119px; 
		display:block; color:#FFF; padding-left:8px;}
		#btn-learn-more:hover {color:#CCC}
		
		/**********************************************************************************************end story*/
		
		
		
#content-btm {width: 100%; background:url(/images/home10/btm-content.png) top center repeat-y;}

	#content-btm #wrap {width: 890px; margin:0 auto; background:url(/images/home10/btm-titles.png) top center no-repeat; 
	padding:0px 80px 5px 70px}
	
	#content-btm #wrap .left {width: 275px; float:left; padding-top:87px}
	
	#content-btm #wrap .mid {width: 272px; float:left; padding:124px 0 20px 16px}
		#content-btm #wrap .mid .rssitem h2 {font-weight:bold; margin:0}
	
	#content-btm #wrap .right {width: 293px; float:right;padding-top:87px}
	
		#tweets ul {margin:0; padding:0; list-style:none;}
				
				#tweets ul li a, #tweets a {color:#1e73c2;}
				
				.small-text a{font-size:11px; line-height: 21px; display:block; text-decoration:underline; color:#0E6EC2}
				.small-text a:hover {color:#000;}
				
				.twitterTime a {clear:both; text-decoration:none; font-style:italic; font-size:11px; color:#999 !important; 
				clear:both; float:left}
	
		
		#sm-btm {width:288px; height:50px; background:url(/images/home10/sm0btm.jpg) top left no-repeat}
		
		#sm-btm a {display:block; height:50px; width: 57px; text-indent:-9999px; float:left;}
		

	/*footer*/
	#footer {min-height: 194px; width: 100%; background:url(/images/home10/footer-bg.png) top center no-repeat;
	 margin:0 auto; color:#FFF}
	
	#footer-wrap {width: 913px; margin:0 auto}
		#foot-left {width: 262px; float:left; padding:59px 0 0 0}
		
		#foot-left h3, #foot-left p, #foot-left a {color:#FFF}
		
		#foot-left h3 {margin:0;}
		
		#foot-mid {width: 253px; float:left; margin: 0 0 0 44px; display:inline; padding-top:59px}
		
			#foot-mid ul {margin: 0; padding:0; list-style:none}
			#foot-mid ul li {margin:0; padding:0; list-style:none}
			#foot-mid ul li a{line-height: 22px; display:block; text-decoration:none; color:#FFF; border-bottom: 1px solid #154668}
			#foot-mid ul li a:hover {background: #154668}
		
		#foot-right {float:right; width: 194px; display:inline; margin-right:114px;padding-top:59px}
		
		#foot-right p, #foot-right a {text-decoration:none; color:#FFF}
		#foot-right a:hover, #foot-left a:hover {color: #154668}
	
		#footer-btm {width: 960px; height: 70px; background:url(/images/home10/foot-btm.png) top center no-repeat #D4EAF6; 
		clear:both; margin:0 auto; padding: 25px 0 0 0; color: #75B5DB; font-size:11px}
		
			#footer-btm p {color: #75B5DB}
			

/*********************************************** Template Page*/
#template-mid {width: 100%; background:url(/images/membership/template-content.jpg) top center repeat-y; padding-bottom:20px}

	#template-mid #wrap {width: 1039px; margin:0 auto}
	
		#template-mid .left {width: 298px; float:left}
		
		#template-mid .right {width: 700px; float:left; margin-left: 22px;}
		
			.left #column-wrap {width: 235px; float:right; padding: 7px 10px 15px 0}
		
		#column-wrap .title-tweet {width: 235px; height: 35px; background:url(/images/home10/title-tweets.png) center no-repeat;}
		
		#column-wrap .title-photos {width: 235px; height: 35px; background:url(/images/home10/title-photos.png) center no-repeat;}
		#column-wrap .photo-feed img {width:72px; height:72px}
		
		#column-wrap span.twitterTime {display:block;padding-bottom:12px; clear:both;}
		#column-wrap #tweets a:hover {color:#779B3B;}
		
		#column-wrap .title-connect {width: 235px; height: 35px; background:url(/images/home10/title-connect.png) center no-repeat;}
		
		#column-wrap #social-icons {width: 235px; height: 40px; background:url(../../images/home10/sm-icons.png) center no-repeat}
		#column-wrap #social-icons a {display:block; height:50px; width: 45px; text-indent:-9999px; float:left;}
	
	
		

			
/*********************************************** Membership*/		
			#right-header {width: 700px; margin-bottom: 20px; }
			#membership-bodycontent {width: 339px; float:left; padding-left: 20px; padding-top: 30px;}
			#membership-bodycontent h2 {font-size:12px; font-weight:bold; }
			#membership-bodycontent ul { list-style:url(../../images/membership/membership-red-arrow.jpg) }
			#membership-bodycontent h1.member-benefits {display: block; width: 330px; height:19px; background:url(../../images/membership/membership-title-memberbenefit.jpg) top left no-repeat; text-indent:-9999px; margin-bottom: 10px;}
			
			
			
			#yal-bodycontent {width: 339px; float:left; padding-left: 20px; padding-top: 30px;}
			#yal-bodycontent h2 {font-size:12px; font-weight:bold; color: #018752}
			#yal-bodycontent ul {list-style: url(../../images/yalalag/red-arrow.jpg)}
			#yal-bodycontent h1.yal-benefits {display: block; width: 330px; height:19px; background: url(../../images/yalalag/yal-title-benefit.jpg) top left no-repeat; text-indent:-9999px; margin-bottom: 10px;}
			#yal-bodycontent h1.yal-intro {display: block; width: 330px; height:36px; background: url(../../images/yalalag/yal-title-intro.jpg) top left no-repeat; text-indent:-9999px; margin-bottom: 10px;}
			#yal-bodycontent h1.yal-benefits-spanish {display: block; width: 330px; height:40px; background: url(../../images/yalalag/yal-title-benefit-spanish.jpg) top left no-repeat; text-indent:-9999px; margin-bottom: 10px;}
			#yal-bodycontent h1.yal-intro-spanish {display: block; width: 330px; height:36px; background: url(../../images/yalalag/yal-title-intro-spanish.jpg) top left no-repeat; text-indent:-9999px; margin-bottom: 10px;}
			
			
			
			
			#membership-bodycontent a.membership-btn {display: block; width: 321px; height:37px; background:url(../../images/membership/membership-bluebtn-bg.jpg) top left no-repeat; margin-bottom: 10px; font-weight:bold; font-size: 14px; color:#fff; padding: 10px 0 0 10px;}
			
			
			#right-content {width: 341px; float:right; position:relative;}
				
				#membership-rotator {width: 393px; float:left; background:url(../../images/membership/membership-rotator-bg.jpg) top left no-repeat; height: 293px; position:absolute;}
								
				#yal-rotator {width: 393px; float:left; background:url(../../images/membership/yal-rotator-bg.jpg) top left no-repeat; height: 293px; position:absolute;}
				
				#below-rotator {width: 393px; float:left; background:url(../../images/membership/membership-below-rotator-bg.jpg) top left repeat-y; position:absolute; top: 275px; height:200px;}
					#below-rotator-content {width: 280px; margin: 0 0 0 40px;}
					#below-rotator-content h2 {font-size:12px; font-weight:bold; }
					#below-rotator-content h1.application-form {display: block; width: 330px; height:23px; background:url(../../images/membership/membership-title-application.jpg) top left no-repeat; text-indent:-9999px; margin-bottom: 10px;}
		
	#membership-bottom-content{width: 630px; margin: 40px 0; float:left; padding-left: 20px; }
	#membership-bottom-content h1.gifts {display: block; width: 330px; height:23px; background:url(../../images/membership/membership-title-great.jpg) top left no-repeat; text-indent:-9999px; margin-bottom: 10px;}
	#membership-bottom-content a.membership-btn {display: block; width: 321px; height:37px; background:url(../../images/membership/membership-bluebtn-bg.jpg) top left no-repeat; margin-bottom: 10px; font-weight:bold; font-size: 14px; color:#fff; padding: 10px 0 0 10px; float:left;}
	
	
div#bodycontent p, div#bodycontent{font-family: Arial, Helvetica, sans-serif; font-size:12px; color:#333;}

div#bodycontent a {color:#1e73c2;}
div#bodycontent a:hover {color:#779B3B;}
	
	
	
	
	
/* Scroll pane on home page */
.scroll-pane {
	height: 110px;
	overflow: auto;
	padding: 10px 10px 0 79px;
	color:#37383A
}
.scroll-pane a {color:#FFF}

.scroll-pane h1 {font-size:14px; margin-bottom: 10px;color:#37383A; letter-spacing:-1px}

.jScrollPaneContainer {
	position: relative;
	overflow: hidden;
	z-index: 1;
	margin-bottom: 20px;
}

.jScrollPaneTrack {
	position: absolute;
	cursor: pointer;
	right: 0;
	top: 0;
	height: 100%;
	background: #95C32D ;
}
.jScrollPaneDrag {
	position: absolute;
	background: #C3EC6A;
	cursor: pointer;
	overflow: hidden;
}
.jScrollPaneDragTop {
	position: absolute;
	top: 0;
	left: 0;
	overflow: hidden;
}
.jScrollPaneDragBottom {
	position: absolute;
	bottom: 0;
	left: 0;
	overflow: hidden;
}
a.jScrollArrowUp {
	display: block;
	position: absolute;
	z-index: 1;
	top: 0;
	right: 0;
	text-indent: -2000px;
	overflow: hidden;
	/*background-color: #666;*/
	height: 9px;
	background:url(/images/home10/arrowUP.jpg) top center no-repeat;}
	

a.jScrollArrowUp:hover {
	/*background-color: #f60;*/
}

a.jScrollArrowDown {
	display: block;
	position: absolute;
	z-index: 1;
	bottom: 0;
	right: 0;
	text-indent: -2000px;
	overflow: hidden;
	/*background-color: #666;*/
	height: 9px;
	background:url(/images/home10/arrowDOWN.jpg) top center no-repeat;
}
a.jScrollArrowDown:hover {
	/*background-color: #f60;*/

}
a.jScrollActiveArrowButton, a.jScrollActiveArrowButton:hover {
	/*background-color: #f00;*/
}


/****Expander***/
#expander {width: 298px;}
.expander_holder {width:298px; clear:both;}
#column6text2 p {margin:0}
.paneltext {
	display: block;
	width: 209px;
}
.paneltext2 {
	display: block;
	height:120px;
	margin-left: 0px;
}

.paneltext3 {
	display: block;
	height:260px;
}

.panel_title{
	overflow:hidden;
	float:right;
	cursor: hand;
	width: 253px;
}
#panel_clock{
	width: 290px;
}
.tendenci_content {
	font-size: 11px;
	width:183px;
	visibility:hidden;
	height:0px;
	overflow:hidden;
	position:relative;
	font-family: Arial, Helvetica, sans-serif;
	cursor: hand;
	float:right;
	padding-right:29px;}


.tendenci_content a {
text-decoration: none;
}

.tendenci_content h1 {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 11px;
	color: #000;
	background-color:#fff;
	text-decoration: none;
}

.dhtmlgoodies_answer_display{	/* Content that is slided down */
	position:relative;

}
#column6text
{

margin-left: 0px;
	

}
#column6text2
{

	width:174px;

}

#column6text2 img
{
margin-left: 0px;
margin-top: 0px;
}

#text2
{
	margin-right: 5px;
}

#articles_content
{
	height: 6px;
}
	#expander
{

	background:url(/images/home10/ex_bg.png) top right repeat-y;
	margin: 0px 0px 0px 0px;
	padding: 0px;
	float: right;
	

	}
	
	.calendarevents-top5 li a  {display:block; }
		

