﻿
html, body { height: 95%; background-color: #4d4747; padding: 0; margin: 0; }

img { border: none; }

.centered { width: 768px; height: 543px; text-align: center; color: #fff; position: absolute; left: 50%; top: 40%; margin-left: -384px; /* Half the width of the DIV tag */ margin-top: -272px; /* Half the height of the DIV tag */ }

.preload, .statcounter { display: none; }

/* splash page */

.splash { display: block; width: 768px; height: 543px; background: #4d4747 url(img/splash.jpg) no-repeat center top; bottom: 0; left: 0; position: absolute; }

.enter { display: block; width: 80px; height: 30px; bottom: 16px; left: 12px; position: absolute; }

.contact { display: block; width: 125px; height: 50px; bottom: 14px; right: 25px; position: absolute; }

/* archive page - special thanks to Thierry at TJKDesign http://www.tjkdesign.com */

.archive { margin: -30px auto 0 auto; }

.background { display: block; position: relative; width: 768px; height: 522px; background: url(img/background.gif); margin: 60px auto 0 auto; padding: 0; }

.titlebar { display: block; position: relative; width: 768px; height: 60px; margin: 0 auto; }

.year { display: block; width: 79px; height: 60px; margin: 0 auto 0 65px; padding: 0; background: url(img/year.jpg); float: left; }

.name { display: block; width: 158px; height: 60px; margin: 0 0 0 auto; padding: 0; background: url(img/name.jpg); float: right; }

#targets { position: relative; width: 220px; height: 400px; float: right; margin-top: 60px; padding: 0; list-style-type: none; }
#targets a { display: inline; padding: 0; text-decoration: none; }
#targets a:hover { background: transparent; }
#targets a span { display: none; }
#targets a:hover span { display: inline; position: absolute; top: 0; left: -480px; width: 480px; height: 480px; }
#f1 { background: url(img/f1.jpg) no-repeat top left; }
#f2 { background: url(img/f2.jpg) no-repeat top left; }
#f3 { background: url(img/f3.jpg) no-repeat top left; }
#f4 { background: url(img/f4.jpg) no-repeat top left; }
#f5 { background: url(img/f5.jpg) no-repeat top left; }
#f6 { background: url(img/f6.jpg) no-repeat top left; }
#f7 { background: url(img/f7.jpg) no-repeat top left; }
#f8 { background: url(img/f8.jpg) no-repeat top left; }
#f9 { background: url(img/f9.jpg) no-repeat top left; }
#f10 { background: url(img/f10.jpg) no-repeat top left; }
#f11 { background: url(img/f11.jpg) no-repeat top left; }
#f12 { background: url(img/f12.jpg) no-repeat top left; }
#f13 { background: url(img/f13.jpg) no-repeat top left; }
#f14 { background: url(img/f14.jpg) no-repeat top left; }
#f15 { background: url(img/f15.jpg) no-repeat top left; }
#f16 { background: url(img/f16.jpg) no-repeat top left; }
#f17 { background: url(img/f17.jpg) no-repeat top left; }
#f18 { background: url(img/f18.jpg) no-repeat top left; }

#t1 { position: absolute; margin-top: 135px; margin-left: 59px; width: 16px; height: 12px; }
#t1 a:hover span { top: -175px; left: -606px; }

#t2 { position: absolute; margin-top: 122px; margin-left: 44px; width: 16px; height: 12px; }
#t2 a:hover span { top: -163px; left: -591px; }

#t3 { position: absolute; margin-top: 199px; margin-left: 112px; width: 16px; height: 12px; }
#t3 a:hover span { top: -239px; left: -659px; }

#t4 { position: absolute; margin-top: 130px; margin-left: 163px; width: 16px; height: 12px; }
#t4 a:hover span { top: -170px; left: -710px; }

#t5 { position: absolute; margin-top: 143px; margin-left: 163px; width: 16px; height: 12px; }
#t5 a:hover span { top: -183px; left: -710px; }

#t6 { position: absolute; margin-top: 253px; margin-left: 40px; width: 16px; height: 12px; }
#t6 a:hover span { top: -293px; left: -587px; }

#t7 { position: absolute; margin-top: 350px; margin-left: 105px; width: 16px; height: 12px; }
#t7 a:hover span { top: -390px; left: -652px; }

#t8 { position: absolute; margin-top: 233px; margin-left: 200px; width: 16px; height: 12px; }
#t8 a:hover span { top: -273px; left: -747px; }

#t9 { position: absolute; margin-top: 292px; margin-left: 202px; width: 16px; height: 12px; }
#t9 a:hover span { top: -332px; left: -749px; }

#t10 { position: absolute; margin-top: 307px; margin-left: 198px; width: 24px; height: 12px; }
#t10 a:hover span { top: -347px; left: -745px; }

#t11 { position: absolute; margin-top: 323px; margin-left: 198px; width: 24px; height: 12px; }
#t11 a:hover span { top: -363px; left: -745px; }

#t12 { position: absolute; margin-top: 93px; margin-left: -3px; width: 24px; height: 12px; }
#t12 a:hover span { top: -133px; left: -544px; }

#t13 { position: absolute; margin-top: 106px; margin-left: -3px; width: 24px; height: 12px; }
#t13 a:hover span { top: -146px; left: -544px; }

#t14 { position: absolute; margin-top: 119px; margin-left: -3px; width: 24px; height: 12px; }
#t14 a:hover span { top: -159px; left: -544px; }

#t15 { position: absolute; margin-top: 132px; margin-left: -3px; width: 24px; height: 12px; }
#t15 a:hover span { top: -172px; left: -544px; }

#t16 { position: absolute; margin-top: 143px; margin-left: 194px; width: 24px; height: 12px; }
#t16 a:hover span { top: -183px; left: -741px; }

#t17 { position: absolute; margin-top: 21px; margin-left: 72px; width: 24px; height: 12px; }
#t17 a:hover span { top: -61px; left: -619px; }

#t18 { position: absolute; margin-top: 322px; margin-left: 170px; width: 24px; height: 12px; }
#t18 a:hover span { top: -362px; left: -717px; }

