@charset "utf-8";
/* CSS Document */
#container {
	background-color: #FFFFFF;
}
label {
	font-weight:bold;
}
/* The select div has a top margin of 15 pixels and a left one of 5 pixels
   to position the drop-down menu and its label away from the header image
   and left side of the wrapper div.
*/
#select {
	margin: 15px 0 0 5px;
}
/* The thumbs div has a 20-pixel margin on each side except the right. It
   also has a 4-pixel grooved border, making its overall width 228 pixels.
   It's floated left so that it can sit alongside the mainPic div.
*/
#thumbs {
	margin: 20px 0 20px 0px;
	float: left;
	width: 240px;
	border: 4px groove #F9F2F8;
}
/* The images inside the thumbs div have both padding and margin. The
   padding allows you to add a Spry highlight effect when the thumbnails
   are moused over (see Chapter 2 for an explanation). The thumbnails are
   80 pixels wide, so the overall width of each one comes to 96 pixels.
   In theory, you should be able to use 100 pixels for each thumbnail,
   but this creates problems with the accessible gallery case study in
   Chapter 20. For the Spry gallery in Chapter 10, increasing the margin
   to 6px gives the best appearance. Experiment to find the most pleasing
   layout.
*/
#thumbs img {
	margin: 5px;
	padding: 3px;
	cursor: pointer;
	border: none;
}
/* The mainPic div is floated left so that it comes up alongside the
   thumbs div. Its width is set to 492px to fill the remaining horizontal
   space in wrapper div (228 + 492 = 720).
*/
#mainPic {
	float: left;
	width: 492px;
	margin: 0;
}
/* The main image and its caption are in a center-aligned paragraph to
   position them within the mainPic div. The line-height property is
   set to 2 to give extra breathing space for the caption beneath the
   main image.
*/
#mainPic p {
	text-align: center;
	font-weight: bold;
	line-height: 2;
}
/* The description div uses the clear property to ensure there's no overlap
   with either of the floated divs above. Using auto for the left and right
   margins centers the div within the wrapper.
*/
#description {
	clear: left;
	width: 600px;
	margin: 0 auto;
	font-size:85%;
}
.oneColFixCtrHdr #mainContent {
}
#thumbs h5 {
	padding-left: 10px;
}
.oneColFixCtrHdr #container #mainContent a {
	font-weight: bold;
	color: #1820AD;
	text-decoration: none;
}
.oneColFixCtrHdr #container #mainContent a:hover {
	text-decoration: underline;
}
#main h3 {
	text-align: center;
	padding-top: 15px;
}
#flash {
	text-align: center;
	margin-top: 25px;
	margin-bottom: 250px;
}