/*---------------------------------------*\

             SCOTT ARBORETUM
  photo gallery CSS for on-screen display
  ---------------------------------------
           Lucas Sanders (2006)

\*---------------------------------------*/




/*---------------------------------*\
     SUBNAV & CONTENT BACKGROUNDS
\*---------------------------------*/

#gardentour #subnav,     #gardenmap #subnav     {  background: #c3d4a6 url("../../subheadgfx/garden-tour.png")     no-repeat 160px 100%;  }
#collectiontour #subnav, #collectionmap #subnav {  background: #c3d4a6 url("../../subheadgfx/collection-tour.png") no-repeat 160px 100%;  }
#seasongallery #subnav     {  background: #c3d4a6 url("../../subheadgfx/seasonal-gallery.png")  no-repeat 158px 100%;  }
#seasongallery #content h3 {  background: #e6e5cf url("../../subheadgfx/seasonal-gallery2.png") no-repeat  -1px   0;   }
#seasongallerymenu #subnav {  background: #c3d4a6 url("../../subheadgfx/seasongallery.png")     no-repeat 159px 100%;  }

#gardentour #content, #collectiontour #content {  background: #e6e5cf url("bkgd-map.png") no-repeat 0 0;  }
#seasongallery #content.winter {  background: #e6e5cf url("bkgd-winter.png") no-repeat 0 0;   }
#seasongallery #content.spring {  background: #e6e5cf url("bkgd-spring.png") no-repeat 0 5px;   }
#seasongallery #content.summer {  background: #e6e5cf url("bkgd-summer.png") no-repeat 0 8px;   }
#seasongallery #content.autumn {  background: #e6e5cf url("bkgd-autumn.png") no-repeat 0 0;   }



/*---------------------------------*\
         SUBHEADING LINK BAR
\*---------------------------------*/

#featuredimage {
	display: none;
}

#subnav {
	background: #c3d4a6;
	margin: 4px 0 0 0;
	height: 2.5em;
}

#special #subnav h2 {
	left: 160px;
}

/*	When loading the page, our script finds the vertical location of #subnav h2 and
    expands #subnav to extend to that point, hence the otherwise nonsensical positioning effort.  */
#seasongallery #subnav h2, #seasongallerymenu #subnav h2,
#gardentour #subnav h2, #gardenmap #subnav h2,
#collectiontour #subnav h2, #collectionmap #subnav h2 {
	top: 357px;
	height: 0;
	width: 1px;
	text-indent: -1000px;
	margin: 0;
}

#subnav li {
	display: inline;
	float: right;
	margin: 0;
	position: relative;
	top: 50%;
}

#seasongallery #subnav li, #seasongallerymenu #subnav li {
	top: 0;
	height: 38px;
}

#seasongallery #subnav li a, #seasongallerymenu #subnav li a {
	position: absolute;
	top: 0;
	background: transparent no-repeat 50% 50%;
	text-indent: -10000px;
	width: 38px;
	height: 38px;
	margin: 0;
	padding: 0;
	border-radius: 9px;  -moz-border-radius: 9px;  -webkit-border-radius: 9px;
}

#seasongallery #subnav li a#winter, #seasongallerymenu #subnav li a#winter {  background-image: url("nav-winter.png");  right: 130px;  }
#seasongallery #subnav li a#spring, #seasongallerymenu #subnav li a#spring {  background-image: url("nav-spring.png");  right:  90px;  }
#seasongallery #subnav li a#summer, #seasongallerymenu #subnav li a#summer {  background-image: url("nav-summer.png");  right:  50px;  }
#seasongallery #subnav li a#autumn, #seasongallerymenu #subnav li a#autumn {  background-image: url("nav-autumn.png");  right:  10px;  }

#seasongallery #subnav li a:hover, #seasongallery #subnav li a:focus,
#seasongallerymenu #subnav li a:hover, #seasongallerymenu #subnav li a:focus {
	outline: 0;
	background-color: #ddebd1;
}

#subnav a {
	color: #48562e;
	display: block;
	float: left;
	margin: 0 8px;
	padding: 4px;
}

