/*Version 1.0 -- Boston-Discovery-Guide - April 12, 2010 */

/* ------ Section 1 - Global Body, Font and Link Settings ------ */

body {
background-color: #96ceff; /* blue - color for browser window background color and footer top border */
margin: 0 0 15px 0;
padding: 0;
font-family: 'Lucida Sans Unicode', 'Lucida Grande', Verdana, Arial, sans-serif;
color: #333;
font-size: 80%;  /* 88% */
line-height: 150%;  /*  added  */
}

h1, h2, h3, h4, h5, h6, h7 {
background-color: transparent;
color: #e42217;  /* red - color for H1 and H2 */
clear: both;
}

h2, h3, h4, h5 {
margin-top: 24px;
}

h1 {
margin-top: 5px;
font-family: Georgia, 'Times New Roman', 'Palatino Linotype', Palatino, serif;
border-bottom: 0px solid #8bb5dd;  /* no horizontal line */
text-align: center;
margin-top: 30px;
}

h2 {
font-family: Georgia, 'Times New Roman', 'Palatino Linotype', Palatino, serif;
border-bottom: 0px solid #5a5f63;  /* no line  */
text-align: center;
line-height: 200%;  /*  added  */
}

h3 {          /* red - use for subheadings - has space above - left-aligned */
font-family: 'Lucida Sans Unicode', 'Lucida Grande', Verdana, Arial, sans-serif;
border-bottom: 0 solid #e42217;
text-align: left;
color: #e42217;  /* red */
}

h4 {
	font-family: 'Lucida Sans Unicode', 'Lucida Grande', Verdana, Arial, sans-serif;
	color: #333;  /* dark gray - use for subheadings when d gray is wanted - left-aligned */
	text-align: left;
	font-size: 115%;
	margin-top: 10px;
}

h5 {
	font-family: Georgia, 'Times New Roman', 'Palatino Linotype', Palatino, serif;
	color: #333;  /* dark gray - use for first paragraph text */
	text-align: left;
	font-size: 110%;
	margin-top: 10px;
}

h6 {
	font-family: 'Lucida Sans Unicode', 'Lucida Grande', Verdana, Arial, sans-serif;
	color: #e42217;  /* centered red - less space above - use for boxes */
	text-align: center;
	font-size: 130%;
	margin-top: 15px;
	margin-bottom: 10px;
}

h7 {
	font-family: 'Lucida Sans Unicode', 'Lucida Grande', Verdana, Arial, sans-serif;
	color: #e42217;  /* centered red - less space above and below - use for right column headers */
	text-align: center;
	font-size: 120%;
	margin-top: 15px;
	margin-bottom: 5px;
}

blockquote {
margin: 12px 56px;
color: #006;
font-size: 100%;
line-height: 20px;
font-family: 'Courier New', Courier, monospace;
}

code {
color: #333;
}

img {
border: 0px solid #ffd184;   /*  orange - 5 shades paler than background */
padding: 0px;
background-color: #fff;   /*  white */
margin: 15px 0 5px 0 
}

.border {
border: 0px solid #c9c9db;   /*  none */
padding: 5px;
background-color: #c9c9db;   /*  none */
margin: 0 
}

a:link img {
border: 0px solid #ffe8c1;
padding: 0px;
background-color: #fff;
}


/* -- General Link Styling -- */

a:link {
color: #0033cc;            /* changed same blue as H2   -- */
text-decoration: underline;    
}

a:visited {
color: #0033cc;				/* darker blue (darker than H1) */
text-decoration: underline;     
}

a:hover {
color: #e42217;  /* red - H1 */
background-color: #f5f5f5;   /* gray */
text-decoration: underline;
}


ul
{
list-style-type: square;
}

li
{
margin-bottom: 6px;
}




/* ------ Section 2 - Global Page Structure ------- */

#PageWrapper {
width: 960px;
border: 3px solid #6ca0de;   /* dark sea blue, headlines and borders */   
}

#Header {
position: relative;
height: 207px;
}

#ContentWrapper {
float: left;
width: 100%;
}

#ContentColumn {
margin: 0 190px 0 190px;    /* STEP 1: set to "0 ExtraColumnWidth 0 NavColumnWidth" */
}

#NavColumn {
float: left;
width: 189px;               /* STEP 2: to set left column at 180, set 1 less than 180 here */
margin-left: -960px;        /* STEP 3: set to the same width specified in #PageWrapper above (but with minus sign)  */
}

#ExtraColumn {
float: left;
width: 189px;               /* STEP 4: to set right columns at 180, set 1 less than 180 here */
margin-left: -190px;        /* STEP 5: set to -(ExtraColumnWidth) */
}

