@import url("tiles.css");
@import url("amber.css");
@import url("carousel.css");
@import url("accordion.css");


/* COLORS
------------------------------------------- */

/*
 * Blues
 * ------------------------
 * Dark         :   #0F3679 /being used/
 * Regular      :   #4D759A /being used/
 * Light        :   #C6D1DD /being used/
 * Very light   :   #E8F0F8 /being used/
 * 
 * Greys
 * ------------------------
 * Dark			:   #393733 /being used/
 * Regular      :   #888888 /being used/
 * Light	    :   #CCCCCC /being used/
 *
 * Tans
 * ------------------------
 * Dark			:   #B59D84 /not being used/
 * Regular      :   #CBBB9A /not being used/
 * Light	    :   #F1EDDF /not being used/
 *
 * ------------------------
 * Red          :   #CC0000 /being used/
 * Green        :   #68b000 /not being used/
 */

/* HTML TAG STYLES
------------------------------------------- */

body,ul,ol,dl,h1,h2,h3,h4,h5,h6,td,th,caption,pre,p,blockquote,input,textarea {
	color: #393733;
}

/*a {
	color: #0f3679;
	text-decoration: none;
	outline: none;
}

a:hover { 
	text-decoration: underline;
	color: #cc0000;
}*/

a {color: #0F3679;}

a:hover, a:focus, a:active {
	color: #CC0000;
	background-color: #FFF6BF;
	text-decoration: underline;
}

h1 { font-size: 107%; } /* 14px */
h2 { font-size: 100%; } /* 13px */
h3 { font-size: 92%; } /* 12px */
h4 { font-size: 85%; } /* 11px */
h5 { font-size: 77%; } /* 10px */

h1,h2,h3,h4,h5,h6,strong {color: #0F3679; font-weight: bold;}

h3 { 
	margin: 1em 0 .2em;
	border-bottom: 1px dotted;
}

abbr,acronym {
	border-bottom: 1px dotted #CCCCCC;
	cursor: help;
}

em { font-style: italic; }
p,fieldset,table {padding-bottom: .5em;}

.important {color: #CC0000;}
.hidden { display: none; }


/* INVISIBLE STUFF
------------------------------------------- */

.non-visual { display:none; position:absolute; left: -999px; }

/* FIXED WIDTHS (IMPORTANT DO NOT ALTER)
------------------------------------------- */

#doc2 {	width: 950px;}
.yui-t5 .yui-b{width: 240px; margin-right:5px;}
.yui-t5 #yui-main .yui-b {width: 700px;}

/* FIX UP IE6 PNG SUPPORT
http://www.twinhelix.com/css/iepngfix/
------------------------------------------- */
img, div { behavior: url(../js/iepngfix.htc); }


/* Container
------------------------------------------- */
#container {
background-image:url(http://static.ink.org/img/containerbg.jpg);
width:970px;
margin:auto;
}


/* HEADER
------------------------------------------- */

#hd {
	background: #fff url(http://static.ink.org/img/hd-bg-new.jpg) repeat-x;
	min-height:34px;
	margin-bottom: 5px;
}

.logo {
	width:179px;
	height:35px;
	float: left;
}

.logo a, a:hover{
	background:none;
}

/* MASTHEAD (INSIDE HEADER)
------------------------------------------- */

#masthead h1  {
	display:block;
	width:169px;
	height:35px;
	margin-top:3px;
	margin-left:3px;
	text-indent: -700em;
	text-decoration:none;
	float:left;
	padding-right:15px;
}

.graybar {
	width:auto;
}

.mastheadlinks {
	padding:16px 0 0 0px;
	font-size:.9em;
	font-weight:bold;
}

.mastheadlinks_error {
	padding:16px 0 8px 0px;
	font-size:.9em;
	font-weight:bold;
}


/* SEARCH (INSIDE HEADER)
------------------------------------------- */

#masthead form {
	padding:9px 10px 0 0;
	margin:0; /* need for IE Mac */
	text-align:right; /* need for IE Mac */
}

