@charset "utf-8";
/* Simple fluid media
   Note: Fluid media requires that you remove the media's height and width attributes from the HTMLcontainer-1
   http://www.alistapart.com/articles/fluid-images/ 
*/
body {
	background-color: #fff;
	margin: 0;
	padding: 0;
	color: #000;
}
img, object, embed, video {
	max-width: 100%;
}
/* IE 6 does not support max-width so default to width 100% */
.ie6 img {
	width:100%;
}
#skip-link, #skip-carousel{margin:0;}

#skip-link a,#skip-link a:visited, #skip-carousel a,#skip-carousel a:visited{display:block;width:100%;padding:2px 0 3px 0;text-align:center;background-color:#666;color:#fff;}

.element-invisible{position:absolute !important;clip:rect(1px 1px 1px 1px);clip:rect(1px,1px,1px,1px);overflow:hidden;height:1px;}

.element-invisible.element-focusable:active,.element-invisible.element-focusable:focus{position:static !important;clip:auto;overflow:visible;height:auto;}


/* THIS IS THE EDIT WHICH TURNED THE GO BUTTON TEAL */
.search-button {
	background-color: #066;
	border:.1em solid #000;
	padding: .2em;
	color:#fff;
	font-weight:bold;
}
/* ~~ miscellaneous float/clear classes ~~ */
.fltrt {  
	float: right;
	margin-left: .8em;
}
.fltlft { 
	float: left;
	margin-right: .8em;
}
.clearfloat {
	clear:both;
	
}
.center {
	text-align:center;
}
.smallfont {
	font-size: .9em;
}
a.noborder:link {
	 /*-moz-outline-style: none;     
    outline-style: none;
    outline-width: 0px;
    outline-color: -moz-use-text-color;*/
}
.shadow {
	box-shadow: 0 0 .6em #999;
}
.allcaps {
	text-transform:uppercase;
}
/*.tinyfont {
	font-size: .7em;
	}*/

/*
	Dreamweaver Fluid Grid Properties
	----------------------------------
	dw-num-cols-mobile:		5;
	dw-num-cols-tablet:		8;
	dw-num-cols-desktop:	12;
	dw-gutter-percentage:	25;
	
	Inspiration from "Responsive Web Design" by Ethan Marcotte 
	http://www.alistapart.com/articles/responsive-web-design
	
	and Golden Grid System by Joni Korpi
	http://goldengridsystem.com/
*/

/*-------------------------------
 Mobile Layout: 480px and below. 
 --------------------------------*/

.gridContainer {
	margin-left: auto;
	margin-right: auto;
	width: 87.36%;
	padding-left: 1.82%;
	padding-right: 1.82%;
	
}
#content {
	clear: both;
	float: left;
	margin-left: 0;
	width: 100%;
	display: block;
}


#header {
	clear: both;
	float: left;
	margin-left: 0;
	width: 100%;
	display: block;
}

#logo {
	clear: both;
	float: left;
	margin-left: 0;
/* 	width: 100%; */
	width: 33.90105433901054%;
	display: block;
	text-align:center;
	margin-bottom:.5em;
}

#header-right {
	clear: none;
	float: left;
	margin-left: 0;
/* 	width: 100%; */
/* 	width: 76.2711%; */
	width: 66.0989457%
	display: block;
}

#nav {
	font-family: 'Droid Sans', sans-serif;
	font-size: 1.3em;
	padding:.5em 0;
  width:100%;
  clear:none;
  display:block;
}
#nav a {
	display:block;
	padding: .5em;
	background:url(/graphics2014/nav-arrow.png) no-repeat right;
}
#nav a:link, #nav a:visited, #nav a:focus {
	color:#fff;
	text-decoration:none;
	background-color:#006666;
}
#nav a:focus {
	outline-color:#000;
}
#nav a:hover, #nav a:active {
	color:#fff;
	text-decoration:none;
	background-color: #666;
}
#nav ul {
	margin-left:0;
	padding-left:0;
	
}

