body {
    font-size:100%;
    font-family: Veranda, Helvetica, Arial, sans-serif;
    background: #cfcfcf;
    margin:0;
    padding:0 0 0px;/*IE needs this for #wrapper bottom margin*/
}

 
#wrapper {
    width:100%;
    min-width:53em;
    max-width:64em;
    margin:0px auto 0;
    border:1px solid gray;
    background:#cfcfcf;/*left and right columns BG color*/
}
#header {
    min-height:6em;
    background: black;
    text-align:left;
}
#header a {
	display: block;
	font-family: "Trebuchet MS", Helvetica, Arial, sans-serif;
	font-size: xx-large;
  	color: #ffffcc;
  	padding-top: 2.5em;
  	padding-bottom: 0;
  	padding-left: .4em;
  	margin: 0;
	text-decoration:none;
  	background: black url(backgrounds/besalu.JPG) repeat-y right;
}

* html #header {height:6em;}/*min height for IE6*/
 
#navigation {
    font-weight: bold; 
}



#innerwrap {
    min-height:0;/*IE7 haslayout/float containment*/
    margin-left:160px;
    margin-right:175px;
    background:#ffffcc;/*#main background color*/
    border-left:1px solid gray; 
    border-right:1px solid gray;
    border-bottom:1px solid gray;

}
* html #innerwrap {height:1%;}/*IE6 haslayout/float containment*/
 
#innerwrap:after {/*clearfix adaption to contain floats in modern browsers*/
    clear:both;
    content:"";
    display:block;
    height:0;
    font-size:0;
}
#inner {
    float:left;/*nest #main & #left together and bring them first in source*/
    width:100%;
    position:relative;/*IE6/7 need this with fluid width #wrapper*/
}
#main {
    float:right;/*bring right float first in source*/
    width:100%;/*prevent shrinkwrapping of float*/
    padding-top:.5em;
    font-family: Veranda, Helvetica, Arial, sans-serif;
    line-height: 125%;
}

#main a{
	font-size: small;
}

#left {
    float:left;/*float left to shift it left into #innerwrap left margin*/
    width:160px;
    margin-left:-160px;/*shift left into #innerwrap left margin*/
    position:relative;/*IE6 needs this with neg margin shift out of the parent*/
    right:1px;/*position past #innerwrap left border*/
    padding-top:.5em;
   
}
#right {
    float:right;
    width:175px;
    margin-right:-175px;
    position:relative;/*IE6 needs this with neg margin shift out of the parent*/
    left:1px;/*position past #innerwrap right border*/
    padding-top:.5em;
}
#footer {
    	clear:both;
    	font-family: Veranda, Helvetica, Arial, sans-serif;
    	height: 90px;
	background: #cfcfcf;
	text-align: center;
}




#updates {
   	width: 28em;
	margin-left: auto;
	margin-right: auto;
	margin-bottom: 1em;
	border: 1px solid gray;
	background-color: #ffffcc;
	color: black;
	padding: 1em;
} 

#float_right{
	float: right;
	width:50%;
}

#float_left{
	float: left;
	width:50%;
}

#amazonbanner {
    	text-align:center;
	border-bottom: 25px solid #ffffcc;
}

#google {
	padding: 5px;
}


#google_left {
	margin-top: 75em;
	border: 15px solid #cfcfcf;
	float: right;
}

#google_main {
	padding-left: 10px;
	padding-right: 10px;
	float: left;
}


#google-plus-one {
	margin: -24px -20px 0 0;
	text-align: right;
}
.twitter-share-button {
	margin-left: 3px;
	font-weight: normal;
	font-size: 75%;
}


#maps {
	text-align:center;
	font-size: 90%;
	
}

#spanish {
	text-align:center;
	font-size: 75%;
	background: white;
	padding: 0.5em;
	margin: 10px;
	margin-top: 100px;
	margin-bottom: 400px;
	color: black;
}

/*-----------------Navbar Styles -----------------------------------------------------*/

