
body { text-align: center }
html { overflow: scroll }
#wrapper { text-align: left; margin-right: auto; margin-left: auto; position: relative; width: 780px; height: 10px }
#logo { background: url(images/logo.gif); visibility: visible; position: absolute; z-index: 1; top: 0; left: 0; width: 420px; height: 125px }
#main    { visibility: visible; position: absolute; z-index: 0; top: -17px; left: 0; width: 780px; height: auto }
#weather    { visibility: visible; position: absolute; z-index: 1; top: 20px; left: 680px; width: 35px; height: auto }
#home { visibility: visible; position: absolute; z-index: 2; top: 65px; left: 566px; width: 36px; height: 19px }
#about { visibility: visible; position: absolute; z-index: 2; top: 65px; left: 602px; width: 56px; height: 19px }
#contact { visibility: visible; position: absolute; z-index: 2; top: 65px; left: 658px; width: 67px; height: 19px }
#feedback { visibility: visible; position: absolute; z-index: 2; top: 65px; left: 725px; width: 55px; height: 19px }
#mainpic { visibility: visible; position: absolute; z-index: 3; top: 148px; left: 0; width: 780px; height: 187px }
#maincontent { visibility: visible; position: absolute; z-index: 5; top: 418px; left: 0; width: 782px; height: auto }
#join { visibility: visible; position: absolute; z-index: 3; top: 123px; left:0px; width: 164px; height: 25px }
#gallery { visibility: visible; position: absolute; z-index: 3; top: 123px; left: 164px; width: 110px; height: 25px }
#links { visibility: visible; position: absolute; z-index: 3; top: 123px; left: 274px; width: 157px; height: 25px }
#shop { visibility: visible; position: absolute; z-index: 3; top: 123px; left: 407px; width: 69px; height: 25px }
#e-magazine { visibility: visible; position: absolute; z-index: 3; top: 123px; left: 431px; width: 132px; height: 25px }
#archive { visibility: visible; position: absolute; z-index: 3; top: 123px; left: 563px; width:115px; height: 25px }
#forum { visibility: visible; position: absolute; z-index: 3; top: 123px; left: 678px; width: 102px; height: 25px }
#thesociety { visibility: visible; position: absolute; z-index: 4; top: 341px; left: 0; width: 195px; height: 73px }
#yourramsgate   { visibility: visible; position: absolute; z-index: 4; top: 341px; left: 195px; width: 195px; height: 73px }
#aboutramsgate { visibility: visible; position: absolute; z-index: 4; top: 341px; left: 195px; width: 195px; height: 73px }
#events { visibility: visible; position: absolute; z-index: 4; top: 341px; left: 390px; width: 195px; height: 73px }
#articles { visibility: visible; position: absolute; z-index: 4; top: 341px; left: 585px; width: 195px; height: 73px }
#gullslink { visibility: visible; position: absolute; z-index: 4; top: 310px; left: 701px; width: 79px; height: 25px }
#ramsgate-links { visibility: visible; position: absolute; z-index: 4; top: 110px; left: 215px; width:375px; height: 25px }