#masthead form label {
	color:#000;
	font-size:92%;
	letter-spacing:1px;
	font-weight:bold;
}

#masthead form #q {
	width: 175px;
	font-size: 92%;
	border: 1px solid #000;
	background: #e8f0f8;
	padding:2px;
}

#masthead form #q:hover, #header form #q:focus {
		background: #fff;
}

#masthead form input{
	vertical-align:middle;
}

/* BALLOONS
------------------------------------------- */

#balloon {
  display: none;
  width: 312px;
  height: 200px;
  position: absolute;
  border: none;
  margin: 0;
  z-index: 1001;
  /*background:url(../img/balloon2.png);*/
}

#balloon_back1 {
	background:url(../img/balloon.png);
	width: 312px;
  	height: 180px;
}

#balloon_back2 {
	background:url(../img/balloon2.png);
	width: 312px;
  	height: 180px;
}

#balloon_contents {
	width: 280px;
 	height: 135px;
	position:absolute;
	overflow: hidden;
  	z-index: 1002;
  	text-align:left;
	font-size: 85%;
}
#balloon_disable {
	position:absolute;
	z-index: 1003;
	font-size:85%;
	cursor:pointer;
	cursor:hand;
}

#balloon_contents h2 {
  margin: 0;
  font-size: 100%;
  font-weight: bold;
}


#balloon_contents ul {
  padding-left: 2px;
  margin-top: 7px;
  list-style: inside;
}


#balloon_contents p {
  padding-top: .5em;
}

#balloon_contents p a {
	text-decoration: underline;
}

#balloon_contents p a:hover {
	text-decoration: none;
}

/* TABBED NAVIGATION
------------------------------------------- */
#nav {
	float: left;
	width: 100%;
	margin-left: 5px;
	}

#nav li {
	float: left;
	margin: 0;
	padding: 0;
	}

#nav li a {
	float: left;
	display: block;
	font-size: 100%;
	margin: 0 3px 0 0; /* This is the space between the tabs */
	padding: 3px 4px; /* This is for the padding around the tab labels */
	color: #FFF;
	text-decoration: none;
	border: 1px solid #0F3679;
	border-bottom: none;
	background: #0F3679 url(../img/off_bg.gif) repeat-x top left;
	}

#nav li a span{	
	font-style: italic;
	/*font-family: 'Zapfino';
	font-size: 77%;*/
}

#nav li a:hover{
	color: #fff;
	/*padding-bottom: 4px;*/
	border-color: #6195be;
	background: #6195be url(../img/on_bg.gif) repeat-x top left;
}

#nav li a.current{
	color: #fff;
	/*padding-bottom: 4px;*/
	border-color: #6195be;
	background: #6195be url(../img/on_bg.gif) repeat-x top left;
}

/* CONTENT (HOMEPAGE)
------------------------------------------- */

#content-wrapper{
	width: 679px;
	clear:left;
	background: #6195be;
	padding: 8px; /* makes the thickness of the light blue border around the content */
	/*border-top: 1px solid #fff;*/
	margin: 5px;
}

* html #content-wrapper{
width: 695px; /* trick Win IE 5 */
w\idth: 679px; /* reset width for Mac IE 5 and Win IE 6 */
}

#content {
	background: #fff;
	/*background: #fff url(../img/main-bot.jpg) no-repeat right bottom;*/
	/*padding-bottom: 70px;*/ /* this pushes up the content so it doesn't touch sunrise */
	
}

.contentHeader{
	background: #fff url(../img/main-top.gif) no-repeat top center;
	height:10px;
}

.contentFooter{
	background: url(../img/main-bot.jpg) no-repeat bottom center;
	height:90px;
}
 
/* PAGENAME STYLES
------------------------------------------- */

#pageName{
	margin-top: -2px;
	margin-bottom: 5px;
	padding: 0px 0px 0px 10px;
}


/* FEATURED CONTENT
------------------------------------------- */
.ft-carousel {
	background: url(../img/featured-bottom.gif) no-repeat bottom left;
	width: 440px;
	padding-bottom: .7em;
	position: relative;
	overflow: hidden;
}