#nav li {
	display: block;
	padding: 0 .5em;
	margin-bottom: .3em;
	border-right: none;
	list-style-type: none;
	white-space: normal;
}

#searchlink {
 width:100%;
 margin-bottom:.3em;
}
.collapsibleContainerTitle
{
display:none;	
	}
.TabbedPanelsTab {
		font-size:.7em;
		padding: .5em;
	}
.searchhome {
	width: 50%;
	border:.1em solid #000;
}
.callbacks .caption {
  display: block;
  font-size: 1.2em;
  text-shadow: none;
  color: #fff;
  background-color: #609;
  padding: .4em .5em;
  margin: 0;
  max-width: none;
  font-family: Georgia, Times, serif;
  }
  
  .callbacks .caption a {
	  color:#fff;
	  text-decoration: none;
	  display:block;
	  background-color:transparent;
  }

 /*.callbacks_nav {
	display: none;
  
  }*/
  .callbacks_nav {
  display: block;
  position: absolute;
  -webkit-tap-highlight-color: rgba(0,0,0,0);
  top: 30%;
  left: 0;
  opacity: 0.7;
  z-index: 3;
  text-indent: -9999px;
  overflow: hidden;
  text-decoration: none;
  height: 67px;
  width: 50px;
  background: transparent url("arrows-inner.png") no-repeat left top;
   }
  .callbacks_nav.next {
  left: auto;
  background-position: right top;
  right: 0;
   /*-moz-outline-style: none;     
    outline-style: none;
    outline-width: 0px;
    outline-color: -moz-use-text-color;*/
  }
  .callbacks_nav:hover, .callbacks_nav:active {
  opacity: 1.0;
 
  }
  .callbacks_nav:focus {
  /*-moz-outline-style: none;     
    outline-style: none;
    outline-width: 0px;
    outline-color: -moz-use-text-color;*/
 color:#f00;
 opacity: 1.0;
  }

#misc {
	clear: both;
	float: left;
	margin-left: 0;
	width: 100%;
	display: block;
}
#misc a:link, #misc a:visited, #misc a:focus {
	color: #333;
	background-color:transparent;
}
#misc a:hover, #misc a:active {
color: #609;
background-color:transparent;
}
#misc-contents {
	clear: both;
	float: left;
	margin-left: 0;
	width: 100%;
	display: block;
}
#misc-contents h3 {
	text-align:center;
	font-family: 'Droid Sans', sans-serif;
	font-size: 1.2em;
	font-weight: normal;
	margin-left: 1em;
	margin-right: 1em;
	border-bottom:1px solid #006666;
	color: #000;
	background-color:transparent;
	
}

#misc-contents p, #misc-contents ul {
font-size: 1em;
}
#misc-contents .tinyfont {
	font-size:.8em;
}
#misc-contents .image {
float:left;
width:25%;
text-align:center;
margin: 0 .5em 0 .3em;
}
#news .image {
float:right;
width:25%;
text-align:center;
margin-left: .5em;
}
#news li {
	margin-top:1em;
}
#news-carousel h2 {
	font-size:1.2em;
	margin:.3em 0 .5em 0;
	border-bottom:none;
	text-align:center;
	font-family: 'Droid Sans', sans-serif;
	font-weight: normal;
	color: #000;
	background-color:transparent;
}
#news-carousel p {
	font-size:1em;
}

#footer {
	clear: both;
	float: left;
	margin-left: 0;
	width: 100%;
	display: block;
border-top: .1em solid #ccc;
	font-family: 'Droid Sans', sans-serif;
	font-size: .8em;
	padding: .5em 0;
	margin-top:-2em;
	color:#333;
}

#footer a:link, #footer a:visited, #footer a:focus {
	color:#333;
	background-color:transparent;
}
#footer a:hover, #footer a:active {
color: #609;
background-color:transparent;
}
#footer #social {
	text-align:center;
	margin-bottom:.5em;
}
#footer #social img {
	margin-right:.5em;
}
#footer #bottom-nav {
display:none;
text-align:center;
margin:1em 0;
}