#Footer {
clear: both;
width: 100%;
padding: 8px 0;    
border-top: 0px solid #0066cc;  /* xxx */
}

.Liner {
padding: 10px;

}

#Header .Liner {
padding: 0;
}

#ContentColumn .Liner {
padding: 20px;
}

#ExtraColumn .Liner {
padding: 5px;
}

#Footer .Liner {
margin: 0;
padding: 0;
}



/* ------ Section 3 - Page Structure Details ------ */

#PageWrapper {         
margin: -10px auto 24px auto;          /* changed from 24px to -10px leave small space between top edge of header and top edge of page  */
background-image: url(../image-files/background.gif); /* any change to this needs to be made also to ContentWrapper  */
background-repeat: repeat-y;
}

#Header {
	background-image: url(../image-files/boston-tourism-4.jpg);
	background-repeat: no-repeat;
	background-color: transparent;
	background-position: top left;
}

#ContentWrapper {
background-image: url(../image-files/background.gif);  /* same image as for PageWrapper - otherwise background shows as page loads   */
background-repeat: repeat-y;
background-color: transparent;
}

#NavColumn {
background-image: url();   
background-repeat: repeat-y;
background-color: transparent;
}

#ContentColumn {
background-image: url();
background-repeat: no-repeat;
background-color: transparent;
border-left: 2px solid #e4e3e3;
border-right: 2px solid #e4e3e3;
}

#ExtraColumn {
background-image: url();
background-repeat: no-repeat;
background-color: transparent;
}

#Footer {
background-image: url();
background-repeat: no-repeat;
background-color: #6ca0de;     /* darker blue - same as border */
text-align: center;
font-size: 85%;        /* was 85% */
}

#NavColumn {
font-size: 90%;      /* was 90% */
color: #333;
}

#ExtraColumn {
font-size: 90%;     /* was 90% */
}

#NavColumn h4 {
font-size: 90%;      /* was 90% */
color: #333;
margin-top: 0;
}

#ExtraColumn h4 {
font-size: 90%;
color: #333;
text-align: center;    
margin-top: 0;
}


/* ------ Section 4 - Left Column Navigation ------ */

.Navigation {         
width: 100%;					/* watch for overflow in IE 6 - solution: changed to fixed width */
font-family: 'Lucida Sans Unicode', 'Lucida Grande', Verdana, Arial, sans-serif;
background-color: transparent;
}

/* -- Nav Headers -- */

.Navigation h3 {
padding: 6px;
font-size: 120%;
color: #737373;  /*  medium gray  */
text-align: center;
background-color: #fff;   /* in SSR is pale orange - also used for image borders */
border-bottom: 0px solid #ffe8c1;
margin: 12px 0;
}

/* -- Nav List -- */

.Navigation ul {
list-style-type: none;
padding: 0 0 8px 5px;
margin: -6px 0 0 0px;
}

.Navigation li {
background-color: none;        /*  none -- */
border: 0px solid #8f8fb3;     /*  none -- */
margin-bottom: 0px;            /* originally 3px*/
}

/* -- Navigation Link styles -- */

.Navigation a:link {
color: #0033cc;                  /* similar to water in the header image  */
display: block;                /*  this makes the whole box highlight rather than just the text */
padding: 3px 0 3px 4px;
text-decoration: none;
}

.Navigation a:visited {
color: #0033cc;              /* similar to water in the header image  */
display: block;     /*  this makes the whole box highlight rather than just the text */
padding: 3px 0 3px 4px;
text-decoration: none;
}

.Navigation a:hover {
color: #e42217;   /* similar to water in the header image  */
display: block;     /*  this makes the whole box highlight rather than just the text */
padding: 3px 0 3px 4px;
background-color: #f5f5f5;   /* gray */
text-decoration: underline;
}



/* ------ Section 5 - Additional Navigation ------ */

/* -- Extra Column Navigation -- */

.ExtraColumn h3 {
padding: 6px;
font-size: 110%;
color: #737373;  /*  medium gray  */
text-align: center;
background-color: #fff;   /* in SSR is pale orange - also used for image borders */
border-bottom: 0px solid #ffe8c1;
margin: 12px 0;
}

/* -- Thumbnail-with-Caption Navigation -- */

.ThumbnailLink {
text-align: center;
}

.ThumbnailLink a:link {
text-decoration: none;
}

.ThumbnailLink a:hover .Caption {
text-decoration: underline;
color: #0033cc;  /* dark blue */
}


/* -- Horizontal Text NavBar for Header and Footer -- */

