body 
	{
        margin:0;
        padding:0;
        border:0;			/* This removes the border around the viewport in old versions of IE */
        width:100%;
        background:#fff;
        background-repeat: no-repeat;
        min-width:600px;   /* Minimum width of layout - remove line if not required */
							/* The min-width property does not work in old versions of Internet Explorer */
		font-size:90%;	
	}
	
	
img 
	{
	
		border: none;
		border: 0;
		border-style: none;

	}

a 
	{
		color:#222222;
	}
	

p 
	{
        margin:.4em 0 .8em 0;
        padding:0;
        color: #222222;
		font-family: TimesNewRoman, serif;
		font-size: 14px;
	}
	
p.subtitle
	{
		text-align:center;
		font-size:12px;
	}


li	
	{
		margin-bottom: 5px;
	}

h1,
h2,
h3 
	{
		color: #336699;
	}


/* Header styles */

#header 
	{
        clear:both;
        float:left;
        width:100%;
    }
    
    
#header p,
#header h1,
#header h2 
	{
	    padding:.4em 15px 0 15px;
        margin:0;
	}
	

/* 'widths' sub menu */

#layoutdims 
	{
		clear:both;
		background:#eee;
		border-top:4px solid #000;
		margin:0;
		padding:6px 15px !important;
		text-align:right;
	}


/* column container */

.colmask 
	{
	    position:relative;		/* This fixes the IE7 overflow hidden bug */
	    clear:both;
	    float:left;
        width:100%;			/* width of whole page */
		overflow:hidden;	/* This chops off any overhanging divs */
	}
	

/* common column settings */

.colright,
.colmid,
.colleft 
	{
		float:left;
		width:100%;
		position:relative;
	}
	
.col1,
.col2,
.col3 
	{
		float:left;
		position:relative;
		padding:0 0 1em 0;
		overflow:hidden;
	}


/* 2 Column (left menu) settings */

.leftmenu 
	{
		background:#fff;		/* right column background colour */
	}
	
.leftmenu .colleft 
	{
		right:75%;				/* right column width */
		background:#fff;		/* left column background colour */
	}
	
.leftmenu .col1 
	{
		width:71%;				/* right column content width */
		left:102%;				/* 100% plus left column left padding */
	}

.leftmenu .col2 
	{
		width:21%;				/* left column content width (column width minus left and right padding) */
		left:6%;				/* (right column left and right padding) plus (left column left padding) */
	}


/* Footer styles */

#footer 
	{
        clear:both;
        float:left;
        width:100%;
		border-top:1px solid #c0c0c0;
    }

#footer p 
	{
        padding: 10px;
        margin:0;
        font-size: 12px;
    }
    
#footer img
	{
		padding-left: 5px;
		padding-right: 0px;
	}
    


dt
	{
		font-size: medium;
		font-style: italic;
	}

div.spacer
	{
		height:10px;	
	}

div.menu-item-selected
	{
  		vertical-align: middle;
  		margin-bottom: 15px;
  		margin-top:15px;
  		text-align: left;
  		padding-left: 10px;
  		padding-right: 10px;
	}
	
a.menu-item-selected
	{
  		text-decoration: none;	
  		font-family: TimesNewRoman, serif;
  		font-size: medium;
  		color: #336699;
	}

div.menu-item
	{
  		vertical-align: middle;
  		margin-bottom: 15px;
  		margin-top:15px;
  		text-align: left;
  		padding-left: 10px;
  		padding-right: 10px;
	}
	
a.menu-item
	{
  		text-decoration: none;	
  		font-family: TimesNewRoman, serif;
  		font-size: medium;
  		color: #c0c0c0;
	}

a.menu-item:hover
	{
  		color: #336699;	
	}

a.link
	{
		text-decoration: none;
		color: #222222;
		font-family: serif;
		font-weight: bold;
	}

a.link:visited
	{
		text-decoration: none;
		color: #222222;
		font-family: serif;	
		font-weight: bold;
	}

