/* GLOBAL
----------------------------------------------------------------- */
body{
	background:url(images/bground.jpg) #fff repeat-x;
	color:#454544;
	font:76%/1.4em tahoma, geneva, arial, sans-serif;
	margin:0;
	text-align:center;
}

*{
	margin:0;
	padding:0;
}
img{
	border:0;
}


/* STRUCTURE
----------------------------------------------------------------- */
#container{
	background:url(images/bground-container.gif) repeat-y;
	margin:0 auto;
	padding-bottom:90px;
	text-align:left;
	width:760px;
}
.clearfix:after {
	content:"."; 
	display:block;
	height:0; 
	clear:both; 
	visibility:hidden;
}
.clearfix {
	display:inline-table;
}
/* mac hide \*/
	* html .clearfix {height: 1%;}
	 .clearfix {display: block;}
/* End hide */
#header{
	height:98px;
	margin:0 auto;
	padding: 0;
	width:760px;
}
#content{
	float:left;
	
	width:531px;
}
#right{
	float:right;
	
	width:228px;
}
#rightcontent{
	background:url(images/bground-right.jpg) repeat-x;
	width:227px;
}
#toplinks{
	background:url(images/bground-toplinks.gif) no-repeat;
	color:#908a8a;
	float:right;
	font-size:0.9em;
	padding:5px 0 0 0;
	text-align:right;
	width:380px;
}
#breadcrumbs{
	border-bottom:1px solid #dfdcd9;
	margin-bottom:10px;
	padding:10px 0 10px 10px;
	width:498px;
}
#wrapperfooter{
	background:url(images/bground-footer.jpg) transparent repeat-x;
	clear:both;
	text-align:center;
}
#footer{
	margin:0 auto;
	padding-top:8px;
	width:760px;
}

/* HOME PAGE
----------------------------------------------------------------- */
.trioleft{
	background:url(images/bground-3col.jpg) no-repeat 0 97px;
	float:left;
	width:162px;
}
.trioright{
	background:url(images/bground-3col.jpg) no-repeat 0 97px;
	float:left;
	margin-left:11px;
	
	width:162px;
}
img.readmore{
	margin-top:10px;
}
.triopic{
	border:3px solid #fff;
}
.triorow{
	background:#fafbf3;
	border-left:1px solid #ededed;
	border-right:1px solid #ededed;
	border-bottom:1px solid #ededed;
	height:115px;
	padding:5px;
	width:323px;
}
.triorowlast{
	background:#fafbf3;
	border-bottom:none;
	border-left:1px solid #ededed;
	border-right:1px solid #ededed;
	padding:5px;
	width:323px;
}
.triorow img,.triorowlast img{
	background:#fff;
	border:1px solid #e6e6e6;
	float:left;
	margin:3px 10px 0 0;
	padding:5px;
}
.boxfeature{
	background:url(images/bground-boxfeature.jpg) repeat-x;
	border:1px solid #ededed;
	height:246px;
	margin-top:4px;
	padding:5px;
}
* html .boxfeature{
	margin-top:7px;
	height:249px;
}
.boxfeature img{
	border:3px solid #fff;
	margin-top:5px;
}
.offers{
	background:url(images/bground-boxfeature.jpg) repeat-x;
	border-bottom:1px solid #ededed;
	border-top:1px solid #ededed;
	height:105px;
	margin-top:4px;
	padding:5px;
}
.offersinside{
	background:url(images/bground-boxfeature.jpg) repeat-x;
	border-bottom:1px solid #ededed;
	border-top:1px solid #ededed;
	height:85px;
	margin-top:19px;
	padding:5px;
	width:217px;
}
.fade{
	width:75px;
}
.scrolltop{
	background:url(images/scroll-top.gif) no-repeat left bottom;
	height:10px;
	width:335px;
}
.scrolltop img{
	vertical-align:bottom;
}
.scrollbottom{
	background:url(images/scroll-bottom.gif) no-repeat left top;
	height:35px;
	width:335px;
}