.ft-carousel h2 {
	padding: 5px 8px;
	border-bottom: 1px solid #E0CFAB;
	background: url(../img/h2-featured.gif) no-repeat top left;
}

.ft-carousel a.prev, .ft-carousel a.next {
	position: absolute;
	top: 2px;
	*top: 2px;
	right: 40px;
	width: 31px;
	height: 23px;
	background: url(../img/ft-icons-sprite.png) 0 0 no-repeat;
	overflow: hidden; 
	display: inline;
	cursor: hand;
	cursor: pointer;
}

.ft-carousel a.next {
	right: 10px;
	width: 30px;
	background-position: -30px 0;
}

.ft-carousel .scrollnav { 
	position: absolute;
	top: 9px;
	*top: 9px; 
	right: 85px;
	list-style-type: none;
}

.ft-carousel .scrollnav a {
	float: left;
	overflow: hidden;
	background: transparent url(../img/ft-icons-sprite.png) no-repeat -11px -24px;
	display: block;
	width: 9px;
	height: 9px;
	margin: 0 1px;
	padding: 0;
	text-indent: -100px;
}

.ft-carousel .scrollnav a.current { 
	background-position: 0 -24px;
	cursor: default;
}

.ft-carousel h3 {
	border: none;
	margin: .7em 0 0.2em 0;
	padding-left: 220px;
}

.ft-carousel img {
	border: 1px solid #c9b285;
	margin: -18px 0.7em 0.2em 0.7em;
	float: left;
	width: 200px;
	height: 150px;
}

.ft-carousel p {
	font-size: 85%;
	padding-right: .5em;
}

.featHide { display:none;}

/* STORY STYLES
------------------------------------------- */

#story{
	padding: 0px 10px 0px 10px;
}

#story p{
	font-size: 85%; /* 11px */
}

#story ul, #story ol {
  /*padding-left: 20px;*/
  list-style-position: outside;
  list-style-type: disc;
  font-size: 85%; /* 11px */
}

#story ol { list-style-type: decimal; }

#story .nofloat {
	padding:0;
	margin:0;
	float:none;
	vertical-align:middle;
}

#story ol{
	list-style: decimal;
	list-style-position: outside;
	margin: 0 0 0 10px;
	padding-bottom: 10px;
}

/*#story li{
	padding: 1px 0;
}*/

#story img{
	float: left;
	padding: 0px 10px 0px 0px;
	margin: 0 5px 5px 0;
}

#story p.note {
	clear: both;
	background: #FFF6BF;
	border-bottom: 1px solid #FFD324;
	border-top: 1px solid #FFD324;
	margin-top: 20px;
	margin-bottom: 10px;
	padding: 3px;
}

#story p.note span{
	color: #CC0000;
	font-weight: bold;
}

/*#story .sub{
	background: #FFF6BF;
	border: 1px solid #FFD324;
	padding: 5px;
	margin: 0 0 10px 0;
}*/

#subscriber {
	background: #FFF6BF;
	border: 1px solid #FFD324;
	padding: .5em;
	margin-top: .5em;
	-moz-border-radius: 1em;
	-webkit-border-radius: 1em;
	border-radius: 1em;
}

#subscriber h3 { margin-top: 0;}

#atoz{
	text-align:center;
}

#atoz a:link, #atoz a:visited{
	padding: 3px;
	text-decoration: underline;
}

#atoz a:hover{
	text-decoration: none;
}

/* NAVIGATION (INSIDE PAGES)
------------------------------------------- */

.container {
	padding-bottom: 10px;
}
	
#miniflex {
	width: 100%;
	float: left;
	border-bottom: 1px solid #0F3679;
	}

#miniflex ul {
	padding-left:0px;
}

#miniflex li {
	float: left;
	margin: 0; 
	padding: 0;
	display: inline;
	list-style: none;
	}
	
