@import url("/styles/print.css");

/**
 * Styles global to Webb Telescope go in here.
 */

/**
 * Webb Telescope Colors
 *
 * Color 1:  #611111
 * Color 2:  #E4E0D7
 * Color 3:  #A6A09A
 * Color 4:  #995765
 * Color 5:  #2C1625
 * Color 6:  #947879
 * Color 7:  #29181C
 * Color 8:  #938C84
 * Color 9:  #F8F3F3
 * Color 10: #D9D3CC
 */

/* Global Styles */

body {
	background: url('graphics/background_webb.gif');
}

div#container {
  width: 968px
}

div#subpage-content p {
  margin-bottom: 15px
}

div.subpage-left-internal-column, div.subpage-right-internal-column {
  margin-top: 4px;
}

div.subpage-left-internal-column { width: 215px }
div.subpage-right-internal-column { margin-left: 10px }

div.menu-box li a, div#intro-text, div.nav-box span.p, a.nav-box span.p {
  /* Spec: 2nd Color */
  color: #E4E0D7;
}

div#intro-text {
  margin-left: 0;
	padding-top: 0;
	width: 410px;
	position: absolute;
}

/* The following style combines the global.css->intro-text and
 * this sheet's intro-text to create a completly unique style.
 * Reason: IE6/7 completely ignores any of the overrides of
 * intro-text in this sheet. No reasons for this behavior
 * have been uncovered as of 20090917.
 * If a solution is found, revert any elements with this ID
 * back to the ID intro-text.
 */
#WebIntroText {
	position: absolute;
	width: 410px;
	height: 53px;
	min-height: 53px;
	margin-left: 0;
	padding-top: 0;
	color: white;
}

div#subpage-content p, div#intro-text, #WebIntroText {
	line-height: 140%
}

a {
  text-decoration: none
}

a, span.link {
  /* Spec: 5th Color */
  color: #2C1625;
}

img.link {
  border-color: #2C1625
}

div.inset {
  /* Spec: Color 8 */
  background: #938C84
}

.nav-box-padding {
  /* Spec: 1st Color */
	border: solid #553139 1px;

	background-color: #241317
}

.nav-box-padding span.h1 {
  background-color: #66484A
}

h1#page-title { display: none }

.nav-box-padding span.h2 {
  /* Spec: Color 4 */
  color: #995765
}

.icon {
  /* Spec: Color 1 */
  border: solid #553139 1px ! important
}

div#search-section-bar, div#container-padding {
	background-image: url(graphics/home_title.png);
}

/* Primary Container and Its Contents */

div#container {
  /* Spec: 5th Color */
 	border-left: solid #2C1625 1px;
	border-right:  solid #2C1625 1px;
	border-bottom: solid #2C1625 1px;
}

.box-image {
  /* Spec: 1st Color */
  border-color: #553139
}

.nav-box-padding a {
  color: #CC6600;
}

.content-box-padding {
  /* Spec: 3rd Color */
	background-color: #A6A09A;
	/* Spec: 1st Color */
	border:     solid #553139 1px;

  /*background-image: url('graphics/webb_grad4.jpg');*/
}

.content-box span.h1 {
  /* Spec: 1st Color */
	background-color: #611111;

  /*background-image: url('graphics/webb_grad1.jpg');*/
}

.content-box span.h1 strong {
  text-transform: uppercase
}

.content-box span.h2 {
  /* Spec: 4th Color */
	background-color: #947879;
	/* Spec: 5th Color */
	color:      #2C1625;

  /*background-image: url('graphics/webb_grad2.jpg');*/
}

div.subpage-body {
  overflow: hidden
}

div.subpage-body, div.subpage-body-no-padding {
  background-color: #E8E5DF;
	background-repeat: repeat-x;
	background-position: top left;
}

div#subpage-content div.subpage-body.for-content-boxes {
  padding-right: 0;
	padding-bottom: 0;
}

div.subpage-body div.content-box {
  margin: 0;
	float: left;
	display: inline;
	margin-bottom: 10px
}

div.subpage-body div.content-box img {
  float: right;
	display: inline;
}

div#subpage-content div.content-box a {
  text-decoration: none
}

div#subpage-content div.content-box p {
  line-height: inherit
}

div.content-box.no-paragraph-padding p {
  padding: 0
}

/* Subpage Styles */

div#subpage-content-container {
  background-color: #E8E5DF;
}

form#search-hubblesite {
  /* Spec: Color 3 */
	color: #A6A09A
}

div#subpage-content a {
  /* Spec: Color 1 */
  color: #553139;
}

div#subpage-content a:visited {
	/* Spec: Color 6 */
  color: #CCCCCCS
}

div#subpage-content h1 {
	/* Spec: Color 1 */
	background-color: #553139;
}

div#subpage-content h3 {
	/* Spec: Color 2 */
	background-image: url('graphics/webb_h2_background.gif');
}

div#subpage-content h3 span {
  /* Spec: Color 1 */
  color: #553139;

  /* Spec: Color 2 */
  background: #E8E5DF;
}

div#subpage-content h4 {
  margin: 15px 0 5px;
}

div#subpage-content-body div.subpage-right-inset {
  background-color: #F8F3F3;
}

/* Images with Captions */
/* All of these need to be refactored into global.css */