/* RIGHT CONTENT
----------------------------------------------------------------- */
.image-container{
	background:#fff;
	margin:0 0 0 8px;
	padding:5px 0 0 5px;
	height:60px;
	width:200px;
}
.image-container img{
	float:left;margin-top:3px;
}
.dontwrap p{margin-left:55px;}

/* MAIN CONTENT
----------------------------------------------------------------- */
#sectionimage{
	border:3px solid #fff;
	clear:both;
	height:180px;
	margin-bottom:20px;
	width:502px;
}
.image-container img{
	float:left;margin-top:3px;
}
.dontwrap p{
	margin-left:55px;
	padding:0;
}
#resortdetails{
	border-bottom:1px solid #e2e3e3;
	height:40px;
	margin-bottom:10px;
	margin-left:10px;
	width:508px;
	
}
#children{
	background:url(images/icon-children.gif) no-repeat;
	float:left;
	height:31px;
	width:160px;
}
#honeymoon{
	background:url(images/icon-honeymoon.gif) no-repeat;
	float:left;
	height:31px;
	width:170px;
}
#prices{
	background:url(images/icon-pound.gif) no-repeat;
	float:left;
	height:31px;
	width:166px;
}
#children p,#honeymoon p,#prices p{
	color:#7e7e63;
	font-size:0.9em;
	line-height:1.2em;
	padding-left:40px;
	padding-top:7px;
}

/* THUMBS
----------------------------------------------------------------- */
#thumbs{
position: relative;
}
#thumbs a img{
border:1px solid #e5e5e5;
padding:5.2px;
}
#thumbs a:hover img{
border:1px solid #c6cfd4;

}
#thumbs a:hover{
background-color: transparent;
}
#thumbs a span{ /*CSS for enlarged image*/
position: absolute;
background-color:#fff;
height:180px;
left: -1000px;
visibility: hidden;
padding:0;

}

#thumbs a span img{ /*CSS for enlarged image*/
border:none;
padding:0;
}

#thumbs a:hover span{ /*CSS for enlarged image*/
visibility: visible;
border:1px solid #fff;
left: 0px;
top:-205px;
z-index: 50;
}

/* AVAILABILITY
----------------------------------------------------------------- */
#availability{
	background:url(images/bground-availability.jpg) #edf2f8 repeat-x;
	border:3px solid #fff;
	text-align:center;
	width:223px;
}
#location{
	margin-top:20px;
}

/* SUB NAVIGATION
----------------------------------------------------------------- */
#submenu{
	margin:20px 0 0 0;
}
#right #submenu ul{
	margin:0;
	padding:0;
	list-style-type:none;
	width:227px;
}
#right #submenu ul li{
	background:#fff;
	border-top:1px solid #e6e6e6;
	list-style-type:none;
	margin:0;
	padding-left:10px;
}
#right #submenu ul li#last{
	border-bottom:none;
}
#right #submenu ul li a{
	border:none;
	color:#696363;
	display:block;
	font-size:0.9em;
	margin:0;
	line-height:1.3em;
	padding:4px 0;
	text-decoration:none;
}
#right #submenu li a:hover {
	background:url(images/arrow-subnav.gif) no-repeat 180px 8px;
	color:#7793b1;
}
/* mac hide \*/ #right #submenu li a{height:1%;} /* end hide */


/* LINKS
----------------------------------------------------------------- */
a{
	color:#85adbb;
	text-decoration:underline;
}
a:hover{
	color:#a1760b;
	text-decoration:none;
}
#toplinks a{
	color:#908a8a;
	padding:0 10px 0 10px;
	text-decoration:none;
}
#toplinks a:hover{
	color:#b7b1b1;
}
h2 a{
	font-size:0.9em;
	font-weight:normal;
}
#header h1 a{
	display:block;
	height:69px;
	width:208px;
}
#footer a{
	color:#3E4142;
	font-size:0.9em;
	text-decoration:none;
}
#availability h1 a{
	width:200px;
	height:32px;
	display:block;
}
#footer a:hover{
	color:#666;
}
.trioleft h1 a,.trioright h1 a{
	text-decoration:none;
	margin:0;
	padding:0;
}

