@charset "UTF-8";
/* 
COLOR PALETTE
*************************************************************
pink			#cc48a8 (headers)
dark blue		#212972 (main nav text)
cyan			#0d81f7 (links)
light blue1		#c8e5f3 (footer nav bkrnd)
light blue2		#a1cde2 (photo feature unselected)
light blue3		#e5f3fa (main nav submenu)
light blue4		#c6e4f3 (main mnav subment selected)	
black 			#333333 (body text)
light gray		#eeeff4 (page brknd)
tan				#ede7d7 (right col brknd)



SCREEN DISPLAY 
************************************************************ */
@media screen, print {
	/* reset tags to reduce browser inconsistencies */
	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, img, 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: 0;
		padding: 0;
		border: 0;
		font-size: 100%;
		vertical-align: baseline;
		background: transparent;}

	/* forces vertical scroll bar to eliminate jumping on short pages */
	html {
		overflow-y: scroll;}
	body {
		font-size: 12px; 
		font-family: Verdana, Arial, Helvetica, sans-serif;
		line-height: 150%;
		color: #000;
		background-color: #eeeff4;
		text-align: center; /* to make primary container center properly in IE */}
	.container { 	/* primary container sets base page width */
		width:999px;
		margin: 0 auto;
		text-align: left;
		background: #eeeff4 url(images/pg-brknd.jpg) repeat-y center;
}
	h1 {
	font-family: Georgia, "Times New Roman", Times, serif;
		font-size: 22px;
		margin-top: 35px;
		margin-bottom: 20px;
		color: #212972;}
	h2 {
		font-family: Georgia, "Times New Roman", Times, serif;
		font-size: 18px;
		margin: 15px 0 10px 0;
		color: #212972;}
	h3 {
		font-family: Georgia, "Times New Roman", Times, serif;
		font-size: 16px;
		margin: 10px 0 5px 0;
		color: #212972;}
	h4 {
		font-family: Verdana, Arial, Helvetica, sans-serif;
		font-size: 12px;
		margin: 10px 0 0 0;
		color: #212972;}
	p  {
		font-size: 13px;
		line-height: 16px;
		margin-top: 0;
		margin-bottom: 18px;}
	ul, ol {
		margin-left: 3em; 
		margin-bottom: 1.2em;}	
	li {
		font-size: 12px; 
		margin-bottom: 15px;
		line-height: 13px;
		list color: #000;}

	a {
		color: #0d81f7;
		text-decoration: none;}
	a:hover {color: #212972; text-decoration: underline;}
	a:active { /* removes outline on clicked links in FF browsers */
			outline: none;}
	a:focus {
  		-moz-outline-style: none;}
		
	.printonly { /* use this class on things that are print only */
		display: none !important;}
	input:focus, select:focus, textarea:focus {
		background-color: #c6e4f3;}
	input[type='image'] {
		background: none;}



/* start unique DIV areas by ID  
---------------------------------------------- */	



	#header {width: 100%;}
	#header .container {
		xheight: 124px;
		xclear: both;
		xoverflow: visible;}
		
	span.tnav-logo {
		display: block;
		padding: 0;
		margin: 10px 0 5px 30px;
		float: left;}


	h1.tnav-logo { /* Delete this set of styles, once all logos have been switched to span class above  */
		padding: 0;
		margin: 10px 0 5px 0;
		float: left;}
	h1.tnav-logo a {
		display:block;
		margin: 0 0 0 30px;
		text-indent:-9999px;
		width:415px;
		height:77px;
		background-image: url(images/allearsnet-logo-15yr.gif);}
		
		
	#banner, #bannerblog {
		float: right;
		margin: 15px 40px 0 0;}

	#tnav {
		clear: both;
		background: url(images/tnav-bkrnd.jpg) repeat-x top;
		height: 32px;
		width: 986px;
		margin: 0 0 0 7px;
		position: relative;
		z-index: 999;}

	#tnavholiday {
		clear: both;
		background: url(images/holiday.gif) repeat-x top;
		height: 32px;
		width: 986px;
		margin: 0 0 0 7px;
		position: relative;
		z-index: 999;}

	#tnavoctholiday {
		clear: both;
		background: #FF8040;
		height: 32px;
		width: 986px;
		margin: 0 0 0 7px;
		position: relative;
		z-index: 999;}

	#content, #navbottom, #footertop {
		width: 100%;
		overflow: visible;
		clear: both;}
	#content .container {
		overflow: auto;
		background: url(images/container-brknd2.gif) repeat-y center;}
		
	#content .container .bgimage { /* fixes IE7 issue where scrollbars show for no reason  */
		position: relative;
		overflow: visible;
		width: 100%;}
	
	#navbottom .container { 
		width: 999px;
		height: 17px;
		background: url(images/tnav-bottom.gif) center no-repeat;}
		
	#footertop .container {
		width: 999px;
		height: 17px;
		background: url(images/footer-top.gif) center no-repeat;}
		
	#hp-lcol {
		width: 776px;
		float: left;
		padding:0 0 0 42px;
		overflow: visible;}
	#hpphotoarea {
		float: left;
		width:475px;
		height:381px;
		background-color:#a1cde2;}
		
		
		