.title-society   { color: #ADA40A; font-size: 17px; font-family: Tahoma }
.title-articles   { color: #3C6DB0; font-size: 17px; font-family: Tahoma }

.title-society-sml { color: #ADA40A; font-size: 14px; font-family: Tahoma }
.title-events { color: #96892D; font-size: 17px; font-family: Tahoma }
.title-yourramsgate { color: #669FA3; font-size: 17px; font-family: Tahoma }
.titlesmall { color: black; font-size: 14px; font-family: Tahoma }
.titlesmallbold  { color: black; font-size: 12px; font-family: Tahoma; font-weight: 700; line-height: 16px }
a.gulls-link span { display: none }
.maintext { color: black; font-size: 12px; font-family: Tahoma }
.maintext2 { color: black; font-size: 12px; font-family: Tahoma }
.maintextlist  { color: black; font-size: 12px; font-family: Tahoma; list-style-type: disc; list-style-image: url(/images/green-bullet.gif) }
.maintextitalic { color: black; font-size: 12px; font-family: Tahoma; font-style: italic }
.maintextitalicevents { color: #96892d; font-size: 12px; font-family: Tahoma; font-style: italic }
.maintextevents { color: #96892d; font-size: 12px; font-family: Tahoma; }

.signature { color: black; font-size: 11px; font-family: Tahoma; font-style: italic; font-weight: bold }
.maintext-link     { color: #9d9283; font-size: 12px; font-family: Tahoma; line-height: 18px }
.maintext-linkblue     { color: #3C6DB0; font-size: 12px; font-family: Tahoma; line-height: 18px }
.maintext-greenlink     { color: #ADA40A; font-size: 12px; font-family: Tahoma; line-height: 18px }
.maintext-blue     { color: #3C6DB0; font-size: 17px; font-family: Tahoma; line-height: 18px }

a.chairpersons { background: url(links/chairpersons.gif); display: block; width: 188px; height: 21px; text-indent:-1500px; overflow:hidden; }
a.chairpersons span { display: none }
a.chairpersons:hover { background: url(links/chairpersons.gif) 0 -21px }
a.chairpersons-title { background: url(links/chairpersons-title.gif); display: block; width: 188px; height: 21px; text-indent:-1500px; overflow:hidden; }

a.our-role { background: url(links/our-role.gif); display: block; width: 188px; height: 21px; text-indent:-1500px; overflow:hidden; }
a.our-role span { display: none }
a.our-role:hover { background: url(links/our-role.gif) 0 -21px }
a.our-role-title { background: url(links/our-role-title.gif); display: block; width: 188px; height: 21px; text-indent:-1500px; overflow:hidden; }

a.committee { background: url(links/committee.gif); display: block; width: 188px; height: 21px; text-indent:-1500px; overflow:hidden;  }
a.committee span { display: none }
a.committee:hover { background: url(links/committee.gif) 0 -21px }
a.committee-title { background: url(links/commitee-title.gif); display: block; width: 188px; height: 21px; text-indent:-1500px; overflow:hidden; }

a.constitution { background: url(links/constitution.gif); display: block; width: 188px; height: 21px; text-indent:-1500px; overflow:hidden;  }
a.constitution span { display: none }
a.constitution:hover { background: url(links/constitution.gif) 0 -21px }
a.constitution-title { background: url(links/constitution-title.gif); display: block; width: 188px; height: 21px; text-indent:-1500px; overflow:hidden; }

a.contribute { background: url(links/contribute.gif); display: block; width: 188px; height: 21px; text-indent:-1500px; overflow:hidden; }
a.contribute span { display: none }
a.contribute:hover { background: url(links/contribute.gif) 0 -21px }
a.contribute-title  { background: url(links/contribute-sml-title.gif); display: block; width: 188px; height: 21px; text-indent:-1500px; overflow:hidden; }

a.ramsgate-history { background: url(links/ramsgate-history.gif); display: block; width: 188px; height: 21px; text-indent:-1500px; overflow:hidden;  }
a.ramsgate-history span { display: none }
a.ramsgate-history:hover { background: url(links/ramsgate-history.gif) 0 -21px }
a.ramsgate-history-title { background: url(links/ramsgate-history-title.gif); display: block; width: 188px; height: 21px; text-indent:-1500px; overflow:hidden; }

a.then-and-now { background: url(links/then-and-now.gif); display: block; width: 188px; height: 21px; text-indent:-1500px; overflow:hidden;  }
a.then-and-now span { display: none }
a.then-and-now:hover { background: url(links/then-and-now.gif) 0 -21px }
a.then-and-now-title { background: url(links/then-and-now-title.gif); display: block; width: 188px; height: 21px; text-indent:-1500px; overflow:hidden; }

a.historic-buildings { background: url(links/historic-buildings.gif); display: block; width: 188px; height: 21px; text-indent:-1500px; overflow:hidden;  }
a.historic-buildings span { display: none }
a.historic-buildings:hover { background: url(links/historic-buildings.gif) 0 -21px }
a.historic-buildings-title { background: url(links/historic-buildings-title.gif); display: block; width: 188px; height: 21px; text-indent:-1500px; overflow:hidden; }

a.buildings-at-risk { background: url(links/buildings-at-risk.gif); display: block; width: 188px; height: 21px; text-indent:-1500px; overflow:hidden;  }
a.buildings-at-risk span { display: none }
a.buildings-at-risk:hover { background: url(links/buildings-at-risk.gif) 0 -21px }
a.buildings-at-risk-title { background: url(links/buildings-at-risk-title.gif); display: block; width: 188px; height: 21px; text-indent:-1500px; overflow:hidden; }

a.planning-matters { background: url(links/planning-matters.gif); display: block; width: 188px; height: 21px; text-indent:-1500px; overflow:hidden;  }
a.planning-matters span { display: none }
a.planning-matters:hover { background: url(links/planning-matters.gif) 0 -21px }
a.planning-matters-title { background: url(links/planning-matters-title.gif); display: block; width: 188px; height: 21px; text-indent:-1500px; overflow:hidden; }

a.pdf { background: url(links/pdf-icon.gif); display: block; width: 89px; height: 40px; text-indent:-1500px; overflow:hidden;  }
a.pdf span { display: none }
a.pdf:hover { background: url(links/pdf-icon.gif) 0 -40px }

a.events-title { background: url(events/calendar-of-events.gif); display: block; width: 195px; height: 21px; text-indent:-1500px; overflow:hidden; }

a.march { background: url(events/march.gif); display: block; width: 195px; height: 21px; text-indent:-1500px; overflow:hidden; }
a.march span { display: none }
a.march:hover { background: url(events/march.gif) 0 -21px }
a.march-title { background: url(events/march-title.gif); display: block; width: 195px; height: 21px; text-indent:-1500px; overflow:hidden; }

a.april { background: url(events/april.gif); display: block; width: 195px; height: 21px; text-indent:-1500px; overflow:hidden;  }
a.april span { display: none }
a.april:hover { background: url(events/april.gif) 0 -21px }
a.april-title  { background: url(events/april-title.gif); display: block; width: 195px; height: 21px; text-indent:-1500px; overflow: hidden }

a.may { background: url(events/may.gif); display: block; width: 195px; height: 21px; text-indent:-1500px; overflow:hidden;  }
a.may span { display: none }
a.may:hover { background: url(events/may.gif) 0 -21px }
a.may-title  { background: url(events/may-title.gif); display: block; width: 195px; height: 21px; text-indent:-1500px; overflow: hidden }

a.june { background: url(events/june.gif); display: block; width: 195px; height: 21px; text-indent:-1500px; overflow:hidden;  }
a.june span { display: none }
a.june:hover { background: url(events/june.gif) 0 -21px }
a.june-title  { background: url(events/june-title.gif); display: block; width: 195px; height: 21px; text-indent:-1500px; overflow: hidden }

a.july { background: url(events/july.gif); display: block; width: 195px; height: 21px; text-indent:-1500px; overflow:hidden;  }
a.july span { display: none }
a.july:hover { background: url(events/july.gif) 0 -21px }
a.july-title { background: url(events/july-title.gif); display: block; width: 195px; height: 21px; text-indent:-1500px; overflow:hidden; }

a.august { background: url(events/august.gif); display: block; width: 195px; height: 21px; text-indent:-1500px; overflow:hidden;  }
a.august span { display: none }
a.august:hover { background: url(events/august.gif) 0 -21px }
a.august-title { background: url(events/august-title.gif); display: block; width: 195px; height: 21px; text-indent:-1500px; overflow:hidden; }

a.september { background: url(events/september.gif); display: block; width: 195px; height: 21px; text-indent:-1500px; overflow:hidden;  }
a.september span { display: none }
a.september:hover { background: url(events/september.gif) 0 -21px }
a.september-title { background: url(events/september-title.gif); display: block; width: 195px; height: 21px; text-indent:-1500px; overflow:hidden; }

a.october { background: url(events/october.gif); display: block; width: 195px; height: 21px; text-indent:-1500px; overflow:hidden;  }
a.october span { display: none }
a.october:hover { background: url(events/october.gif) 0 -21px }
a.october-title { background: url(events/october-title.gif); display: block; width: 195px; height: 21px; text-indent:-1500px; overflow:hidden; }

a.november { background: url(events/november.gif); display: block; width: 195px; height: 21px; text-indent:-1500px; overflow:hidden;  }
a.november span { display: none }
a.november:hover { background: url(events/november.gif) 0 -21px }
a.november-title { background: url(events/november-title.gif); display: block; width: 195px; height: 21px; text-indent:-1500px; overflow:hidden; }

a.december { background: url(events/december.gif); display: block; width: 195px; height: 21px; text-indent:-1500px; overflow:hidden;  }
a.december span { display: none }
a.december:hover { background: url(events/december.gif) 0 -21px }
a.december-title { background: url(events/december-title.gif); display: block; width: 195px; height: 21px; text-indent:-1500px; overflow:hidden; }

a.january { background: url(events/january.gif); display: block; width: 195px; height: 21px; text-indent:-1500px; overflow:hidden;  }
a.january span { display: none }
a.january:hover { background: url(events/january.gif) 0 -21px }
a.january-title { background: url(events/january-title.gif); display: block; width: 195px; height: 21px; text-indent:-1500px; overflow:hidden; }

a.february { background: url(events/february.gif); display: block; width: 195px; height: 21px; text-indent:-1500px; overflow:hidden;  }
a.february span { display: none }
a.february:hover { background: url(events/february.gif) 0 -21px }
a.february-title { background: url(events/february-title.gif); display: block; width: 195px; height: 21px; text-indent:-1500px; overflow:hidden; }

a.join { background: url(links/join.gif); display: block; width: 164px; height: 25px; text-indent:-1500px; overflow:hidden; }
a.join span { display: none }
a.join:hover { background: url(links/join.gif) 0 -25px }
a.gallery { background: url(links/gallery.gif); display: block; width: 110px; height: 25px; text-indent:-1500px; overflow:hidden; }
a.gallery span { display: none }
a.gallery:hover { background: url(links/gallery.gif) 0 -25px }
a.links { background: url(links/links.gif); display: block; width: 157px; height: 25px; text-indent:-1500px; overflow:hidden; }
a.links span { display: none }
a.links:hover { background: url(links/links.gif) 0 -25px }
a.shop { background: url(links/shop.gif); display: block; width: 69px; height: 25px; text-indent:-1500px; overflow:hidden; }
a.shop span { display: none }
a.shop:hover { background: url(links/shop.gif) 0 -25px }
a.e-magazine { background: url(links/e-magazine.gif); display: block; width: 132px; height: 25px; text-indent:-1500px; overflow:hidden; }
a.e-magazine span { display: none }
a.e-magazine:hover { background: url(links/e-magazine.gif) 0 -25px }
a.archive { background: url(links/archive.gif); display: block; width: 115px; height: 25px; text-indent:-1500px; overflow:hidden; }
a.archive span { display: none }
a.archive:hover { background: url(links/archive.gif) 0 -25px }
a.forum { background: url(links/forum.gif); display: block; width: 102px; height: 25px; text-indent:-1500px; overflow:hidden; }
a.forum span { display: none }
a.forum:hover { background: url(links/forum.gif) 0 -25px }
a.home { background: url(links/home.gif); display: block; width: 36px; height: 19px; text-indent:-1500px; overflow:hidden; }
a.home span { display: none }
a.home:hover  { background: url(links/home.gif) 0 -19px }
a.about { background: url(links/about.gif); display: block; width: 56px; height: 19px; text-indent:-1500px; overflow:hidden; }
a.about span { display: none }
a.about:hover { background: url(links/about.gif) 0 -19px }
a.contact { background: url(links/contact.gif); display: block; width: 67px; height: 19px; text-indent:-1500px; overflow:hidden; }
a.contact span { display: none }
a.contact:hover { background: url(links/contact.gif) 0 -19px }
a.feedback { background: url(links/feedback.gif); display: block; width: 55px; height: 19px; text-indent:-1500px; overflow:hidden; }
a.feedback span { display: none }
a.feedback:hover { background: url(links/feedback.gif) 0 -19px }
a.thesociety { background: url(links/society.gif); display: block; width: 195px; height: 73px; text-indent:-1500px; overflow:hidden; }
a.thesociety span { display: none }
a.thesociety:hover { background: url(links/society.gif) 0 -73px }
a.yourramsgate { background: url(links/yourramsgate.gif); display: block; width: 195px; height: 73px; text-indent:-1500px; overflow:hidden; }
a.yourramsgate span { display: none }
a.yourramsgate:hover { background: url(links/yourramsgate.gif) 0 -73px }
a.events { background: url(links/events.gif); display: block; width: 195px; height: 73px; text-indent:-1500px; overflow:hidden; }
a.eventsspan { display: none }
a.events:hover { background: url(links/events.gif) 0 -73px }
a.articles { background: url(links/articles.gif); display: block; width: 195px; height: 73px; text-indent:-1500px; overflow:hidden; }
a.articles span { display: none }
a.articles:hover { background: url(links/articles.gif) 0 -73px }
a.membershiprenewal { background: url(links/membership-renewal.gif); display: block; width: 195px; height: 135px; text-indent:-1500px; overflow:hidden; }
a.membershiprenewal span { display: none }
a.membershiprenewal:hover { background: url(links/membership-renewal.gif) 0 -135px }
a.library-news { background: url(links/library-opens-2.gif); display: block; width: 195px; height: 135px; text-indent:-1500px; overflow:hidden; }
a.library-news span { display: none }
a.library-news:hover { background: url(links/library-opens-2.gif) 0 -135px }
a.destiny { background: url(links/destiny.gif); display: block; width: 195px; height: 133px; text-indent:-1500px; overflow:hidden; }
a.destiny span { display: none }
a.destiny:hover { background: url(links/destiny.gif) 0 -133px }
a.shelter { background: url(links/shelter.gif); display: block; width: 195px; height: 130px; text-indent:-1500px; overflow:hidden; }
a.shelter span { display: none }
a.shelter:hover { background: url(links/shelter.gif) 0 -130px }
a.school { background: url(links/school.gif); display: block; width: 195px; height: 130px; text-indent:-1500px; overflow:hidden; }
a.school span { display: none }
a.school:hover { background: url(links/school.gif) 0 -130px }
a.revisedcore { background: url(links/revised-core.gif); display: block; width: 195px; height: 133px; text-indent:-1500px; overflow:hidden; }
a.revisedcore span { display: none }
a.revisedcore:hover { background: url(links/revised-core.gif) 0 -133px }
a.sport { background: url(links/sport-button.gif); display: block; width: 195px; height: 100px; text-indent:-1500px; overflow:hidden; float: right;}
a.sport span { display: none }
a.sport:hover { background: url(links/sport-button.gif) 0 -100px }

#news { visibility: visible; position: absolute; top: 0px; left: 215px; width: 100px; height: 41px }
a.news { background: url(links/news-button.gif); display: block; width: 100px; height: 41px; text-indent:-1500px; overflow:hidden;}
a.news span { display: none }
a.news:hover { background: url(links/news-button.gif) 0 -41px }

#community { visibility: visible; position: absolute; top: 0px; left: 338px; width: 100px; height: 41px }
a.community { background: url(links/community-button.gif); display: block; width: 100px; height: 41px; text-indent:-1500px; overflow:hidden;}
a.community span { display: none }
a.community:hover { background: url(links/community-button.gif) 0 -41px }

#local { visibility: visible; position: absolute; top: 0px; left: 460px; width: 100px; height: 41px }
a.local { background: url(links/local-button.gif); display: block; width: 100px; height: 41px; text-indent:-1500px; overflow:hidden;}
a.local span { display: none }
a.local:hover { background: url(links/local-button.gif) 0 -41px }

#art { visibility: visible; position: absolute; top: 50px; left: 215px; width: 100px; height: 41px }
a.art { background: url(links/art-button.gif); display: block; width: 100px; height: 41px; text-indent:-1500px; overflow:hidden;}
a.art span { display: none }
a.art:hover { background: url(links/art-button.gif) 0 -41px }

#amenities { visibility: visible; position: absolute; top: 50px; left: 338px; width: 100px; height: 41px }
a.amenities { background: url(links/amenities-button.gif); display: block; width: 100px; height: 41px; text-indent:-1500px; overflow:hidden;}
a.amenities span { display: none }
a.amenities:hover { background: url(links/amenities-button.gif) 0 -41px }

#venues { visibility: visible; position: absolute; top: 50px; left: 460px; width: 100px; height: 41px }
a.venues { background: url(links/venues-button.gif); display: block; width: 100px; height: 41px; text-indent:-1500px; overflow:hidden;}
a.venues span { display: none }
a.venues:hover { background: url(links/venues-button.gif) 0 -41px }






a.grandturk1-link { background: url(photos/GrandTurk1-link.jpg); display: block; width: 81px; height: 24px; text-indent:-1500px; overflow:hidden;  }
a.grandturk1-link span { display: none }
a.grandturk1-link:hover { background: url(photos/GrandTurk1-link.jpg) 0 -24px }

a.Ramsgate-Glasshouse_link { background: url(photos/Ramsgate-Glasshouse_link.jpg); display: block; width: 81px; height: 24px; text-indent:-1500px; overflow:hidden;  }
a.Ramsgate-Glasshouse_link span { display: none }
a.Ramsgate-Glasshouse_link:hover { background: url(photos/Ramsgate-Glasshouse_link.jpg) 0 -24px }

a.gulls-link { background: url(links/gulls-link.gif); display: block; width: 79px; height: 25px; text-indent:-1500px; overflow:hidden;  }
a.gulls-link:hover { background: url(links/gulls-link.gif) 0 -25px }

a.pomegranate { background: url(links/pomegranate.gif); display: block; width: 285px; height: 25px; text-indent:-1500px; overflow:hidden; }
a.pomegranate span { display: none }
a.pomegranate:hover { background: url(links/pomegranate.gif) 0 -25px }
.titlesmallbold2 { color: black; font-size: 12px; font-family: Tahoma; font-weight: 700; line-height: 28px }