#submenu h2#map a{
	color:#43657a;
	font-weight:bold;
}

/* CAPETOWN LINKS
----------------------------------------------------------------- */
body#capetownaboutpage #submenu li.capetownabout,
body#daytourspage #submenu li.daytours,
body#apostlespage #submenu li.apostles,
body#campsbaypage #submenu li.campsbay,
body#capecadoganpage #submenu li.capecadogan,
body#capegracepage #submenu li.capegrace,
body#cellarspage #submenu li.cellars,
body#commodorepage #submenu li.commodore,
body#constantiapage #submenu li.constantia,
body#constantiamanorpage #submenu li.constantiamanor,
body#fritzpage #submenu li.fritz,
body#kensingtonpage #submenu li.kensington,
body#mountnelsonpage #submenu li.mountnelson,
body#kloofpage #submenu li.kloof,
body#portswoodpage #submenu li.portswood,
body#tablebaypage #submenu li.tablebay,
body#winchesterpage #submenu li.winchester,

/* WINELANDS LINKS
----------------------------------------------------------------- */
body#winelandsaboutpage #submenu li.winelandsabout,
body#couronnepage #submenu li.couronne,
body#lanzeracpage #submenu li.lanzerac,
body#lequartierpage #submenu li.lequartier,
body#lyngrovepage #submenu li.lyngrove,
body#rusthofpage #submenu li.rusthof,
body#stellenboschpage #submenu li.stellenbosch,
body#erinvalepage #submenu li.erinvale,
body#franschhoekpage #submenu li.franschhoek,
body#lefranschhoekpage #submenu li.lefranschhoek,
body#ouwewerfpage #submenu li.ouwewerf,
body#santepage #submenu li.sante,

/* GARDEN ROUTE LINKS
----------------------------------------------------------------- */
body#gardenrouteaboutpage #submenu li.gardenrouteabout,
body#aubergepage #submenu li.auberge,
body#augustapage #submenu li.augusta,
body#bloomestatepage #submenu li.bloomestate,
body#belviderepage #submenu li.belvidere,
body#fancourtpage #submenu li.fancourt,
body#hunterspage #submenu li.hunters,
body#kynsnapage #submenu li.kynsna,
body#kynsnavillaspage #submenu li.kynsnavillas,
body#kurlandpage #submenu li.kurland,
body#marinepage #submenu li.marine,
body#milkwoodpage #submenu li.milkwood,
body#oceanspage #submenu li.oceans,
body#parkespage #submenu li.parkes,
body#portlandpage #submenu li.portland,
body#stjamespage #submenu li.stjames,
body#tsalapage #submenu li.tsala,
body#westerncapepage #submenu li.westerncape,
body#pezulapage #submenu li.pezula,
body#phantompage #submenu li.phantom,
body#plettenbergpage #submenu li.plettenberg,
body#rothmanpage #submenu li.rothman,

/* JOHANNESBURG LINKS
----------------------------------------------------------------- */
body#johannesburgaboutpage #submenu li.johannesburgabout,
body#intercontinentalpage #submenu li.intercontinental,
body#sunnysidepage #submenu li.sunnyside,
body#michaelangelopage #submenu li.michaelangelo,
body#suncitypage #submenu li.suncity,
body#westcliffpage #submenu li.westcliff,

/* SAFARIS LINKS
----------------------------------------------------------------- */
body#safarisaboutpage #submenu li.safarisabout,
body#blaauwboschpage #submenu li.blaauwbosch,
body#sabipage #submenu li.sabi,
body#garongapage #submenu li.garonga,
body#hippohollowpage #submenu li.hippohollow,
body#kwandepage #submenu li.kwande,
body#kingscamppage #submenu li.kingscamp,
body#leopardhillspage #submenu li.leopardhills,
body#lionsandspage #submenu li.lionsands,
body#madikwehillspage #submenu li.madikwehills,
body#tshukudupage #submenu li.tshukudu,
body#sabipage #submenu li.sabi,
body#shamwaripage #submenu li.shamwari,