/* Styles for Photo Feature Area */		
			
	/* root element for tabs  */
	ul.tabs {
		position: absolute;
		top: 260px;
		left: 42px;
		width:475px;
		z-index: 40;
		list-style:none; 
		margin:0 !important; 
		padding:0;	}
	
	/* single tab */
	ul.tabs li { 
		float:left;	 
		text-indent:0;
		padding:0;
		margin:0 !important;
		list-style-image:none !important; }
	
	/* link inside the tab. uses a background image */
	ul.tabs a { 
		position:relative;
		top: 1px;
		left: 0;
		display:block;
		background: url(images/photofeature-unselected-bkrnd.gif) no-repeat top center;
		width: 118px;
		height: 137px;
		color:#212972;
		padding:0px;
		margin:0px;
		text-align:center;	
		text-decoration:none;}
		
	ul.tabs a img { padding: 20px 0 5px 0;}
	
	ul.tabs a p {
		font-size:11px;  
		line-height:12px;
		clear: both;}
	
	ul.tabs a:active {
		outline:none;}
	
	/* when mouse enters the tab move the background image */
	ul.tabs a:hover {
		xborder-top: 3px solid #6c91a3;
		color:#0d81f7;	}

	/* active tab uses a class name "current". it's highlight is also done by moving the background image. #c8e5f3 */
	ul.tabs a.current, ul.tabs a.current:hover, ul.tabs li.current a {
		background: url(images/photofeature-selected-bkrnd.gif) no-repeat top center;
		cursor:default !important; 
		color:#212972 !important;
		font-weight: bold;}
	
	/* Different widths for tabs: use a class name: w1, w2, w3 or w2 */

	/* initially all panes are hidden */ 

	
	div.panes div.pane {
		display:none;}

	div.panes div {
		display:none;
		position:absolute;		
		height:275px;}
	
	div.panes div span.photolink {
		display: block;
		clear: both;
		position: absolute;
		z-index: 1;
		top: 240px;
		left: 0;
		height: 30px;
		width: 475px;
		background-color: #000;
		filter:alpha(opacity=60);/*Needed for IE*/
		-moz-opacity:0.60;/*Older mozilla broswers like NN*/
		-khtml-opacity: 0.60;/*Old versions of Safari and "KHTML" browser engines*/
		opacity: 0.60;/*FF, Safari, and Opera*/
		text-decoration: none;}
		
	div.panes div a {
		display: block;
		position: absolute;
		float: left;
		z-index: 2!important;
		bottom: 5px;
		height: 30px;
		width: 459px;
		line-height: 29px;
		padding: 0 8px;
		color: #fff;
		text-decoration: none;}
	
	
	div.panes div a:hover {background-color: #212972;}
	
	div.panes div a em {
		display: block;
		position: absolute;
		right: 11px;
		bottom: 1px;
		background: url(images/btn-arrow-black.gif) no-repeat right center;
		padding-right: 15px;
		font-style:normal;
		font-weight: bold;
		color: #fff;}
		
div.panes div a:hover em {color: #0d81f7;}
	
		
	.hplinklist {
		display: block;
		width: 235px;
		float: left;
		overflow: visible;
		padding: 0 20px 20px 0;}
	.hplinklist ul {
		margin-left: 17px;}
	.hplinklist li {
		list-style-image:url(images/star-bullet.gif);}
		
		
	#news.hplinklist {
		display: block;
		width: 230px;
		height: 381px;
		float: left;
		overflow: visible;
		padding: 0 20px 20px 0;}
		
	#news.hplinklist ul {margin-left: 0px;}
	#news.hplinklist li {
		list-style-image: none;
		list-style-type:none;
		padding-left: 28px;
		width: 205px;}
	#news .wdw {
		background:url(images/list-icon-wdw.gif) 0 0 no-repeat;}
	#news .dl {
		background:url(images/list-icon-dl.gif) no-repeat;}	
	#news .dcl {
		background:url(images/list-icon-dcl.gif) no-repeat;}			
		 		
	.hplinklist li a {
		 color: #333333;
		 text-decoration: none;}
	.hplinklist li a:hover {
		text-decoration: underline;
		color: #0d81f7;}

	#news {
		margin-left: 37px;
		min-height: 390px;}
		
	#blogcentral li {
		display:block;
		background-color: #fff!important;}

	#hp-rcol {
		width: 135px;
		padding: 0 30px 0 0;
		float: right;
		overflow: visible;}
		
	#hp-rcol ul {
		text-indent: 0;
		margin-left: 0px;
		list-style:none;}
	#hp-rcol li {
		margin-bottom: 7px;
		font-size: 11px;}
	#hp-rcol li a { text-decoration:none;}
	
	.googlesearch {
		background-image: none!important;
		width:105px!important;
		float:left!important;}
	
	#hp-rcol .socialicon {
		display: block;
		float: left;
		background-image:url(images/icons-social.gif);
		height: 16px;
		width:16px;
		margin: -3px 5px 0 0;}
	#hp-rcol p {font-size: 11px;}
		
		
	#footer {
		width: 100%;
		overflow: visible;
		clear: both;}
		
	#footer .container  {
		background: #c8e5f3;
		width: 886px;
		padding: 30px 50px 10px 50px;}
	
	#footer .container p {
		font-size: 10px;
		text-align: center;}

	#footerholiday {
		width: 100%;
		overflow: visible;
		clear: both;}
		
	#footerholiday .container  {
		background: url(images/holiday1.gif) repeat-x top;
		width: 886px;
		padding: 30px 50px 10px 50px;}

	#footeroctholiday {
		width: 100%;
		overflow: visible;
		clear: both;}
		
	#footeroctholiday .container  {
		background: #FF8040;
		width: 886px;
		padding: 30px 50px 10px 50px;}