.img-wrapper-caption {
	border-color: #611111;
}

div#subpage-content a.img-wrapper-caption:hover {
  border-color: #00b2b3
}

.img-wrapper-caption {
  background-color: #995F5F;
}

div#subpage-content .img-wrapper-caption span.p {
  color: white;
	overflow: hidden
}

a.back-to-top {
  background-image: url(graphics/webb_up_arrow.gif);
  margin-top: 13px;
}

a.return-arrow {
  background-image: url(graphics/webb_back_arrow.gif);
}

div#subpage-content a.return-arrow:visited {
  color: #2C1625
}

a.return-arrow-separator {
  border-right-color: #66484a;
}

/* Special classes */

.left-clearing {
  clear: left
}

div#subpage-content .learn-more-box {
	background-color: #BD8F8F;
	height: 80px;
	width: 113px;
  padding-left: 85px;
	margin-bottom: 10px;
  display: block;
  text-decoration: none;
	overflow: hidden
}

div#subpage-content .learn-more-box:hover {
  border-color: #00B2B3
}

.learn-more-box img {
  position: absolute;
  margin-left: -85px;
  border: 0;
}

.learn-more-box strong, .learn-more-box span {
  display: block;
	float: none !important
}

.learn-more-box strong {
  margin-top: 20px;
  font-size: 13px;
  color: white;
  text-transform: uppercase;
  text-decoration: none;
}

.photo-box, .graphical-box {
	color: #E3E0CE;
	background-color: #807B56;
	border: thin solid #381114;
	margin-bottom: 10px;
}

.graphical-box strong, .photo-box strong {
	background-color: #4f4d35;
	display: block;
	color: #FFFFFF;
	padding-left: 3px;
}

div#subpage-content .img-wrapper-caption span.link {
	color: #d6d2b4;
  display: inline;
  white-space: nowrap;
	text-align: left;
	float: none
}

div#subpage-content .img-wrapper-caption span.p.link {
	display: inherit;
}

div#subpage-content .img-wrapper-caption img {
  margin-bottom: 0
}

div.image-title-holder {
  margin-bottom: 10px;
}

#imageData {
  overflow: hidden;
}

#imageDetails {
  margin-bottom: 10px;
}

#imageData span#caption {
  font-weight: normal
}

#imageData span#caption span.title {
  font-weight: bold;
	display: block
}

div#top-area {
  height: 175px;
}

div#top-area h1#page-title {
  display: none
}

.subpage-left-internal-column.opaque-margin,
.subpage-right-internal-column.opaque-margin {
  background-color: #E8E5DF;
	padding-left: 10px;
	margin-left: 0;
}

div.text-sidebar-box {
  padding-top: 2px;
  padding-bottom: 15px;
  background-color: #381114;
	margin-top: 4px
}

div.text-sidebar-box div {
  background-color: #c1c5de;
  padding: 20px;
	padding-bottom: 0;
	overflow: hidden
}

div.text-sidebar-box strong {
  color: white;
	text-transform: uppercase;
	font-weight: bold;
	margin-left: 20px
}


/* New Menu Stuff */

div#hubblesite-menu-box {
  background-color: #29181C;
}

ul.level-1 li a {
  background-image: url(graphics/webb_side_nav_menu_header.gif);
}

ul.level-1 li.active.final a {
  background-image: url(graphics/webb_side_nav_menu_header_active.gif);
}

ul.level-1 li a:hover {
  background-image: url(graphics/webb_side_nav_menu_header_hover.gif) !important;
}

ul.level-1 ul.level-2 li a {
  color: #E4E0D7;
}

ul.level-1 ul.level-2 li {
  border-bottom-color: #995765
}

ul.level-1 ul.level-2 ul.level-3 li {
  background-color: #E4E0D7
}

ul.level-1 li.final ul.level-2 a,
ul.level-2 li a {
  background-image: url(graphics/webb_side_nav_menu_item.gif);
}

ul.level-2 li.active {
  background-color: #995765
}

ul.level-1 ul.level-2 li.active a {
  background-image: url(graphics/webb_side_nav_menu_item_active.gif);
}

ul.level-1 ul.level-2 li.active ul.level-3 li.active.final a {
  background-image: url(graphics/webb_side_nav_menu_item_active.gif);
}

ul.level-1 ul.level-2 ul.level-3 li.active.final a {
  color: #553139;
}

ul.level-1 ul.level-2 ul.level-3 li.active.final ul.level-4 li.inactive a {
  color: inherit
}

div.subpage div#nav-box-container, div#nav-box-container {
  margin-top: 80px
}

div#subpage-content {
	margin-top:0;
	padding-top:80px;
}

/** SHAREBOX **/

a#share_link { background-image: url(/shared/share-icon_webb.png); }
a#embed_link { background-image: url(/shared/embed-icon_webb.png); }
#sharebox, #embedbox {
  border-color: #995F5F;
}
#shareclosebox, #embedclosebox {
  background-color: #995F5F;
}

a#share_link, a#embed_link { color: #D1D184; }

#sharesend { background: #995F5F; }

@media print {
  div#subpage-content,
  div#subpage-content div {
    display: inline !important;
    position: static !important;
    margin: 0 !important;
    padding: 0 !important;
  }

  #rotating-image-holder * { display: none !important }
}