/* TOURS LINKS
----------------------------------------------------------------- */
body#toursaboutpage #submenu li.toursabout,
body#bluetrainpage #submenu li.bluetrain,
body#rovosrailpage #submenu li.rovosrail,
body#shongololopage #submenu li.shongololo
{
	/*background:url(images/bground-subnav.gif) no-repeat;*/
	background:#f4f8f9;
	border-bottom:none;
	font-weight:bold;
	line-height:1.3em;
	padding:4px 0;
	padding-left:10px;
}

/* WINELANDS LINKS
----------------------------------------------------------------- */
body.topcapetown a.one{background:transparent url(images/nav-capetown-roll.gif) center no-repeat;}
body.topwinelands a.two{background:transparent url(images/nav-winelands-roll.gif) center no-repeat;}
body.topgarden a.three{background:transparent url(images/nav-garden-roll.gif) center no-repeat;}
body.topjohannesburg a.four{background:transparent url(images/nav-johannesburg-roll.gif) center no-repeat;}
body.topsafaris a.five{background:transparent url(images/nav-safaris-roll.gif) center no-repeat;}
body.toptours a.six{background:transparent url(images/nav-tours-roll.gif) center no-repeat;}

/* TOP NAV LINKS
----------------------------------------------------------------- */
body#exhibitionpagetop #dmenu li#topnav1,
body#conferencepagetop #dmenu li#topnav2,
body#exhibitpagetop #dmenu li#topnav3,
body#awardspagetop #dmenu li#topnav4,
body#magazinepagetop #dmenu li#topnav5,
body#pressepagetop #dmenu li#topnav6,
body#contactpagetop #dmenu li#topnav7
{
	background:#fab974;
	color:#fff;
}

/* HEADINGS
----------------------------------------------------------------- */
h1,h2,h3 {
	font-size: 126%;font-family:Trebuchet MS, Verdana, Arial, Helvetica, sans-serif;
	margin-bottom:10px;
	padding-left:10px;
}
h1{
	color:#47646f;
	font-size:145%;
	font-weight:normal;
}