#subnav a:hover, #subnav a:focus {
	background-color: #d4dec3;
	color: #00436e;
	text-decoration: none;
	outline: #b2c78e solid 2px;
}


#subnav a#subnavMapLink.inactive {
	background: transparent;
	outline: 0;
	color: #48562e;
	cursor: default;
}



/*---------------------------------*\
      CAMPUS MAP FOR NAVIGATION
\*---------------------------------*/

#map {
	display: block;
	width: 700px;
	margin: 0;
	padding: 0;
	overflow: hidden;
}

#gardentour #map, #collectiontour #map,
#gardentour #map.hidden, #collectiontour #map.hidden {
/*	When loading the page, our script measures the height of (#map and its borders)
    to find out the expanded size of #map.  Therefore, we don't want no stinking borders.
	This also prevents the use of display:none, so we use position:absolute and top:wayTooHigh instead.  */
	position: absolute;
	top: -1000px;
	border: 0;
}

#gardentour #map.moving, #collectiontour #map.moving,
#gardentour #map.visible, #collectiontour #map.visible {
	top: 357px;
	left: -1px;
	border: 1px solid #00436e;
	border-top: 2px solid #00436e;
	border-bottom: 5px solid #000;
}

#gardenmap #subnav, #collectionmap #subnav {
	border-bottom: 3px solid #e6e5cf;
}

#gardenmap #map, #collectionmap #map {
	position: relative;
	top: 0;
	left: 0;
	padding: 0;
	border: 0;
	background: #e6e5cf;
}


#map h2 {
	background: url("campus-map.jpg") no-repeat 0 0;
	height: 366px;
	width: 700px;
	margin: 0;
	padding: 0;
	text-indent: -10000px;
	font-size: 1px;
}


#gardentour #map p, #collectiontour #map p {
	margin: 0;
	padding: .25em 2em;
	line-height: 1.5em;
	background: #00436e;
	color: #fff;
	font-weight: bold;
}

#gardenmap #map p, #collectionmap #map p {
	margin: 0;
	padding: .25em 2em;
	line-height: 1.5em;
	color: #00436e;
}

#map p img {
	vertical-align: middle;
}

#map li {
	display: block;
	height: 0;
	margin: 0;
	padding: 0;
}

#gardenmap #map.hidden li, #collectionmap #map.hidden li,
#gardenmap #map.moving li, #collectionmap #map.moving li {
	display: none;
}

#map li a {
	position: absolute;
	height: 24px;
	width: 24px;
	text-indent: -10000px;
	background: transparent url("location-marker.png") no-repeat 0 6px;
	top: -10000px;
	display: none;  /* anchors without positions aren't shown */
	overflow: hidden;  /* really long labels are truncated */
}

#map li a.leftPositioned {
	display: block;
	background-position: 0 6px;
}

#map li a.rightPositioned {
	display: block;
	background-position: 100% 6px;
}

#map li a:hover, #map li a:focus {
	background-color: #00436e;
	text-indent: 0;
	text-decoration: none;
	color: #fff;
	width: auto;
	height: auto;
	line-height: 1em;
	padding: 4px 2em;
	z-index: 2;
}

#map li a.leftPositioned:hover, #map li a.leftPositioned:focus {
	border-radius: 3px;               -moz-border-radius: 3px;              -webkit-border-radius: 3px;
	border-top-right-radius: 12px;    -moz-border-radius-topright: 12px;    -webkit-border-top-right-radius: 12px;
	border-bottom-right-radius: 12px; -moz-border-radius-bottomright: 12px; -webkit-border-bottom-right-radius: 12px;
}

#map li a.rightPositioned:hover, #map li a.rightPositioned:focus {
	border-radius: 12px;              -moz-border-radius: 12px;             -webkit-border-radius: 12px;
	border-top-right-radius: 3px;     -moz-border-radius-topright: 3px;     -webkit-border-top-right-radius: 3px;
	border-bottom-right-radius: 3px;  -moz-border-radius-bottomright: 3px;  -webkit-border-bottom-right-radius: 3px;
}