#nav {
    height: 1.6em;
}


 
ul#nav {
    z-index:1;
    background:#cfcfcf;
    font-size:.9em;/*base font-size for all menu sizing with ems*/
    height:1.6em;
    border-top:1px solid #000;
    border-bottom:1px solid #000;
    list-style:none;
    margin:0; /* reset the default left margin in IE */
    padding:0 0 0 0; /* reset the default left padding in good browsers */
}
#nav li {
    z-index: 1;
    position:relative; /* establish stacking context for the AP'd dropdown sublist */
    float:left;
    width:9.5em;
    padding:0;
    background:#cfcfcf;
    border-left:1px solid #fff;
    border-right:1px solid #000;
}

 
#nav li a {
    float: left;
    display:block;
    padding:0em 2.5em 0 1em; /*--------- bulks up nav button clickable area--------- */
    line-height:1.75em; /* center the text vertically */
    text-decoration:none;
    color:#000;/* 1st level font color*/
}
 
#nav li:hover, 
#nav li.sfhover{ 
    background:#35180e;/* background for all links on hover */
    visibility:visible;/* makes IE7 think something changes on hover, fixes IE sticking dropdown */
}
#nav li:hover a, 
#nav li.sfhover a {color:#ff4100;}/*1st level font color on hover*/
 
/*=== All Sublist Styles ===*/
 
#nav ul {
    position:absolute; /* position the sublist to nearest positioned ancestor, the (#nav li) in this case*/
    width:9.5em;
    margin-left:-999em;/* hide the sublist */
    left:0; /* IE6&7 need this to position the sublist correctly on hover*/
    top:1.75em;
    list-style:none;
    background: #cfcfcf;/* IE needs some sort of BG on the nested ul */
    border:1px solid #000;
}
#nav li li{
    /*float:left;/
(note: lack of float here triggers IE6/7 overflow bug) inherits from #nav li anyway unless reset */
    border:0;/*reset borders from #nav li*/
}
#nav li li a{
    float: none;/*reset the float from #nav li a*/
    display:block;
    width:8.5em;/*IE6 needs a width (10em total with padding)*/
    line-height:1.2; /*reset from #nav li a */
    padding: .3em .5em;
}
/*=== Hide All Sublists ===*/
#nav li:hover ul,
#nav li:hover ul ul,
#nav li.sfhover ul, 
#nav li.sfhover ul ul {
    margin-left:-999em;
}
/*=== Sublist Font Colors ===*/
 
#nav li:hover li a, 
#nav li.sfhover li a, 
#nav li:hover li li a, 
#nav li.sfhover li li a {color:#000;} /*2nd and 3rd levels font color*/
 
#nav li li:hover a, 
#nav li li.sfhover a,
#nav li li li:hover a, 
#nav li li li.sfhover a {color:#ffffcc;} /*2nd and 3rd levels font color on hover*/
 
/*=== Second Level UL position on hover ===*/
 
#nav li:hover ul,
#nav li.sfhover ul{ 
    margin-left: -1px; /* show the sublist (line up with left border on main list items)*/
}
/*=== Third Level UL position on hover ===*/
 
#nav li li:hover ul,
#nav li li.sfhover ul {
    margin-left:10em;
    top:-1px;
}

/*---- sidebar secondary nav styling-------------------------------*/

ul#sidenav {
    padding:0 0 0 0;
    margin-left: 20px;
}

#sidenav li { 
   list-style-type: disc;
}

#sidenav li a, #route li a, #medieval li a, #photo2 li a {
    color: black;
     display:block;
}


#sidenav li a:hover, #route li a:hover, #medieval li a:hover, #photo2 li a:hover {
  text-decoration: none;
  color: #ff4100;
  background-color: #35180e;
}

/*---- end of nav styling-------------------------------*/



/*----------- Fonts etc.---------------------*/

h1,h2,h3,h4 {
	font-family: "Trebuchet MS", Helvetica, Arial, sans-serif;
        
}

h2,h1 {
  color: black;
  font-size: 130%;
  font-weight: normal;
  padding-top: 12px;
  margin: 15px;
  padding-bottom: .2em;
}

h3 {
  font-weight: normal;
  padding-top: 8px;
  margin: 15px;
  padding-bottom: .2em;
}

h4 {
  color: #ffffcc;
  font-weight: normal;
  padding-top: 8px;
  margin: 0 20px 0 20px;
  padding-bottom: .2em;
}

li {
  font-size: small;
  list-style-type: none;
  padding-right: 15px;
}
p {
  font-size: small;
  color: black;
  margin: 15px;
}  



/*----------------   gallery etc  --------------------------------------------------------------*/


.feature {
	float: right;
	margin: 10px;
}
.feature2 {
	float: right;
	margin: 15px 5px 10px 20px;
}