h2 {font-size: 126%;color:#707070;}
h3 {font-size: 126%;color:#a49c52;}
h4 {font-size: 1em;font-weight:bold;margin-bottom:0;padding-left:10px;}
h5 {font-size: 106%}
h6 {font-size: 96%}

#right h1{
	
	font-size:1.2em;
	font-weight:bold;
	padding-top:5px;
}

#header h1{
	background:url(/images/logo.gif) no-repeat;
	border-bottom:none;
	float:left;
	height:57px;
	margin:20px 0 0 10px;
	text-indent:-9999px;
	width:224px;
}
h1#subscribehome{
	background:url(images/title-subscribe.gif) no-repeat left;
	margin:28px 0 0 12px;
	text-indent:-9999px;
}
h2#subscribehome{
	background:url(images/icon-mail.gif) #dceaf7 no-repeat 13px 9px;
	color:#43657a;
	font-size:1.1em;
	font-weight:bold;
	margin:34px 0 0 0;
	padding:6px 0 5px 35px;
}
h2#subscribe{
	background:url(images/icon-mail.gif) #dceaf7 no-repeat 13px 9px;
	color:#43657a;
	font-size:1.1em;
	font-weight:bold;
	margin:12px 0 0 0;
	padding:6px 0 5px 35px;
}
#submenu h2#map{
	background:url(images/icon-map.gif) #dceaf7 no-repeat 13px 9px;
	color:#43657a;
	font-size:1.1em;
	font-weight:bold;
	margin:12px 0 10px 0;
	padding:6px 0 5px 35px;
}
h1#resources{
	background:url(images/title-resources.gif) no-repeat left;
	margin-left:12px;
	padding:15px 0 0 0;
	text-indent:-9999px;
}
h1#quote{
	background:url(images/title-quote.gif) no-repeat left;
	margin-left:12px;
	padding:15px 0 0 0;
	text-indent:-9999px;
}
h1#peace{
	background:url(images/title-peace.gif) no-repeat left;
	margin-left:12px;
	padding:15px 0 0 0;
	text-indent:-9999px;
}
.samap h1{
	font-size:1.2em;
	padding:0;
}
h1#links{
	background:url(images/title-links.gif) no-repeat left;
	margin-left:12px;
	padding:15px 0 0 0;
	text-indent:-9999px;
}
h1#links,h1#resources,h1#quote,#availability h1,#availability h2,.offers h2,.boxfeature h2,.boxfeature h1,.trioleft h1,.trioright h1,.triorow h2,.triorowlast h2{
	margin-bottom:0;
}
#submenu h2{
	padding-left:8px;
}
.triorow h2,.triorowlast h2,.boxfeature h2{
	font-size: 110%;
}
.trioleft h1,.trioright h1,.trioleft p,.trioright p{
	padding:0 3px 0 8px;
}
.trioleft h1,.trioright h1{
	font-size:1.4em;
	margin-top:7px;
}
.trioleft img,.trioright img{
	margin-top:1px;
}
.boxfeature h1{
	background:#949c6b;
}
.offers h1{
	background:#bac67a;
	color:#fff;
}
.offersinside h1{
	background:#fc9a03 no-repeat;
	color:#fff;
	padding:0 0 5px 10px;
}
.offers h1,.boxfeature h1{
	color:#fff;
	font-size:106%;
	font-weight:bold;
	padding:3px 0 3px 5px;
}
.boxfeature h2,.boxfeature p,.offers h2,.offers p{
	padding:0 0 0 5px;
}
#availability h1{
	background:url(images/title-itinerary.gif) no-repeat;
	/*background:url(images/h1availability.gif) no-repeat;*/
	height:35px;
	/*height:38px;*/
	text-indent:-9999px;
}
#availability h2{
	background:url(images/bground-reservations.gif) no-repeat;
	height:63px;
	text-indent:-9999px;
}

/* TEXT
----------------------------------------------------------------- */
p{
	font-size:1em;
	padding:0 40px 10px 10px;
}
p.nopading{
	padding:0;
}
#right p{
	padding-right:5px;
}

/* LISTS
----------------------------------------------------------------- */
#content ul{
	color:#7c7a7a;
	list-style-type:none;
	padding:5px 0 10px 40px;
}
#content ul li{
	list-style-type:disc;
	padding:0 30px 3px 5px;
}
#content ol{
	color:#7c7a7a;
	padding:5px 30px 13px 30px;
}
#right ul{
	color:#7c7a7a;
	list-style-type:none;
	padding:5px 0 10px 12px;
}
#right ul li{
	background:url(images/bullet.gif) no-repeat left center;
	padding:0 0 3px 20px;
}
.triorow p,.triorowlast p{
	padding-bottom:8px;
}

/* TABLES
----------------------------------------------------------------- */
table {
	border-top: 1px solid #C1DAD7;
	border-left: 1px solid #C1DAD7;
	width:95%;
	padding: 0;
	margin-bottom:20px;
	margin-left:10px;
	
	text-align:left;
}
th {
	color: #4f6b72;
	border-right: 1px solid #C1DAD7;
	border-bottom: 1px solid #C1DAD7;
	text-align: left;
	padding: 6px 6px 6px 10px;
	background: #CAE8EA url(images/bground-table.jpg) no-repeat;
}
th.nobg {
	border-top: 0;
	border-left: 0;
	border-right: 1px solid #C1DAD7;
	background: none;
}
td {
	border-right: 1px solid #C1DAD7;
	border-bottom: 1px solid #C1DAD7;
	background: #fff;
	padding: 6px 6px 6px 10px;
	color: #4f6b72;
}
td.alt {
	background: #fff;
}
th.spec {
	border-top: 0;
	background: #fff;
}
th.specalt {
	border-top: 0;
	background: #f5fafa no-repeat;
	font-weight:normal
}