/* -----------------------------------------------------------------
Tablet Layout: 481px to 768px. Inherits styles from: Mobile Layout. 
------------------------------------------------------------------*/

@media only screen and (min-width: 481px) {

.gridContainer {
	width: 100%;
	padding-left: 0;
	padding-right: 0;
	margin: auto;
}
#content {
	clear: both;
	float: left;
	margin-left: 0;
	width: 100%;
	display: block;
	 padding-bottom: .1em;
	background-color: #ffffff;
/* 	background:transparent url(/graphics2014/bg-gray.jpg) repeat; */
}

#header {
	clear: both;
	float: none;
	margin-left: 0;
	padding: 0;
	width: 100%;
	display: block;
	position:absolute;
z-index:5;
background-color:transparent;
}
#logo {
	clear: both;
	float: left;
	margin-left: 0;
	/* width: 23.7288%; */
	width: 33.90105431%;
	display: block;
	background-color:transparent;
	margin-bottom:0;
}
#header-right {
	clear: none;
	float: left;
	margin-left:0;
	/* width: 76.2711%; */
	width: 66.0989457%;
	display: block;
}

#nav {
	font-family: 'Droid Sans', sans-serif;
	font-size: 1.0em;
	color:#fff;
	padding:.5em 0;
  /* background: rgb(0, 121, 121);
  background: rgba(0, 121, 121, .9);*/
  background-color: #006666;
  width:100%;
  clear:none;
  display:block;
}
#nav a {
	display: inline;
	padding:0;
	background:none;
}
#nav a:link, #nav a:visited, #nav a:focus {
	color:#fff;
	text-decoration:none;
	background-color:transparent;
}
#nav a:focus {
	outline-color:#fff;
}
#nav a:hover, #nav a:active {
	color:#fff;
	text-decoration:underline;
	background-color: transparent;
}


#nav ul {
	margin:0;
	padding:0;
}

#nav li {
	display: inline;
	padding: 0 .3em;
	margin: 0;
	border-right: .1em solid #fff;
	list-style-type:none;
	white-space:nowrap;
}




#nav li:last-child, #footer #bottom-nav li:last-child  {
	border-right: none;
}
#nav .noborder, #footer #bottom-nav .noborder {
	border-right: none;
}
#searchlink {
	clear: both;
	float: left;
	margin-left: 0;
	width: 100%;
	display: block;
}
.collapsibleContainerTitle
{
 margin-left:5em;
    cursor:pointer;
width:150px;
text-align:center;
 background: rgb(255, 255, 255);
  background: rgba(255, 255, 255, .8);
  font-weight:bold;
 font-size:1.3em;
  font-family: 'Droid Sans', sans-serif;
 margin-top:0;
 padding:0;
 line-height:.9em;
 outline-style: none;
    outline-width: 0px;
border:none;
display:block;
padding-top:.2em;
}
.collapsibleContainerTitle a:link, .collapsibleContainerTitle a:visited  {
	color:#000;
	text-decoration:none;
	background-color:transparent;
}
.collapsibleContainerTitle a:focus  {
	color:#000;
	text-decoration:none;
	background-color:transparent;
	 /*-moz-outline-style: none;     
    outline-style: none;
    outline-width: 0px;
    outline-color: -moz-use-text-color;*/
}
.collapsibleContainerTitle a:hover, .collapsibleContainerTitle a:active {
	color:#000;
	text-decoration:none;
	background-color:transparent;
}

.collapsibleContainerTitle div
{
    padding-top:0;
    padding-left:0;
	margin-left:0;
border:none;
}