#miniflex a:link, #miniflex a:visited {
	float: left;
	line-height: 10px;
	margin: 0 5px 0 5px;
	text-decoration: none;
	color: #888;
	}

#miniflex a.active:link, #miniflex a.active:visited, #miniflex a:hover {
	border-bottom: 4px solid #0F3679;
	padding-bottom: 4px;
	padding-left:0;
	color: #0F3679;
	}

/* LINKS (BELOW FEATURED AREAS)
------------------------------------------- */
.links ul {
	margin-bottom: 8px;
	padding-left:0px;
}

.links li {
	display:inline;
	padding-top:2px;
	padding-right: 8px;
	padding-left: 0px;
}

/* USER PREFERENCES
------------------------------------------- */

#prefs ul{
	text-align: right;
}

#prefs li{
	display: inline;
}

/* RIGHT SIDE NAVIGATION (HELP, SUBSCRIBER, ALERT)
------------------------------------------- */

.sidebox {margin-top: 4px;background: url(/img/div-bottom.gif) no-repeat bottom left;}
.sidebox h2 {margin: 0;padding: 2px 8px;border-bottom: 1px solid #E0CFAB;background: url(/img/h2-bg.gif) no-repeat top left;}
.sidebox ul {padding: 4px 0 4px 8px;}
.sidebox li {padding: 1px 0pt;font-size: 85%; /* 11px */}
.sidebox li.underline {border-bottom: 1px solid #E0CFAB;width:95%;padding:1px;}
.sidebox img {position: relative;top: 3px;padding: 4px;margin-left: 4px;}
.sidebox .yui-gd .yui-u {margin-left: 0px;padding-bottom: .2em;}


/* PHOTO GALLERY (ON THE HOMEPAGE)
------------------------------------------- */

#photos { margin-top: 4px; background: url(../img/photo-div-bottom.gif) no-repeat bottom left; }
#photos h2 { margin:0; padding: 4px 8px 6px; color:#fff; background: url(../img/photo-h2-bg.gif) no-repeat top left; }
#photos p { padding: 0 0 .8em .8em; font-size: 85%;}
#photos img.flickr { border:medium none; clear:both; float:right; margin:-20px 12px 5px 0; }
#photos a:link, #photos a:visited { color:#fff; }
#photos a:hover { background-color: transparent; text-decoration: none; }

ul#photoList { padding: .8em 2.3em; }
ul#photoList li { margin: 4px; display: inline; }
ul#photoList li a img { border: 3px solid #dbd8ce; margin-bottom: 3px; }
ul#photoList li a:hover img { border-color: #bbbcbc; }

.floatl {float: left;}

/* PHOTO GALLERY (INSIDE PAGE - USING FLICKR API)
------------------------------------------- */

#photoGrid { padding: 10px 0; clear: both; }
#photoGrid img { float: none; margin: 0; padding: 5px; }

/* BEGIN GALLERY ELEMENTS */
.gallery ul {
  list-style: none;
}
.gallery ul li {
  display: inline;
  padding: 2px;
}
/* END GALLERY ELEMENTS */


#prevPage { float: left; }
#nextPage { float: right; }
.hideit { visibility:hidden; }
.showit { visibility:visible; }

/* LIGHTBOX
------------------------------------------- */

#lightbox{
	position: absolute;
	top: 40px;
	left: 0;
	width: 100%;
	z-index: 100;
	text-align: center;
}

#lightbox a img{ border: none; }

#outerImageContainer{
	position: relative;
	background-color: #fff;
	width: 250px;
	height: 250px;
	margin: 0 auto;
	}

#imageContainer{ padding: 10px; }

#loading{
	position: absolute;
	top: 40%;
	left: 0%;
	height: 25%;
	width: 100%;
	text-align: center;
	line-height: 0;
	}
#hoverNav{
	position: absolute;
	top: 0;
	left: 0;
	height: 100%;
	width: 100%;
	z-index: 10;
	}
#imageContainer>#hoverNav{ left: 0;}
#hoverNav a{ outline: none;}