/* FORMS
----------------------------------------------------------------- */
form#formsearch{
	background:url(images/icon-search-form.gif) no-repeat 120px 28px;
	padding:20px 0 0 0;
	text-align:right;
}
form#formsubscribe{
	background:#fff;
	border-bottom:1px solid #e5e5e5;
	padding:5px 0 20px 0;
	text-align:right;
}
.buttonsearchtop{
	margin-top:5px;
	padding-left:5px;
	padding-right:5px;
	vertical-align:middle;
}
.buttonsubscribe{
	margin-top:5px;
	vertical-align:middle;
}
.searchinput{
	margin:5px 0 0 5px;
	vertical-align:middle;
	width:120px;
	padding:1px;
}
.subscribeinput{
	margin:5px 5px 0 0;
	vertical-align:middle;
	width:105px;
	padding:1px;
}


form#quote
  {
    background-color:#f0f4f6;
    background-repeat:repeat-x;
    background-position:0 0;
    border-bottom:1px solid #c0d0d8;
    margin:10px 10px;
    padding:10px;
	text-align:left;
	width:480px;
	
  }
  fieldset
  {
    border-width:0;
    border-bottom:1px dashed #d0d4d6;
    margin:0 0 20px 0;
    padding:0;
  }
  legend
  {
    color:#204050;
    font:normal bold 115% "lucida sans", serif;
    margin:10px 0 0 0;
    padding:0;
  }
  * html legend
  {
    margin-left:-8px;
    margin-bottom:10px;
  }
  fieldset .field
  {
    border-top:1px dashed #d0d4d6;
    clear:both;
    padding:6px 0;
  }
  fieldset br
  {
    display:none;
  }
  fieldset .field label
  {
    color:#204050;
    display:block;
    float:left;
    margin-right:5px;
    width:215px;
  }
  fieldset .field label .required
  {
    color:#ff0000;
    font-weight:normal;
  }
  fieldset .field input
  {
    max-width:240px;
  }
  fieldset .field textarea
  {
    margin-top:5px;
    
  }
  fieldset .field textarea + .notes
  {
    margin-left:0 !important;
  }
  fieldset .field .notes
  {
    color:#809098;
    font-size:75%;
    margin:2px 0 0 120px;
  }
  input,
  textarea,
  {
    font:normal normal x-small verdana, sans-serif;
    content:"\"}\"";
    content:inherit;
    font-size:small;
  }
  

  html>body input,
  html>body textarea,
  html>body select
  {
    font-size:small;
  }
  input.text,
  textarea
  {
    background:#f8f8f8;
    border:1px solid black;
    border-color:#c0c4c6 #e0e4e6 #e0e4e6 #c0c4c6;
    color:#808486;
    padding:2px 0 2px 4px;
  }
  input.text.highlight,
  textarea.highlight,
  input.text:focus,
  textarea:focus
  {
    background-color:#ffffff;
    background-image:url(/graphics/input-active-background.gif);
    border-color:#a0b0b8;
    color:#204050;
  }




/* MISC
----------------------------------------------------------------- */
.clr{
	clear:both;
	height:1px;
	margin-top:-1px;
	overflow:hidden;
}
.padding{
	padding-left:10px;
}
.horizline{
	border-bottom:1px solid #e2e3e3;
	margin:10px 0 5px 0;
}
.horizline2{
	border-bottom:1px solid #e2e3e3;
	
	width:508px;
}
#print-header,#print-footer{
	display:none;
}
.floatleft{
	float:left;
 }