a.link:hover
	{
		color: #336699;
	}

.floatright 
	{ 
		float: right; 
	}	

.floatleft 
	{ 
		float: left; 
	}

.form
	{
		width:auto;
		text-align:left;
 		color:#222222;
		border-bottom:0px;
		border-left:0px;
		border-top:0px;
		border-right:0px;
		padding:0px;
	}


table a,
table a:link,
table a:visited 
	{
		border:none;
	}
	
table 
	{
		width:90%;
		border-top:1px solid #c0c0c0;
		border-right:1px solid #c0c0c0;
		margin:1em auto;
		border-collapse:collapse;
	}
	
caption 
	{
		color: #222222;
		font-size:.94em;
		letter-spacing:.1em;
		margin:1em 0 0 0;
		padding:0;
		caption-side:top;
		text-align:center;
	}	
	
tr.odd td	
	{
		background:#f7fbff
	}
	
tr.odd .column1	
	{
		background:#f4f9fe;
	}
	
.column1	
	{
		background:#f9fcfe;
		text-align:center;
	}
	
td 
	{
		color:#678197;
		border-bottom:1px solid #c0c0c0;
		border-left:1px solid #c0c0c0;
		padding:.3em 1em;
		text-align:center;
	}	
	
th 
	{
		font-weight:normal;
		color: #678197;
		text-align:left;
		border-bottom: 1px solid #c0c0c0;
		border-left:1px solid #c0c0c0;
		padding:.3em 1em;
	}	
	
thead th 
	{
		background:#f4f9fe;
		text-align:center;
		font-family: TimesNewRoman, serif;
		color:#678197;
	}	 
	
ul.list1 
	{
		list-style: disc outside; color:#336699
	}
	
ul.list2 
	{
		list-style: circle outside; color:#336699
	}

span 
	{
		color: #222222;
	}
	


/* setup the background image of the Algarve */
.algarve 
	{
		padding:0; 
		margin:0; 
		list-style-type:none; 
		background:#fff url(../images/blankmap.gif); 
		width:385px; 
		height:175px; 
		margin:30px 500px 80px 50px; 
		position:relative; 
		background-repeat:no-repeat; 
		z-index:100;
	}
	
/* move the text off screen */
.algarve li a 
	{
		text-indent:-999px; 
		display:block; 
		width:8px; 
		height:8px; 
		background:#c0c0c0; 
		position:absolute; 
		line-height:8px;
	}
	
/* make the images and description invisible and an absolute position so that it does not take up any space */
.algarve li a em 
	{
		visibility:hidden; 
		position:absolute; 
		z-index:100;
	}
/* position the square markers */
.algarve li a.fa {top:151px; left:275px; text-decoration:none;}
.algarve li a.vi {top:137px; left:220px; text-decoration:none;}
.algarve li a.al {top:127px; left:180px; text-decoration:none;}
.algarve li a.pa {top:116px; left:182px; text-decoration:none;}
.algarve li a.lo {top:109px; left:225px; text-decoration:none;}
.algarve li a.la {top:125px; left:70px; text-decoration:none;}
.algarve li a.po {top:112px; left:100px; text-decoration:none;}
.algarve li a.sa {top:148px; left:10px; text-decoration:none;}
.algarve li a.be {top:127px; left:130px; text-decoration:none;}
.algarve li a.si {top:90px; left:115px; text-decoration:none;}
.algarve li a.he {top:132px; left:40px; text-decoration:none;}
.algarve li a.bl {top:60px; left:300px; text-decoration:none;}
.algarve li a.mo {top:80px; left:72px; text-decoration:none;}
.algarve li a.ba {top:80px; left:150px; text-decoration:none;}
.algarve li a.ca {top:130px; left:310px; text-decoration:none;}
.algarve li a.ch {top:80px; left:330px; text-decoration:none;}
.algarve li a.co {top:70px; left:190px; text-decoration:none;}
.algarve li a.go {top:145px; left:255px; text-decoration:none;}
.algarve li a.sl {top:100px; left:270px; text-decoration:none;}
.algarve li a.su {top:133px; left:3px; text-decoration:none;}
.algarve li a.ar {top:125px; left:155px; text-decoration:none;}

