html, body {
	margin: 0px;
	padding: 0px;
}
body {	
   	font-family: trebuchet ms, verdana, Arial, Helvetica, Sans-serif;
	font-size: 13px;
	line-height: 18px;
	color: #000000;
	background: #c0c0c0;
	text-align: center;
}
body a {
    color: #333333;
    text-decoration: none;
}
body a:hover {
    color: #3399ff;
}

#page-container {
	width: 800px;
	margin: auto;
	background: white;
	position: relative; 
	text-align: left;
}

/* ------------------------ Heading Formats ------------------------------  */
h1 {
    margin: 0;
    padding: 0;
}
h2 { 
	font-family: trebuchet ms;
	font-size: 30px;
	color: orange;
	margin-left: 30px;
	margin-top: 15px;
	margin-bottom: 7px;
	/* If removing 48pt-gif images for h2 then use margin-top: 15; margin-bottom: 15px; else use...15px top&bottom?*/
}
h3 {    /*appears in trips.html */
	font-size: 20px;
	color: green;
	padding: 5px;
}
h4 {	/* used in itinerary and town pages)*/
	font-weight: strong;
	color: #000066;
}

h4 img { border-style: none;
text-decoration: none; 
position: relative;
top: 6px;}

h4 a {
	color: #000066;
}

h4 a:hover {
color: green;
}

h5 {}	/* defined in generic_trip.css, applied only to trip.html */
h6 {
	font-face: ;
	letter-spacing: 3px;
	font-size: 14px;
	color: #0094ff;
	margin: 0 0 5px 0; 
	padding: 0; 
}
h6 a {color: purple;
}
h6 a:hover {color: green;
}

/* ------------------------ Class Declarations ------------------------------  */
.hidden {
	display: none;
}
	
.header {
   	height: 204px;
    margin: 0;
   	padding: 0;
   	background-image: url(../images/header/background.jpg);
}

.strip {
	height: 72px;	
    margin: 0;
   	padding: 0;
} 
.strip table {padding: 0; margin: 0; background-image: url(../images/strip.jpg); }
.blue { /* used as headings in intro trip pages, also could be placed in trips.css as it is not used in general document*/
	font-family: Book Antiqua, Palatino Linotype, Palatino, serif;	
	font-size: 16px;	
	margin: 0px;
	color: #0094ff;
	font-weight: bold;
}
.highlights {
	margin: auto 20px 15px 15px;
}

.credit {
	font-size: 12px; 
	color: gray;
	text-align: right;}
.credit a { color: gray;}	/* I dont think these two do anything. That is they dont change the link colore.  */
.credit a:hover { color: #3399ff;}
}

/* ----------------- Footnote Formatting ------------------------  */

sup.footnote {font-size:70%; vertical-align:top} 

div.footnote {font-size: 8pt; clear: both;}   


/* ------------------------ Navigation Bar One ------------------------------  */

#nav-bar { height: 25px; width: 350px; float: right;}

#nav-bar dt { 
    float: left;                  
}

#nav-bar dt a {
	font-size: 18px;
	color: orange;
	text-decoration: none;
	padding: 5px;
	font-weight: 500;	
}
#nav-bar dt a:hover {
	color: green;	
}

/* ------------------------ Content Div ------------------------------  */
/* There are three kinds of content layouts on this site:
    1) Text&Pic  
	- larger left-hand text div (350px) and smaller right-pic div (330px)
         	- this is the default setting used in index, contact, about, and about_founder.
         	- Current State: called #text and #pic and given styles in style.css
    2)  Two Equal-Width Columns - 
	- used in most trip pages (tuscany and puglia), (though not initial trips.html page) and about.html
	- Current State: explained in trip.css and uses #left-column #right-column
    3) WideText and Pic
	- used in trips.html
	- Current State: uses .wide class to assign values to divs otherwiseformatted as text&pic.
	   Thus is called #widetext and #pic.
Let's find a better way to differentiate!
*/

#content {
margin-top: 25px;
}
#content #text {
    float: left; 
    margin-left: 45px;
    margin-bottom: 30px; 
    width: 350px;
    margin-top: 0; 
    display: inline;	 /* for IE Only */ 	/* this fixes a bug that would double my left-hand margin in IE*/
}  
#content #widetext {		/* used in trips.html*/
    float: left;
    margin: 0 0 30px 45px; 
    width: 400px;
    display: inline;
}
#content #pic {
    float: right;
    width: 330px;
    margin: 0px 15px 30px 0;
    font-size: 12px; 
    text-align: center;
    position: relative;
    top: 20px;
    right: 15px;
}
#content #pic a { color: gray;}
#content #pic a:hover { color: #3399ff;}

#content #widepic {
    float: right;
    width: 400px;
    margin: 0 0px 0px 0;
}

#content #widepic h6 {
margin: 0;
}

/* Margins in Contact.html */
/*Margins in contact.html are particular because there is such 
little text. Two margin sets are declared in the html code (one on 
'text div' other on 'pic div'). A third set is declared below. */
#content .contactpadding {	
    width: 212px;
    text-align: center; 
}

#slideshow {
	width: 700px;
	height: 525px;
	margin: auto;
	margin-top: 65px;
	margin-bottom: 50px;
	
}

/* ------------------------ Corner Nav Bar ------------------------------  */

#corner-nav {
     clear: both;
     position: absolute;
     bottom: 120px; 
     right: 70px; 
     clear: both;
}

#corner-nav dt a {
	font-size: 18px;
	color: green;
	text-decoration: none;
}

/* ------------------------ Footer ------------------------------  */

#footer {
    clear: both;
    font-family: verdana, sans serif;
   	font-size: 10px;
	color: #c0c0c0;
	border-top: 1px solid #c0c0c0;
	height: 60px;
}

#footer .padding {
    padding: 13px 13px;
}

#footer a {
    color: #c0c0c0;
    text-decoration: none;
}

#footer a:hover {
    color: #3399ff;
}

#footer #left-two {
    float: left;
    width: 70%;
    padding: 0px;
    margin: 0px;
 }


#footer #right-one {
    width: 30%;
	float: right;
	text-align: right;
	padding: 0px;
	margin: 0px;
	position: relative;
	top: -3px;
 }
 
 #footer #left-two #site-info {
    width: 43%;
    float: left;
    padding: 0;
    margin: 0;
}
 
 #footer #left-two #altnav {
    width: 57%;
    float: right;
    padding: 0;
    margin: 0;
    text-align: center;
}