.floatright{
	float:right;
}
.floatlefthome{
	float:left;
	font-size:0.9em;
}
.floatrighthome{
	float:right;
	padding-right:22px;
	width:166px;
}
.imgfloatright{
	border:5px solid #dde5e7;
	float:right;
	margin:0 20px 10px 10px;
}
#quotebutton {
	float:left;
	position:relative;
	width: 186px;
	height: 36px;
	margin-left:20px;
	padding: 0; 
}
.button1, .button2 {
	float:left;
	position:relative;
	width: 186px;
	height: 36px;
	margin-left:20px;
	padding: 0; 
}
#quotebutton {
	float:left;
	position:relative;
	width: 191px;
	height: 65px;
	margin-left:20px;
	margin-bottom:11px;
	padding: 0; 
}
#quotebutton a {
	width: 191px;
	height: 65px;
	display: block;
	margin: 0;
	padding: 0;
	/*position:absolute;*/
	margin:0;
	cursor:hand;
}
* html .button1, * html .button2, * html #quotebutton {
	margin-left:10px;
}
.button1 {
margin-top:2px;

}
.button1  {background-image: url(images/button-availability-roll.gif);}
.button2  {background-image: url(images/button-book-now-roll.gif);}
#quotebutton  {background-image: url(images/button-quote-roll.gif);}
.button1 a, .button2 a {
	width: 186px;
	height: 36px;
	display: block;
	margin: 0;
	padding: 0;
	/*position:absolute;*/
	margin:0;
	cursor:hand;
}

.button1 a {background-image: url(images/button-availability.gif);}
.button2 a {background-image: url(images/button-book-now.gif);}
#quotebutton a  {background-image: url(images/button-quote.gif);}


.button1 a:hover,.button2 a:hover,#quotebutton a:hover{background:transparent}
.button1 span, .button2 span, #quotebutton span {position:absolute;left:-1000px;top:2px}



/* MAP
----------------------------------------------------------------- */

/* setup the background image of the British Isles */
#content ul.samap {padding:0; margin:0; background:#fff url(images/map-sa2.gif); width:500px; height:500px; margin:0 25px 100px 5px; position:relative; z-index:100;}

/* move the text off screen */
#content ul.samap li a {text-indent:-999px; display:block; width:8px; height:8px; background:#618eaf; position:absolute; line-height:8px;}

#content ul.samap li{list-style-type:none;}

/* make the images and description invisible and an absolute position so that it does not take up any space */
#content ul.samap li a em {visibility:hidden; position:absolute;}

/* position the square markers */
#content ul.samap li a.ct {top:396px; left:86px;}
#content ul.samap li a.sb {top:390px; left:102px;}
#content ul.samap li a.sw {top:410px; left:100px;}
#content ul.samap li a.hm {top:424px; left:107px;}
#content ul.samap li a.fh {top:398px; left:118px;}
#content ul.samap li a.ge {top:412px; left:176px;}
#content ul.samap li a.sd {top:401px; left:154px;}
#content ul.samap li a.ky {top:403px; left:197px;}
#content ul.samap li a.pb {top:405px; left:226px;}
#content ul.samap li a.pe {top:395px; left:267px;}
#content ul.samap li a.jb {top:163px; left:345px;}
#content ul.samap li a.kr {top:149px; left:419px;}

/* move the text back into view on hover */
#content ul.samap li a:hover {background:#618eaf; text-indent:0; height:1.2em; font-size:1em; color:#fff; line-height:1em; padding:2px 10px; width:90px;}

/* hack for IE5.x */
* html #content ul.samap 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 */
#content ul.samap li a:hover em {visibility:visible; margin-left:5px; background:#fff; border:1px solid #618eaf; width:200px; color:#000; padding:15px;font-style:normal; top:-7px; line-height:1.3em;}

/* hack for IE5.x */
* html #content ul.samap li a:hover em {width:200px; w\idth:200px;}

/* give the image a border and margin */
#content ul.samap li a:hover em img {border:1px solid #000; display:block; margin-bottom:10px;}

/* style the empty span (I know it's not semantically correct) into an arrow point */
#content ul.samap 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:#618eaf; position:absolute; left:0; top:0;}

/* hack for IE5.x */
* html #content ul.samap li a:hover em span {width:30px; height:30px; w\idth:0; he\ight:0;}