#prevLink, #nextLink{
	width: 49%;
	height: 100%;
	background: transparent url(../img/blank.gif) no-repeat; /* Trick IE into showing hover */
	display: block;
	}
#prevLink { left: 0; float: left;}
#nextLink { right: 0; float: right;}
#prevLink:hover, #prevLink:visited:hover { background: url(../img/prevlabel.gif) left 15% no-repeat; }
#nextLink:hover, #nextLink:visited:hover { background: url(../img/nextlabel.gif) right 15% no-repeat; }


#imageDataContainer{
	font: 10px Verdana, Helvetica, sans-serif;
	background-color: #fff;
	margin: 0 auto;
	line-height: 1.4em;
	}

#imageData {padding:0 10px;}
#imageData #imageDetails { width: 70%; float: left; text-align: left; }	
#imageData #caption { font-weight: bold;	}
#imageData #numberDisplay { display: block; clear: left; padding-bottom: 1.0em;	}			
#imageData #bottomNavClose { width: 66px; float: right;  padding-bottom: 0.7em;	}	
		
#overlay{
	position: absolute;
	top: 0;
	left: 0;
	z-index: 90;
	width: 100%;
	height: 500px;
	background-color: #000;
	filter:alpha(opacity=60);
	-moz-opacity: 0.6;
	opacity: 0.6;
	}
	

.clearfix:after {
	content: "."; 
	display: block; 
	height: 0; 
	clear: both; 
	visibility: hidden;
	}

* html>body .clearfix {
	display: inline-block; 
	width: 100%;
	}

* html .clearfix {
	/* Hides from IE-mac \*/
	height: 1%;
	/* End hide from IE-mac */
	}	
	
#paginationLinks {
	 float: right;
	 font-size: 80%;
	 font-style: normal;
	 padding: 0 30px 10px 0;
}

.clear { clear:both; }

/* Terms of Service
------------------------------------------- */
.tos {
padding: 0 0 10px 10px;
}

.tos li{
padding-bottom: 5px;
}
/* FOOTER
------------------------------------------- */
#ft{ padding: 7px; background: #eaeaea; color: #CCC; font-size: 85%; /* 11px */ }
#ft a:link, #ft a:visited{ color: #666; padding: 3px; }
#ft a:hover{ color: #000; background: none; }
.copy {
	color:#ccc;
	text-align:left;
}