/* YAHOO PIPES & BADGE SYTLES FOR BLOG CENTRAL */

	.pipesDescription, div.ybf { display: none!important;}
	
	.pipesTitle {
		font-weight: normal!important;
		padding-bottom: 0!important;} 
			
	li.ybi {
		padding: 0 0 15px 15px!important;
		background:url(images/star-bullet.gif) no-repeat!important;
		margin-bottom: 0!important;}
		
	.pipesImgdescription .pipesTitle  {padding-bottom: 0 !important;}
	.pipesThumbnail {display: none !important;}
	
	.pipesSmallthumb {display: none !important; /* Fixes IE7 bug: too much space between list items */
	margin: 0 !important;}
		
	.pipesHolder {
		padding: 0!important;}
	
	div.ybr {height: auto!important; overflow-x: auto;}
	
	.hplinklist div {height: auto!important;}


/* TWITTER FEED STYLES */
	.twtr-hd, .twtr-ft  {display: none;}
	.twtr-bd {padding: 0!important;} /* removes left & right borders of box*/
	.twtr-widget .twtr-tweet-wrap {padding: 10px 10px 10px 0!important;}
	.twtr-tweet-text {margin-left: 20px!important;}
	.twtr-tweet-text p {font: 11px Arial, Helvetica, sans-serif;}
	.twtr-avatar {width: 20px!important; height: 25px!important;}
	.twtr-img img {width: 15px!important; height: 15px!important;}
	