.ExtraNav {
font-family: 'Lucida Sans Unicode', 'Lucida Grande', Verdana, Arial, sans-serif;
}

.ExtraNav ul {
list-style-type: none;
}

.ExtraNav ul li {
display: inline;
text-align: center;
}

.ExtraNav a:link {
color: #0033cc;       /* dark blue -- */
text-decoration: none;
text-align: center;
}

.ExtraNav a:visited {
color: #0033cc;       /* dark blue -- */
text-decoration: none;
}

.ExtraNav a:hover {
color: #fff;  /* white -- */
background-color: #96ceff;   /*  body blue -- */
text-decoration: underline;
}

#Header .ExtraNav {
	font-size: 115%;
	color: #fff;  /*  white  */
	position: absolute;
	bottom: 0;
	left: 10px;
	height: 25px;
	padding: 8px 0px 1px 0px;
	width: 940px;
	background-color: transparent;    
}

#Header .ExtraNav ul { 
margin: 0 10px;
}

#Header .ExtraNav ul li { 
margin: 6px;
padding: 8px 45px 1px 10px;     /* -- change spacing between header links here -- */
}

#Header .ExtraNav a:link {
color: #fff;       /* white -- */
text-decoration: none;
text-align: center;
}

#Header .ExtraNav a:visited {
color: #fff;       /* white -- */
text-decoration: none;
}

#Header .ExtraNav a:hover {
background-color: #fff;   /*  white -- */
color: #96ceff;   /*  body blue -- */
}

#Footer .ExtraNav {
margin: 12px auto;
color: #fff;  /*  white  */
}


#Footer .ExtraNav ul { 
margin: 0 10px;
}

#Footer .ExtraNav ul li { 
margin: 6px;
padding: 8px 6px 1px 6px;    /* -- change spacing between footer links here -- */
}

.Footer a:link {
color: #fff;       /* white -- */
text-decoration: none;
text-align: center;
}

.Footer a:visited {
color: #fff;       /* white -- */
text-decoration: none;
text-align: center;
}


#Footer .ExtraNav a:hover {
background-color: #96ceff;   /*   body blue -- */
color: #fff;
}



/* ------ Section 6 - Boxes ------ */

.CalloutBox {
background-color: #f5f5f5;
font-size: 90%;
width: 50%;
float: right;
border: 3px solid #b22222;
margin: 18px auto 18px 15px;
padding: 1px auto;
color: 333;
}

div.CalloutBox p {
margin: 13px;
}

p.CalloutBox {
padding: 13px;
}

div.CalloutBox h1,
div.CalloutBox h2,
div.CalloutBox h3,
div.CalloutBox h4,
div.CalloutBox h5,
div.CalloutBox h6 {
margin: 13px 0 0 13px;
}

.FullWidthBoxRedBorder {
background-color: #f5f5f5;
font-size: 90%;
width: 100%;
clear: both;
border: 3px solid #b22222;
margin: 15px 0px 10px 0px;
padding: 10px 0px;
color: 333;
}

div.full-width-box-gray {       /* use in  left and right columns */
    background-color: #d5d7e2;
	margin: 15px 0px 10px 0px;
	padding: 5px 10px;
    border: 0px solid #87879a;

}
.ReminderBox {          
background-color: #ffe8c1;
width: 33%;
border: 1px solid #ffe8c1;
margin: 0 0 12px 18px;
float: right;             /* adding float enables text to flow around it */
color: #006;
}

.ReminderBox h4 {
margin: 0;
padding: 2px;
text-align: center;
background-color: #fff;
}

.ReminderBox p {
font-size: 80%;
padding: 0 4px;
line-height: 120%;
}

.AdSenseBoxLeft, .AdSenseBoxRight, .AdSenseBoxCenter468, .AdSenseBoxExtraColumn {
padding: 5px;
background-color: #d3e4fb;
border: 0px;
}

.AdSenseBoxLeft {
margin: 0 18px 12px 18px;
float: left;
}

.AdSenseBoxRight {
margin: 0 18px 12px 18px;
float: right;
}

.AdSenseBoxCenter468 {
width: 468px;
margin: 0 auto 12px auto;
clear: both;
}

.AdSenseBoxExtraColumn {
padding: 0;
margin: 0 auto 12px auto;
clear: both;
}

.ReturnToNavBox {        /* Use in content area for related topics - same as div.full-width-box2*/
background-color: #f5f5f5;
font-size: 90%;
line-height: 115%;
width: 95%;
border: 3px solid #b22222;   
margin: 36px auto;
padding: 5px 10px 5px 10px;
}