.copy a { color:#006;}

/* HIDDEN AND VISIBLE
----------------------------------------------*/
.visible { display:block; }
.visibleInline { display:inline; }
.hidden { display:none; }


/* Google Search Styles */
 
/**
 * Default theme
 *
 */
/* Slight reset to make the preview have ample padding. */
.cse .gsc-control-cse,
.gsc-control-cse {
 
  width: 96%;
}
.cse .gsc-branding,
.gsc-branding {
  display: none;
}
.cse .gsc-control-cse div,
.gsc-control-cse div {
  position: normal;
}
/* Selector for entire element. */
.cse .gsc-control-cse,
.gsc-control-cse {
 
}
.gsc-control-cse {
                                                                font-size:14px !important;
}
.cse .gsc-control-cse:after,
.gsc-control-cse:after {
  content:".";
  display:block;
  height:0;
  clear:both;
  visibility:hidden;
}
.cse .gsc-resultsHeader,
.gsc-resultsHeader {
  border:none;
}
/* Search button */
.cse input.gsc-search-button,
input.gsc-search-button {
  font-family: inherit;
  color: #000000;
  text-shadow: 0 1px 2px #FFFFFF;
  background-color: #CECECE;
  border: 1px outset;
  border-color: #666666;
  border-radius: 2px;
  -moz-border-radius: 2px;
  -webkit-border-radius: 2px;
}
/* Inactive tab */
.cse .gsc-tabHeader.gsc-tabhInactive,
.gsc-tabHeader.gsc-tabhInactive {
  border-bottom: none;
  color: #666666;
  background-color: #e9e9e9;
  border: 1px solid;
  border-color: #e9e9e9;
  border-bottom: none;
}
/* Active tab */
.cse .gsc-tabHeader.gsc-tabhActive,
.gsc-tabHeader.gsc-tabhActive {
  background-color: #FFFFFF;
  border: 1px solid;
  border-top: 2px solid;
  border-color: #e9e9e9;
  border-top-color: #FF9900;
  border-bottom: none;
}
/* This is the tab bar bottom border. */
.cse .gsc-tabsArea,
.gsc-tabsArea {
  margin-top: 1em;
  border-bottom: 1px solid #e9e9e9;
}
/* Inner wrapper for a result */
.cse .gsc-webResult.gsc-result,
.gsc-webResult.gsc-result {
  padding: .25em;
  border: 0px solid;
 
  margin-bottom: 1em;
}
/* Result hover event styling */
/*Promotion Settings*/
/* The entire promo */
.cse .gs-promotion.gs-result,
.gs-promotion.gs-result {
  background-color: #FFFFFF;
  border: 0px solid none;
  border-color: #336699;
}
/* Promotion image */
.cse .gs-promotion.gs-result .gs-promotion-image,
.gs-promotion.gs-result .gs-promotion-image {}
/* Promotion title */
.cse .gs-promotion.gs-result a.gs-title:link,
.gs-promotion.gs-result a.gs-title:link {
  color: #0000CC;
}
.cse .gs-promotion.gs-result a.gs-title:visited,
.gs-promotion.gs-result a.gs-title:visited {
  color: #0000CC;
}
.cse .gs-promotion.gs-result a.gs-title:hover,
.gs-promotion.gs-result a.gs-title:hover {
  color: #0000CC;
}
.cse .gs-promotion.gs-result a.gs-title:active,
.gs-promotion.gs-result a.gs-title:active {
  color: #0000CC;
}
/* Promotion snippet */
.cse .gs-promotion.gs-result .gs-snippet,
.gs-promotion.gs-result .gs-snippet {
  color: #000000;
}
/* Promotion url */
.cse .gs-promotion.gs-result ..gs-visibleUrl,
.gs-promotion.gs-result .gs-visibleUrl {
  color: #008000;
}
/* Style for auto-completion table
 * .gsc-completion-selected : styling for a suggested query which the user has moused-over
 * .gsc-completion-container : styling for the table which contains the completions
 */
.gsc-completion-selected {
  background: #D5E2FF;
}
.gsc-completion-container {
  font-family: Arial, sans-serif;
  font-size: 13px;
  position: absolute;
  background: white;
  border: 1px solid #666666;
  margin-left: 0;
  margin-right: 0;
  /* The top, left, and width are set in JavaScript. */
}
.gsc-search-box {display:none !important;}
.gsc-tabsArea {display:none;}
.gsc-resultsHeader {display:none;}
 
.gs-title a:link {color:#0F3679;text-decoration:underline;}
.gs-title a:visited {color:#0F3679;text-decoration:underline;}
.gs-title a:hover {color:#0F3679 !important; text-decoration:none;}
.gs-title a:active {color:#0F3679;text-decoration:underline;}
 
.gs-result  a:link {color:#0F3679;text-decoration:underline;}
.gs-result  a:visited {color:#0F3679;text-decoration:underline;}
.gs-result  a:hover {color:#0F3679!important; text-decoration:none;}
.gs-result  a:active {color:#0F3679;text-decoration:underline;}
.gs-result .gs-title, .gs-result .gs-title *  {color:#0F3679!important;}
.gsc-results .gsc-cursor-box .gsc-cursor-current-page {color:#0F3679 !important;}
.cse .gs-promotion, .gs-promotion {padding:10px 10px 10px 10px; display:block !important; border:1px solid #999999;}
.gs-promotion-image {float:left;}
 #cse div.gs-visibleUrl.gs-visibleUrl-short { display:none;  }
#cse div.gs-visibleUrl.gs-visibleUrl-long { display:block;  }
 .gsc-results {
padding-bottom:2px;
width:85%;
}