.collapsibleContainerContent
{
    padding: .5em .5em ;
	display:none;
	background-color: #fff;
  background: rgba(255, 255, 255, .8);
font-family: 'Droid Sans', sans-serif;
border:none;
}
.TabbedPanelsTab {
		font-size:.9em;
		padding: .5em;
}
.searchhome {
	width: 50%;
	border:.1em solid #000;
}
.callbacks .caption {
  display: block;
  position: absolute;
  z-index: 2;
  font-size: 1.2em;
  text-shadow: none;
  color: #fff;
/*     background-color: #609;
  background: rgba(102, 0, 153, .8); */
  background-color: #066;
  background: rgba(102, 102, 153, .8);
  left: 0;
  right: 0;
   bottom: .5em;
  padding: .4em .5em;
  margin: 0;
  max-width: none;
  font-family: Georgia, Times, serif;
  }

 .callbacks_nav {
  display: block;
  position: absolute;
  -webkit-tap-highlight-color: rgba(0,0,0,0);
  top: 45%;
  left: 0;
  opacity: 0.7;
  z-index: 3;
  text-indent: -9999px;
  overflow: hidden;
  text-decoration: none;
  height: 100px;
  width: 75px;
  background: transparent url("arrows-circle-white.png") no-repeat left top;
  }
  .callbacks_nav.next {
  left: auto;
  background-position: right top;
  right: 0;
  }
   .callbacks_nav:active {
  opacity: 1.0;
  }

#misc {
	clear: both;
	float: left;
	margin-left: 0;
	width: 100%;
	display: block;
	margin-top:.5em;
	background-color:transparent;
	text-align: center;
	padding-bottom:.5em;
	font-family: 'Droid Sans', sans-serif;
}
#misc p, #misc ul, #misc ol, #misc address
{
  font-size: 1.05em;
  line-height: 1.6em;
}
#misc a:link, #misc a:visited, #misc a:focus {
	color: #333;
	background-color:transparent;
}
#misc a:hover, #misc a:active {
color: #609;
background-color:transparent;
}
#misc-contents {
	clear: both;
	float: none;
	display: block;
	background-color:#fff;
	text-align:left;
	width:90%;
	margin:0 auto;
	box-shadow: 0 0 .6em #999;
	padding: 1.5em 1em 0 1em;
}

#misc-contents h3 {
	text-align:center;
	font-family: 'Droid Sans', sans-serif;
	font-size: 1.2em;
	font-weight: normal;
	margin-left: 1em;
	margin-right: 1em;
	border-bottom:1px solid #006666;
	color: #000;
	background-color:transparent;
	
}

/*#misc-contents p, #misc-contents ul {
font-size: 1em;
}*/
#misc-contents .image {
float:left;
width:20%;
text-align:center;
margin-right: .5em;
}
#news {
	float:none;
	width:100%;
	margin-top:-.8em;
	display:block;
	clear:both;
	margin-bottom: 0;
}
#news .image {
float:right;
width:20%;
text-align:center;
margin-left: .5em;
}
#news p {
	text-indent: 1.5em;
}
#news-carousel h2 {
	font-size:1.2em;
	margin:.3em 0 .5em 0;
	border-bottom:none;
}
#help {
	float:none;
	width:100%;
	margin-top:-.8em;
	display:block;
	clear:both;
}
#time-machine {
	float:none;
	width:100%;
	margin-top:-.8em;
	display:block;
	clear:both;
}

#research {
	float:none;
	width:100%;
	margin-top:-.8em;
	display:block;
	clear:both;
}

#footer {
	clear: both;
	float: left;
	margin-left: 0;
	width: 100%;
	display: block;
	padding: 1em 0;
	background:transparent url(/graphics2014/bg-blue2.png) repeat;
	border-top: .1em solid #ccc;
	font-family: 'Droid Sans', sans-serif;
	font-size: .8em;
	margin-top:0;
	color:#333;
}
#footer a:link, #footer a:visited, #footer a:focus {
	color:#333;
	background-color:transparent;
}
#footer a:hover, #footer a:active {
color: #609;
background-color:transparent;
}
#footer #social {
	text-align:center;
	margin-bottom:.5em;
}
#footer #social img {
	margin-right:.5em;
}
#footer #bottom-nav {
text-align:center;
margin:1em 0;
display:block;
}
#footer #bottom-nav li {
	display: inline;
	padding: 0 .5em;
	margin: 0;
	border-right: .1em solid #000;
	list-style-type:none;
	white-space:nowrap;
}
}