.SocializeItBox {          /* -- SocializeIt Box -- */         
background-color: transparent;
color: #333;
text-align: center;
font-size: 90%;
}



.RSSbox {          /* -- RSS Box -- */
width: auto;
background-color: #fff;
border: 0px solid #ffe8c1;
margin: 0px auto 0px 0px;
padding: 0px 0px 0px 0px;
font-size: 100%;
font-weight: bold;
color: #333;
line-height: 90%;
text-align: center;
}

.formbody {
font-family: 'Lucida Sans Unicode', 'Lucida Grande', Verdana, Arial, sans-serif; 
font-size: 90%;
text-align: center;
color: #000;
background-color: #ffffff;
border: 5px solid #ffe8c1;
padding: 6px 4px 4px 6px;
}




/* ------ Section 6A - Boxes from AJ's template ------ */

/*** right column Full width box.
Change the colors to suit. The standard box has a white background, and the
box2 has a colored background ***/

div.full-width-box2 {     /* Use in content area for related topics - same as .ReturnToNavBox*/
	background-color: #f5f5f5;
	font-size: 90%;
    line-height: 115%;
    width: 95%;
	border: 3px solid #b22222;
	margin: 36px auto;
	padding: 5px 10px 5px 10px;
}



.snapshot-box {              /* use in middle of content column */
	width: 80%;
	background-color: #f5f5f5;
	margin: 30px auto;
	font-size: 90%;
	padding: 5px 10px;
	border: 3px solid #b22222;
}

div.full-width-box-gray {       /* use in  left and right columns */
    background-color: #d5d7e2;
	margin: 15px 0px 10px 0px;
	padding: 5px 10px;
    border: 0px solid #87879a;
}	

div.quicklinks-box-gray {       /* use at bottom of page */
    background-color: #d5d7e2;
	margin: 30px 0px 20px 0px;
	padding: 1px 5px;
    border: 0px solid #87879a;
	font-size: 90%;
}	


.tableschedule caption {       /*-- use for sports schedules --also Event Calendar page--*/
	font-family: Georgia, "Times New Roman", Times, serif;
	font-size: 150%;
	font-weight: bold;
	color: #666;
	text-align: center;
}

.tableschedule {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 80%;
	font-style: normal;
	text-align: center;
	background-color: #F5F5F5;
	margin: 30px 10px;
}

.tableschedule tr th {
	font-family: Georgia, "Times New Roman", Times, serif;
	padding-top: 2px;
	padding-bottom: 2px;
	color: #FFF;
	background-color: #BB0008;
	font-size: 110%;
}


div.full-width-box {         /* gray border, white background--use for Boston Hotels page*/
   background-color: #ffffff;
	margin: 30px 0px 20px 0px;
	padding: 5px 15px;
   border: 3px solid #d5d7e2;
	
}



/* sv - div.center-box is exactly the same as above, only just 50% wide */

div.center-box {
   width: 50%;
   background-color: #ffffff;
	margin-left:auto;
	margin-right:auto;
	padding: 15px;
   border: 1px solid #87879a;
	
}

div.quick-links {       
	font-size: 80%;
	background-color: #Fff6b3;
	text-align: center;
	clear: both;
	border: 1px solid #87879a;
	padding-top: 0px;
	padding-right: 5px;
	padding-bottom: 0px;
	padding-left: 5px;
	margin-top: 0px;
	margin-right: 2px;
	margin-bottom: 0px;
	margin-left: 2px;
}

div.quick-links-rt-col {
	font-size: 90%;
	background-color: #Fff6b3;
	text-align: center;
	clear: both;
	border: 1px solid #87879a;
	padding-top: 0px;
	padding-right: 5px;
	padding-bottom: 0px;
	padding-left: 5px;
	margin-top: 0px;
	margin-right: 2px;
	margin-bottom: 0px;
	margin-left: 2px;
}

div.full-width-box-blue {
	background-color: #eaf7ff;
	border: 1px solid #87879a;
	margin-top: 10px;
	margin-right: 10px;
	margin-bottom: 10px;
	margin-left: 0px;
	padding-top: 0px;
	padding-right: 15px;
	padding-bottom: 0px;
	padding-left: 15px;
	
}	

	
/*** Half width box left ;  sv - in other words, this is a block half the width of the center content area ***/
div.half-width-box-left {
   background-color: #ffffff;
	margin: 5px 5px 5px 5px;
	border: 1px solid #87879a;
	padding: 10px;
	width: 50%;
	float: left;
}

/*** Half width box right - red border, light gray background***/
div.half-width-box-right {
   background-color: #f5f5f5;
	margin: 5px 0px 10px 5px;
	border: 3px solid #b22222;
	padding: 15px;
	width: 50%;
	float: right;	
}

