/* CSS Document */

/* TODO: 
	When printing, left margin is increased for each page, so text moves farther and farther to the right.
	Big sections of some pages do not print (see seaKayaking.htm and whiteWaterRafting.htm).
	Perhaps include a link for printable version that uses same content but alternate CSS?
	Mozilla:
		Float bug causing image to overlap text when there are multiple images floated on same side.
	IE:
		If floated images are too close to each other then there is white space in text.
		Image borders have special exemption - would prefer if they were the same
*/
body {
	font-size: 10pt; 
}

/*************************** PAGE STRUCTURE *********************************/
/* This makes the page centered */
#everythingAndFooter {
	width: auto; 
	page-break-inside: auto;
	background-image: none;
	padding-top: 0pt;
}

/* The whole page, excluding curve at top and bottom of page */
#page {
	page-break-inside: auto;
}

/* Serendipity name and navigation */
#masthead {
	width: 100%;
	padding-left: 0px;
	z-index: 1;
}

/* Remove bullets from nav bar lists */
#masthead ul {
	display: none;
}

/* unique page content */
#content {
	float: none;
	margin: 0px 5px 0px -157px; /* TODO: IE6 seems to be ignoring this and applying the large margin specified in topNav.css instead */
	page-break-inside: auto;
}

#clientComment {
	background-image: none;
	width: 100%;
	float: none;
	border: none;
	/* border, margin and padding? */
}

/* This is the footer that appears after the end of the white section of the page.
   It contains the link to the site map, the copyright, and another link to contact Serendipity */
#footer {
	width: 100%;
	float: none;
}

#footerContent {
	font-size: 8pt;
}

/******************************** END PAGE STRUCTURE *****************************/

/********************************** CONTENT FORMATTING ***************************/
#content p {
	float: none;
}

#content blockquote {
}

#content a {
	text-decoration: none;
}

#content li {
	list-style-position: inside; /* This makes the margins apply to the bullet, not just the text so left margin works */
}

/* This should be the page header */
h1 {
	font-size: 14pt;
	float: none;
}

/* This should be used for sub headers within the page */
h2 {
	font-size: 11pt;
	float: none;
}

/* The smaller headers probably won't be used much */
h3 {
	font-size: 11pt;
	float: none;
	font-variant: normal; /* Small caps look really bad in IE6 print preview */
}

/* Classes for images in page content */
.imgRight, .rightMarginImage, .imgLeft {
	page-break-inside: avoid;
}

/* Images on the left sit to the left of the text margin */
.imgLeft {
	margin: 0px 5px 5px 0px;
	left: auto;
}

/* Give IE it's own border width, because otherwise it looks too big \*/ 
* html .imgRight, * html .imgLeft, * html .rightMarginImage {
	border-width: 2px; /* TODO: Set border width in ems? */
}
/* End hide from Mozilla */

/* Captions */
.imgLeft p, .imgRight p, .caption {
	font-size: 8pt;
	text-align: center;
	width: 100px; /* TODO: how do we get captions to be the right width on the print out? Or do we just not print the captions? */
}

/* On all sample itinerary pages, a blurb is shown identifying it as an example */
/* TODO: IE is overlaying the logo with the blurb*/
.sampleItineraryBlurb {
	width: 100%;
}

.sampleItineraryBlurb p {
	margin: 0px 0px;
}

div.activity, div.magazine {
	page-break-inside: avoid;
}

ul.horizontal li {
	margin: 0em 3px 1em 0em;
}

ul.specialties li img {
	margin: 0em 0.25em;
}
ul.specialties a {
	color: #000066;
}

/* Formatting of links around images for specialties and activity layouts (see above). */
div.activity a img, ul.specialties a img, div.activity a:link img, ul.specialties a:link img, 
div.activity a:active img, ul.specialties a:active img, div.activity a:hover img, 
ul.specialties a:hover img, div.activity a:visited img, ul.specialties a:visited img {
	border-width: 2px;   
	border-style: solid;
	border-color: white; /* This is white so it is not visible */
	display: block;
}

/* Footnote */
.note {
	font-size: 8pt;
}


/* The client's comment */
#clientCommentContent .quote {
	font-size: 10pt;
}

/* The client's name and address */
#clientCommentContent .CommentNames {
	font-size: 9pt;
}

/* The actual content of the comment sits within this inner div so 
   that an image of a quote sign can appear with the comments and 
   line up properly */
#clientCommentContent {
	margin: 5px; /* TODO: Does this need adjusting */
	background-image: none;
	border: none;
}

#clientCommentContent p {
	margin: 0px;
}

.activityNavigation p {
	display: none;
}

table.itineraryPrices thead.years {
	text-align: center;
	border-bottom: thin solid black;
	font-weight: bold;
}

table.itineraryPrices thead.headers {
	border-bottom: thin solid black;
	text-align: left;
	font-weight: bold;
}

table.itineraryPrices td {
	padding: 0px 5px;
}

td.PriceInfo{
	text-align: right;
}
/************************************ END CONTENT FORMAT ********************/

.noPrint {
	display: none;
}

.printedBorder {
	border: solid black 1px;
}

/* Print URLs after the links on printed page */
/*a[href]:after {
   content: " (" attr(href) ") ";
   font-size: 90%;
}*/
/* For some reason Firefox compresses the space around links for printing.  Fortunately, 
only Firefox will apply before and after, though this still doesn't solve the problem. 
a:before {
	content: "  ";
}*/
#footer:after {
   content: "http://www.serendipityadventures.com";
   font-size: 8pt;
}