/*----------------------------------------------------
Desktop Layout: 769px to a max of 1232px.  
Inherits styles from: Mobile Layout and Tablet Layout. */

@media only screen and (min-width: 769px) {

.gridContainer {
	width: 100%;
	max-width: 1232px;
	padding-left: 0;
	padding-right: 0;
	margin: auto;
}
#content {
	clear: both;
	float: left;
	margin-left: 0;
	width: 100%;
	display: block;
	 padding-bottom: .1em;
	background-color: #ffffff;
/* 	background:transparent url(/graphics2014/bg-gray.jpg) repeat; */
}
#header {
	clear: both;
	float: none;
	margin-left: 0;
	padding: 0;
	width: 100%;
	display: block;
	position:absolute;
z-index:5;
max-width: 1232px;   /* why? */
background-color:transparent;
}
#logo {
	clear: both;
	float: left;
	margin-left: 0;
/* 	width: 23.7288%; */
	width: 33.8474025%;
	display: block;
	padding: 0;
}

#header-right {
	clear: none;
	float: left;
	margin-left:0;
/* 	width: 76.2711%; */
	width: 66.1524975%
	display: block;
}

/* here's the navbar background-color */
#nav {
	font-family: 'Droid Sans', sans-serif;
	font-size: 1.3em;
	color:#fff;
	padding:.5em 0;
   /*background: rgb(0, 121, 121);
  background: rgba(0, 121, 121, .9);*/
  background-color: #006666; 
  width:100%;
  clear:none;
  display:block;
}
#nav a:link, #nav a:visited, #nav a:focus {
	color:#fff;
	text-decoration:none;
	background-color:transparent;
}
#nav a:hover, #nav a:active {
	color:#fff;
	text-decoration:underline;
}
#nav ul {
	margin:0;
	padding:0;
}

#nav li {
	display: inline;
	padding: 0 .5em;
	margin: 0;
	border-right: .1em solid #fff;
	list-style-type:none;
	white-space:nowrap;
}




#nav li:last-child, #footer #bottom-nav li:last-child  {
	border-right: none;
}
#nav .noborder, #footer #bottom-nav .noborder {
	border-right: none;
}
#searchlink {
	clear: both;
	float: left;
	margin-left: 0;
	width: 100%;
	display: block;
}
.collapsibleContainerTitle
{
 margin-left:5em;
    cursor:pointer;
width:150px;
text-align:center;
 background: rgb(255, 255, 255);
  background: rgba(255, 255, 255, .8);
  font-weight:bold;
  font-size:1.5em;
  font-family: 'Droid Sans', sans-serif;
 margin-top:0;
 padding:0;
 line-height:.9em;
 outline-style: none;
    outline-width: 0px;
border:none;
display:block;
padding-top:.2em;
}
.collapsibleContainerTitle a:link, .collapsibleContainerTitle a:visited  {
	color:#000;
	text-decoration:none;
	background-color:transparent;
}
.collapsibleContainerTitle a:focus  {
	color:#000;
	text-decoration:none;
	background-color:transparent;
	 /*-moz-outline-style: none;     
    outline-style: none;
    outline-width: 0px;
    outline-color: -moz-use-text-color;*/
}
.collapsibleContainerTitle a:hover, .collapsibleContainerTitle a:active {
	color:#000;
	text-decoration:none;
	background-color:transparent;
}

.collapsibleContainerTitle div
{
    padding-top:0;
    padding-left:0;
	margin-left:0;
border:none;
}