.photo_content {
	text-align: center;
	margin: 20px;
}

/* This section is the setup for a Photo gallery
*/

.galleryphoto {
	padding-bottom: 20px;
	margin-bottom: 10px;
        margin-left: 2em;
	text-align: center;
}

.galleryphoto img {
   border: 15px solid white;
}

.galleryphoto p {
	text-align: center;
	font-size: 65%;
	font-weight: bold;
	margin-top: 0;
	line-height: 1.4em;
	
}

.photocredit {
	color: gray;
}

/* this section defines the table style for the history timeline
*/

table.dates {
        margin: 15px;
	border: none;
	text-align:center;
}

table.dates td {
	border: 1px solid black;
	padding: 0.2em;
	font-size: small;
}

/* This section defines the table for the diary of medieval fairs etc.
*/

table.events {
	border-collapse: collapse;
	margin: 15px;
}

table.events th, table.events td {
	padding: 4px;
	border: 1px solid #000066;
}

table.events th {
  	text-align: left;
  	background-color: #cfcfcf;
  	color: black;
  	padding-top: 0;
  	padding-bottom: 0;
  	padding-left:2px;
  	padding-right: 2px;
}

table.events td {
  font-size: small;
  background-color: white;
}
/*--- This section defines the table for the paradores and vegetarian food.---*/


table.paradores {
        margin: 15px;
	border-collapse: collapse;
	text-align: left;
}

table.paradores td {
	border: 1px dotted gray;
	padding: 0.2em;
	font-size: small;
}

table.vegetarian {
        margin: 15px;
	border-collapse: collapse;
	text-align: left;
}

table.vegetarian td,table.vegetarian th {
	border: 1px dotted gray;
	padding: 0.2em;
	font-size: small;
	width: 50%;
}
table.vegetarian th {
  	text-align: left;
  	background-color: #cfcfcf;
  	color: black;
  	padding-top: 0;
  	padding-bottom: 0;
  	padding-left:2px;
  	padding-right: 2px;
}

/*--- This section defines the table for the recomended itineraries.---*/

table.spanish-itinerary-table {
	margin: 15px;
	text-align: center;
	border: solid 1px gray;
	border collapse: none;
}

table.spanish-itinerary-table td{
	background-color: white;
	border: solid 1px gray;
}

table.spanish-itinerary-table th{
	background-color: #ececec;
	border: solid 1px gray;
}
	



/*--------- This section defines the links--------------*/


a {
	font-weight: bold;
	color: black;
}

a:link {
	color: black;
}

a:visited {
  color: navy;
}

a:hover {
  text-decoration: none;
  color: #ff4100;
  background-color: #35180e;
}

a:active {
  color: black;
  background-color: white;
}

/*-----------------------amazon books style---------------------*/

.amazonphoto {
	
	margin-bottom: 2em;
        margin-left: 2em;
	margin-top: 2em;
}

.amazonphoto img {
   	border: 15px solid #ffffcc;
	
}

.amazonphoto p {
	font-size: 95%;
	font-weight: normal;
	margin-top: 0;
	max-width: 400px;
	line-height: 1.4em;
}

.amazonphoto a:hover {
	background-color: #ffffcc;
}

table.amazon {
        margin: 15px;
	border-collapse: collapse;
	text-align: left;
}

table.amazon td {
	border-top: 1px dotted gray;
	border-bottom: 1px dotted gray;
	border-left: none;
	border-right: none;
	padding: 0.2em;
	font-size: small;
}

#sidebar-feature {
	margin: 250px 10px 10px 10px;
	padding: 20px 10px 20px 10px;
	background-color: #ececec;
	border: solid 1px gray;
}

#sidebar-feature a {
	font-weight: normal;
	font-size: 90%;
	color: blue;
}

#sidebar-feature a:hover {
  text-decoration: none;
  colr: white;
  background-color: silver;
}

ul#photo {
	list-style-image: url("camera-logo.gif");
	float: right;
	margin: -20px 0 0 0 ;
}

ul#photo2 {
	list-style-image: url("camera2-logo.gif");
	padding:0 0 0 0;
    	margin-left: 25px;
}

ul#medieval {
	list-style-image: url("medieval.gif");
	padding:0 0 0 0;
    	margin-left: 25px;
}

ul#route {
	list-style-image: url("route-logo.gif");
	padding:0 0 0 0;
    	margin-left: 25px;
}