#collectionmap #map_image, #gardenmap #map_image {
	display: none;
}



/*---------------------------------*\
      CONTENT TEXT BLOCK (std)
\*---------------------------------*/

#content {
	margin: 0;
	padding: 0 0 2em 0;
	position: relative;
	height: 100%;  /* box height for IE/Win */
}

#content:after {
	content: '';
	display: block;
	height: 1px;
	clear: both;
}

#content h3 {
	clear: both;
	margin: 0 50px 0 160px;
	padding: 1em 0 .25em 0;
}

#content p {
	clear: both;
	margin: 0 50px 0 160px;
	padding: 0 0 1em 0;
	min-height: 35px;
}

#content ul {
	margin: .5em 2.5em;
	padding: 0;
}

#content a, #content a:hover, #content a:focus {
	border-bottom: 1px solid;
	text-decoration: none;
}



/*---------------------------------*\
           MENU IMAGE LIST
\*---------------------------------*/

#seasongallerymenu #seasonmenu {
	margin: 0;
	padding: 0;
}

#seasongallerymenu #seasonmenu li {
	display: inline;
	margin: 0;
	padding: 0;
}

#seasongallerymenu #seasonmenu li img {
	margin: 0;
	padding: 0;
	border-top:  1px solid #00436e;
	border-left: 1px solid #00436e;
	float: left;  /* for Safari, since it doesn't realize that all the images can fit in one row otherwise */
}

#seasongallerymenu #footer {
	clear: both;
}



/*---------------------------------*\
    BACK/FORWARD NAVIGATION LINKS
\*---------------------------------*/

#prevpagelink,  #nextpagelink,
#prevphotolink, #nextphotolink {
	display: block;
	margin: 0;
	padding: 0;
	position: absolute;
	background: no-repeat 0 0;
	text-decoration: none;
	text-indent: -10000px;
	cursor: pointer;
}

#content #prevpagelink, #content #nextpagelink {
	top: 10px;
	width: 70px;
	height: 70px;
	border: 0;
}
#prevpagelink  {  left: 10px;  background: transparent url("arrow-left-map.png")  no-repeat 100% 0;  }
#nextpagelink  {  left: 80px;  background: transparent url("arrow-right-map.png") no-repeat   0  0;  }
#prevpagelink:hover, #prevpagelink:focus  {  background-position: 100% -70px;  }
#nextpagelink:hover, #nextpagelink:focus  {  background-position:   0  -70px;  }

#prevphotolink, #nextphotolink {
	top: 39px;
	width: 47px;
	height: 52px;
	opacity: 0.6;
}
#prevphotolink:hover, #prevphotolink:focus,
#nextphotolink:hover, #nextphotolink:focus {
	opacity: 1.0;
}
#prevphotolink {  left: 25px;  background-image: url("arrow-left.png");   }
#nextphotolink {  left: 88px;  background-image: url("arrow-right.png");  }



/*---------------------------------*\
   PHOTO GROUPS (seasonal gallery)
\*---------------------------------*/

ul#photogroups {
	display: block;
	list-style: none;
	margin: 0;
	padding: 0;
}

#photogroups li {
	/* hide me! */
	position: absolute;
	top: -5000px;
	display: block;
	margin: 0;
	padding: 0;
}

#photogroups li.visible {
	position: static;
}

div#photogroup {
	margin: 0;
	padding: 0;
}

#content #photogroups li img, #content #photogroup img {
	float: left;
	margin: 3px;
	padding: 0;
}

#photogroups li img.clear, #photogroup img.clear {
	clear: both;
}

#content #photogroups li img.imageNotQuiteSoLeft, #content #photogroup img.imageNotQuiteSoLeft {
	margin-left: 160px;
	clear: both;
}

#content #photogroups li img.imageLeft, #content #photogroup img.imageLeft {
	float: left;
	margin: 3px;
	padding: 0;
}

#content #photogroups li img.imageRight, #content #photogroup img.imageRight {
	float: right;
	margin: 3px;
	padding: 0;
	clear: both;
}