.collapsibleContainerContent
{
    padding: .5em 2em ;
	display:none;
	background-color: #fff;
  background: rgba(255, 255, 255, .8);
font-family: 'Droid Sans', sans-serif;
border:none;
}
.TabbedPanelsTab {
		font-size:1.1em;
		padding: .1em .5em 0 .5em;
}
.searchhome {
	width: 50%;
	border:.1em solid #000;
}


 .callbacks .caption {
  display: block;
  position: absolute;
  z-index: 2;
  font-size: 1.7em;
  text-shadow: none;
  color: #fff;
  background-color: #609;
  background: rgba(102, 0, 153, .8);
  left: 0;
  right: 0;
  bottom: 2em;
  padding: .8em 1.8em;
  margin: 0;
  max-width: none;
  font-family: Georgia, Times, serif;
  }

 .callbacks_nav {
  display: block;
  position: absolute;
  -webkit-tap-highlight-color: rgba(0,0,0,0);
  top: 45%;
  left: 0;
  opacity: 0.7;
  z-index: 3;
  text-indent: -9999px;
  overflow: hidden;
  text-decoration: none;
  height: 100px;
  width: 75px;
  background: transparent url("arrows-circle-white.png") no-repeat left top;
  }

#misc {
	clear: both;
	float: left;
	margin-left: 0;
	width: 100%;
	display: block;
	position:relative;
	margin-top:-1.5em;
	z-index: 10;
	background-color:transparent;
	text-align: center;
	padding-bottom:1.5em;
	font-family: 'Droid Sans', sans-serif;
}
#misc p, #misc ul, #misc ol, #misc address, #webform 
{
  font-size: 1.05em;
  line-height: 1.6em;
}
#misc a:link, #misc a:visited, #misc a:focus {
	color: #333;
	background-color:transparent;
}
#misc a:hover, #misc a:active {
color: #609;
background-color:transparent;
}

#misc-contents {
	clear: both;
	float: none;
	display: block;
	background-color:#fff;
	text-align:left;
	width:90%;
	margin:0 auto;
	box-shadow: 0 0 .6em #999;
	padding: 1.5em 1em 1em 1em;
}
#misc-contents h3 {
	text-align:center;
	font-family: 'Droid Sans', sans-serif;
	font-size: 1.3em;
	font-weight: normal;
	margin-left: 1em;
	margin-right: 1em;
	border-bottom:1px solid #006666;
	color:#000;
	background-color:transparent;
	
}

#misc-contents p, #misc-contents ul {
font-size: 1.1em;
margin: .4em .5em 0 .5em;
}
#misc-contents .image {
float:none;
width:100%;
text-align:center;
}
#news {
	float:none;
	width:100%;
	margin-top:-.8em;
	display:block;
	clear:both;
}

#news h3 {
	font-size:2em;
	margin-top:0;
}

#news-carousel h2 {
	font-size:2em;
	margin:0 0 .3em 0;
	border-bottom:none;
}

#news-carousel p {
	font-size:1em;
}
#news .image {
float:right;
width:20%;
text-align:center;
margin-left: .5em;
margin-top:-1em;
}
#help {
	float:left;
	width:33%;
	margin-top:-.8em;
	clear:none;
}
#time-machine {
	float:left;
	width:34%;
	margin-top:-.8em;
	clear:none;
}

#research {
	float:left;
	width:33%;
	margin-top:-.8em;
	clear:none;
}

#footer {
	clear: both;
	float: left;
	margin-left: 0;
	width: 100%;
	display: block;
	padding: 1em 0;
	background-color: #ffffff;
	/* background:transparent url(/graphics2014/bg-blue.png) repeat; */
	border-top: .1em solid #ccc;
	font-family: 'Droid Sans', sans-serif;
	font-size: .8em;
	margin-top:0;
	color:#333;
}
#footer a:link, #footer a:visited, #footer a:focus {
	color:#333;
}
#footer a:hover, #footer a:active {
color: #609;
}
#footer #social {
	text-align:center;
	margin-bottom:.5em;
}
#footer #social img {
	margin-right:.5em;
}
#footer #bottom-nav {
text-align:center;
margin:1em 0;
display:block;
}
#footer #bottom-nav li {
	display: inline;
	padding: 0 .5em;
	margin: 0;
	border-right: .1em solid #000;
	list-style-type:none;
	white-space:nowrap;
}
}