/* move the text back into view on hover */
.algarve li a:hover 
	{
		background:#336699; 
		text-indent:0; 
		height:1.2em; 
		font-size:1em; 
		color:#fff; 
		line-height:1em; 
		padding:2px 10px; 
		width:90px; 
		z-index:100;
	}
	
/* hack for IE5.x */
* html .algarve li a:hover 
	{
		width:110px; 
		height:1.5em; 
		w\idth:90px; 
		he\ight:1.2em;
	}
	
/* make the descriptive text visible, give it a size and position */
.algarve li a:hover em 
	{
		visibility:visible; 
		margin-left:5px; 
		background:#fff; 
		border:1px solid #336699; 
		width:130px; 
		color:#222222; 
		padding:14px;
		font-style:normal; 
		top:-135px; 
		text-align:center; 
		font-family:serif; 
		font-size:12px; 
		letter-spacing:0px; 
		line-height:1.5em;
	}
	
/* hack for IE5.x */
* html .algarve li a:hover em 
	{
		width:200px; 
		w\idth:150px;
	}
	
/* give the image a border and margin */
.algarve li a:hover em img 
	{ 
		border:1px solid #336699; 
		display:block; 
		margin-bottom:10px;
	}
	
/* style the empty span (I know it's not semantically correct) into an arrow point */
.algarve li a:hover em span 
	{
		display:block; 
		width:0; 
		height:0; 
		overflow:hidden; 
		border:15px solid #fff; 
		border-width:15px 0 15px 15px; 
		border-left-color:#336699; 
		position:absolute; 
		left:0; 
		top:128px;
	}
	
/* hack for IE5.x */
* html .algarve li a:hover em span 
	{
		width:30px; 
		height:30px; 
		w\idth:0; 
		he\ight:0;
	}


/*Credits: Dynamic Drive CSS Library */
/*URL: http://www.dynamicdrive.com/style/ */

.gallerycontainer
	{
		position: relative;
	/*Add a height attribute and set to largest image's height to prevent overlaying*/
	}

.thumbnail img
	{
		border: 1px solid white;
		margin: 0 5px 5px 0;
	}

.thumbnail:hover
	{
		background-color: transparent;
	}

.thumbnail:hover img
	{
		border: 1px solid gray;
	}

.thumbnail span
	{ 									/*CSS for enlarged image*/
		position: absolute;
		background-color: #ffffff;
		padding: 5px;
		left: -1000px;
		border: 1px solid gray;
		visibility: hidden;
		color: #222222;
		text-decoration: none;
	}

.thumbnail span img
	{ 									/*CSS for enlarged image*/
		border-width: 0;
		padding: 2px;
	}

.thumbnail:hover span
	{ 									/*CSS for enlarged image*/
		visibility: visible;
		top: 0;
		left: 230px; /*position where enlarged image should offset horizontally */
		z-index: 50;
	}

div.weatherscript
	{
		height: 75px;
		width: 435px; 
		height: 90px; 
		background-repeat: no-repeat; 
		background-color: #c0c0c0;
		border: 1px solid #222222;
	}
	
div.flash
	{
		position: relative; 
		width: 400px; 
		height: 300px; 
		overflow:hidden
	}
	
	/* object stuff here */

/* hides the second object from all versions of IE */
* html object.mov 
	{
		display: none;
	}

/* displays the second object in all versions of IE apart from 5 on PC */
* html object.mov/**/ 
	{
		display: inline;
	}

/* hides the second object from all versions of IE >= 5.5 */
* html object.mov 
	{
		display/**/: none;
	}