/* SUPERFISH MENU STYLES */
	
	/*** ESSENTIAL STYLES ***/
	.sf-menu, .sf-menu * {
		margin:0;
		padding: 0;
		list-style: none;}
	.sf-menu {
		line-height: 1.0;
		position: relative;
		left: 30px;} /* CHANGE THIS TO CENTER NAV BAR  */ 
	.sf-menu ul {
		position: absolute;
		top: 	-999em;
		width: 	16em; /* left offset of submenus need to match (see below) */}
		
	.sf-menu ul li {
		width: 	100%;}
	.sf-menu li:hover {
		visibility: inherit; /* fixes IE7 'sticky bug' */}
	.sf-menu li {
		float: 	left;
		position: relative;}
	.sf-menu a {
		display: block;
		position: relative;}
	.sf-menu li:hover ul, .sf-menu li.sfHover ul {
		left: 0;
		top: 	31px; /* match top ul list item height */
		z-index: 99;}
	ul.sf-menu li:hover li ul, ul.sf-menu li.sfHover li ul {
		top: 	-999em;}
	ul.sf-menu li li:hover ul, ul.sf-menu li li.sfHover ul {
		left: 	16em; /* match ul width */
		top: 	0;}
	ul.sf-menu li li:hover li ul, ul.sf-menu li li.sfHover li ul {
		top: 	-999em;}
	ul.sf-menu li li li:hover ul, ul.sf-menu li li li.sfHover ul {
		left: 	16em; /* match ul width */
		top: 	0;}
	
	/*** DEMO SKIN ***/
	.sf-menu {
		float: 	left;}
	.sf-menu a {
		border-left:	1px solid #b2d4e7;
		border-bottom:	1px solid #b2d4e7;
		padding:  .74em 1.25em .6em 1.25em;
		text-decoration:none;
		font: 12px Arial, Helvetica, sans-serif;
		font-weight: bold;}
	.sf-menu li li a {
		font-weight: normal;
		padding: 	.4em 1.25em;}
	.sf-menu a, .sf-menu a:visited  { /* visited pseudo selector so IE6 applies text colour*/
		color: 	#212972;}
	.sf-menu li {
		xbackground: #cbe6f3;}
	.sf-menu li li {
		background: #e5f3fa;}
	.sf-menu li li li {
		background: #9AAEDB;}
	.sf-menu li:hover, .sf-menu li.sfHover, .sf-menu a:focus, .sf-menu a:hover, .sf-menu a:active {
		background: #e5f3fa;
		outline: 0;
		color: #0d81f7;}
	.sf-menu li li a:hover {
		background: #c6e4f3;
		color: #0d81f7;}
	
	/*** arrows **/
	.sf-menu a.sf-with-ul {
		padding-right: 	2.25em;
		min-width: 1px; /* trigger IE7 hasLayout so spans position accurately */}
	.sf-sub-indicator {
		position: absolute;
		display: block;
		right: 	.75em;
		top: 	1.05em; /* IE6 only */
		width: 	10px;
		height: 	10px;
		text-indent: 	-999em;
		overflow: hidden;
		background: url('images/arrows-ffffff.png') no-repeat -10px -100px; /* 8-bit indexed alpha png. IE6 gets solid image only */}
	a > .sf-sub-indicator {  /* give all except IE6 the correct values */
		top: 	.8em;
		background-position: 0 -100px; /* use translucent arrow for modern browsers*/}
	/* apply hovers to modern browsers */
	a:focus > .sf-sub-indicator, a:hover > .sf-sub-indicator, a:active > .sf-sub-indicator, li:hover > a > .sf-sub-indicator, li.sfHover > a > .sf-sub-indicator {
		background-position: -10px -100px; /* arrow hovers for modern browsers*/}
	
	/* point right for anchors in subs */
	.sf-menu ul .sf-sub-indicator { background-position:  -10px 0; }
	.sf-menu ul a > .sf-sub-indicator { background-position:  0 0; }
	/* apply hovers to modern browsers */
	.sf-menu ul a:focus > .sf-sub-indicator, .sf-menu ul a:hover > .sf-sub-indicator,
	.sf-menu ul a:active > .sf-sub-indicator, .sf-menu ul li:hover > a > .sf-sub-indicator, .sf-menu ul li.sfHover > a > .sf-sub-indicator {
		background-position: -10px 0; /* arrow hovers for modern browsers*/}
	
	/*** shadows for all but IE6 ***/
	.sf-shadow ul {
		background:	url('images/shadow.png') no-repeat bottom right;
		padding: 0 8px 9px 0;
		-moz-border-radius-bottomleft: 17px;
		-moz-border-radius-topright: 17px;
		-webkit-border-top-right-radius: 17px;
		-webkit-border-bottom-left-radius: 17px;}
	.sf-shadow ul.sf-shadow-off {
		background: transparent;}
	
	
	
	/******* STYLES FOR INTERIM HOME PAGE  **************************************************************/
	
	#content.interim .container {background: #eeeff4 url(images/container-brknd3.gif) repeat-y center;}
	#navbottom.interim .container {background: url(images/tnav-bottom2.gif) center no-repeat;}
	#footertop.interim .container {background: url(images/footer-top2.gif) center no-repeat;}
	
	#content.interim .container h2 {
		margin-top: 0;
		margin-bottom: 10px;}
	#content.interim .container h3 {
		color: #212972;
		font: 15px/19px Helvetica, Arial, Verdana, sans-serif;
		margin: 25px 0 5px 0;
		font-weight: bold;}
	#content.interim .container h3 a {text-decoration: none;}
	#content.interim .container h3 a:hover {text-decoration: underline;}
	#content.interim .container h3.topfix  {margin: -2px 0 5px 0;}
	#content.interim .container p {margin-bottom: 5px;}
	
	.halfcol {
		width: 420px;
		padding: 10px 0 0 50px;
		float: left;}
	.pinkbold {
		color: #cc48a8;
		font-weight: bold;}
		
	
	#content.interim .container .hplinklist li {
		margin-bottom: 5px;
		width: auto;}
	
	#content.interim .container .thumbsection {
		padding-bottom: 12px;
		overflow: auto;
		clear: both;}
	
	.thumbsection ul {width: 300px;}

	

}

/*PRINT DISPLAY MODIFICATIONS
************************************************************/
@media print {
	#content .container {overflow: visible;}
	
	/* use this class on things that are display only */
	.screenonly {display: none!important;}
	
	/* use this class on things that are print only */
	.printonly {display: inherit!important;}
	
	/* use this class to display in both screen and print */
	.alwaysdisplay {display: inherit!important;}
	
	/* use this class to fix FireFox bug when content cuts off */
	.contentcutofffix  {overflow: visible!important;}


} /* END FOR PRINT FORMAT AREA */