/*** Half width box right - red border, light yellow background***/
div.half-width-box-right-snapshot {
   background-color: #fffaf0;
	margin: 5px 0px 5px 15px;
	border: 3px solid #b22222;
	padding: 5px 10px 5px 10px;
	width: 50%;
	float: right;
	font-size: 95%;	
}


/*** Third width box right with no borders (use for mail list sign-up box) ***/
div.third-width-box-right {
   background-color: #ffffff;
	margin: 5px 5px 5px 5px;
	border: 0px solid #87879a;
	padding: 10px;
	width: 30%;
	float: right;
}


/*** Third width box left with no borders (use for book reviews - Amazon link) ***/
div.third-width-box-left {
   background-color: #ffffff;
	margin: 5px 5px 5px 5px;
	border: 0px solid #87879a;
	padding: 5px;
	width: 30%;
	float: left;
	
}



/*** Amazon image ad box left with no borders  ***/
div.amazon-ad-box-left {
   background-color: #ffffff;
	margin: 5px 10px 5px 5px;
	border: 1px solid #87879a;
	padding: 5px;
	float: left;
	
}


/*** SV - half-width gray boxes used for cost ranges ***/

div.half-width-box-left-gray-smaller-font {
   background-color: #e4e3e3;
	margin: 5px 5px 5px 5px;
	border: 1px solid #87879a;
	padding: 10px;
	width: 40%;
	float: left;
	font-size: 80%;
	line-height: 110%;
	
}
/*** Half width box right for cost ranges - gray***/
div.half-width-box-right-gray-smaller-font {
	background-color: #e4e3e3;
	margin: 5px;
	border: 1px solid #87879a;
	padding: 10px;
	width: 40%;
	float: right;
	font-size: 80%;
	line-height: 110%;
	
}



/* the border of the image inside your half width textbox can be changed.
Its set to #5F8B8C at the moment. You can also change the solid
to either dashed or dotted if you want to;      SV - changed border from 1px to 0px */

/*** Picture inside the text ***/
.img-float-left {
	float: left;
	padding: 0px;
	margin-right: 10px;
	border: 0px solid #000066;
	margin-top: 5px;
	margin-bottom: 5px;
}

.img-float-right {
	float: right;
	padding: 0px;
	margin-left: 10px;
	border: 0px solid #000066;
	margin-top: 5px;
	margin-bottom: 5px;
}

.img-float-center {
	padding: 0px;
	margin: 20px auto;
	border: 0px solid #000066;
	text-align: center;
    clear: both;
	}


/* ------ Section 7 - Frequently Used Styles ------ */

.Clear {
clear: both;
}

.Caption {
font-size: 85%;
font-weight: bold;
color: #0c3f72;  /* deep shade of H1 blue -- */
display: block;
line-height: 150%;
margin-bottom:30px;
}

.Copyright {
font-size: 95%;
font-weight: bold;
color: #fff;  /* white -- */
line-height: 150%;
margin-bottom:30px;
}

.HorLine {    /*  I added this one to replace hr - based on CalloutBox */
background-color: #fff;
width: 85%;
border-bottom: 2px solid #d5d7e2;
margin: -15px auto 28px auto;
padding: 0px;
}

.signature {
font-family: 'Monotype Corsiva', 'Apple Chancery', 'Comic Sans MS', cursive;
font-size: 170%;
color: #ffc565;
line-height: 120%;
margin-bottom: 30px;
}



/* --- colors ---*/

.black {
color: #333; 
}

.red {
color: #e42217; 
}



/* -- floats -- */

.ItemRight {
float: right;
margin: 2px 0 12px 18px;
text-align: center;
}

.ItemCenter {
margin: 2px auto 12px auto;
text-align: center;
clear: both;
}

.ItemLeft {
float: left;
margin: 2px 18px 12px 0;
text-align: center;
}

/*-- Styling --*/

.UnbulletedList {
line-height: 120%;
}

/* This is for a yellow highlight....add to p, H1, H2, H3 tags*/
.highlight{
	background-color:#ffff00;
	color:#000;
	width: auto;
	font-weight: bold;
	text-align: center;
}

.newsletterform{           /*-- use for newsletter signup form  --*/
	font-family: 'Lucida Sans Unicode', 'Lucida Grande', Verdana, Arial, sans-serif;
	font-size: 90%;
	text-align: center;
	color: #333;
	background-color: #d5d7e2;
	border: 0px solid #96ceff;
	padding: 6px 4px 2px 6px;
}
