html { height: 100%; }
a { text-decoration: none; }
body {
	margin: 0; 								background: url(../images/ht.jpg) fixed;
	height: 100%;							width: 100%;
}
body.bgoff { background: none; }

/* Absolute ********************/
#blackOut {position: absolute;	z-index: 3;}
#SmallYeti, #ContactYeti {
	width: 141px;							position: absolute;
	height: 116px;							background: url(../images/yeti.png);
	top: 60px;								left: 15px;
}
#ContactYeti {top: 120px; left: 220px;}
#Yeti { left: 50px; top: 150px; position: absolute; }
#PageTitle {width:150px;height:40px;position:absolute;left:200px;top:140px;background:no-repeat 0 / contain;}
#Content, #teeGridMapContainer {
	width: 746px;							position: absolute;
	height: 714px;							top: 106px;
	left: 135px;						
}
#Menu, #Menu-mapTop, #Menu-mapBottom {
	width: 55px;							height: 20px;
	position: absolute;					left: 225px;
	top: 191px;								z-index: 5;
	cursor: pointer;						background: url(../images/menu.png) no-repeat;
}
#Menu-mapBottom, #Menu-mapTop {
	width: 33px;							height: 5px;
	background: none;						top: 211px;						
}
#Menu-mapTop {
	left: 247px;							top: 186px;
}
#Links, #LinksBackground {width:295px;background:url(../images/link.rollovers.png) no-repeat 295px 3px;height:255px;position:absolute;left:-57px;top:-53px;}
#LinksBackground {
	background: url(../images/links.back.png) no-repeat;
}
#Links div { position: absolute; background: url(../images/e.png); }
#Links img, #Menu img {
	border: none;
}
#BodyShape {
	width: 1000px;					background: url(../images/body.shape.png) no-repeat;
	height: 1000px;				margin: auto;
	position: relative;
}
#Copyright {
	width: 166px;					background: url(../images/copyright.png) no-repeat;
	height: 25px;					position: absolute;
	bottom: 157px;					left: 500px;
}
#theCnlt {
	width: 187px;					background: url(../images/thecnlt.png) no-repeat;
	height: 30px;					position: absolute;
	bottom: 152px;					left: 300px;
}

.teeSquare {
	width: 168px;					position: absolute;
	height: 168px;
	-webkit-animation-duration: 0.3s;
	-webkit-animation-iteration-count: infinite;
	-webkit-animation-direction: alternate;
	-webkit-animation-timing-function: ease-in-out;
}

@-webkit-keyframes teeWiggle {
	from { -webkit-transform: rotate(-5deg); }
	to { -webkit-transform: rotate(5deg); }
}

#teeGrid11 {top: 117px; left: 1px;} #teeGrid12 {top: 79px; left: 142px;} 
#teeGrid13 {top: 40px; left: 282px;} #teeGrid14 {top: 2px; left: 423px;}

#teeGrid21 {top: 258px; left: 39px;} #teeGrid22 {top: 220px; left: 180px;} 
#teeGrid23 {top: 182px; left: 320px;} #teeGrid24 {top: 143px; left: 460px;}

#teeGrid31 {top: 399px; left: 76px;} #teeGrid32 {top: 361px; left: 217px;} 
#teeGrid33 {top: 323px; left: 358px;} #teeGrid34 {top: 284px; left: 499px;}

#teeGrid41 {top: 540px; left: 114px;} #teeGrid42 {top: 502px; left: 255px;} 
#teeGrid43 {top: 464px; left: 396px;} #teeGrid44 {top: 425px; left: 537px;}

.eventBanners {
	width: 572px;					position: absolute;
	height: 223px;
}

#eventBanner0 {top: 0; left: 0;} #eventBanner1 {top: 70px; left: 19px;}
#eventBanner2 {top: 140px; left: 38px;} #eventBanner3 {top: 210px; left: 57px;}
#eventBanner4 {top: 280px; left: 76px;} #eventBanner5 {top: 350px; left: 95px;}
#eventBanner6 {top: 420px; left: 114px;} #eventBanner7 {top: 490px; left: 133px;}

#AboutUsContent {top: 50px; left: 75px; position: absolute;}

#ContactContent {
	top: 200px;						left: 75px; 
	position: absolute;			background: url(../images/contact.content.png);
	width: 523px;					height: 206px;
}

.divMap {position: absolute;	z-index: 3; cursor: pointer; background: url(../images/e.png); }

#pageNavigation {
	width: 550px; 					height: 29px;	
	position: absolute; 			top: 683px; 
	right: 0px; 					text-align: center;
}
#pageNavigation div {
	padding: 10px;					background: url(../images/page.current.png) no-repeat 0px 2px;
	font-size: 14px;				line-height: 14px;
	opacity: .75;					font-family: Times, "Times New Roman", serif;
	margin: 0px;					display: inline-block;
	cursor: pointer;
}
#pageNavigation a:hover {cursor: pointer;}
.pageCurrent {color: #ee207c;}

#blackOut {
	display: block;					background: url(../images/bg.tintcover.png);
	width: 100%;					height: 0;
	top: 0;							opacity: 0;
	-webkit-transition-property: opacity;
	-webkit-transition-duration: 0.8s;
}
#TornPaper {
	width: 794px;					position: absolute;
	height: 602px;					background: url(../images/expand.tee.png);
	display: block;				z-index: 6;
	left: 100px;					opacity: 0;
	font-family: 'jrhandRegular', Courier;
	-webkit-transition-property: -webkit-transform, opacity;
	-webkit-transform: scale(0.01);
	-webkit-transition-duration: 0.8s;
	-moz-transition-property: -moz-transform, opacity;
	-moz-transform: scale(0.01);
	-moz-transition-duration: 0.8s;
}
#closeButton {
	top: 25px;						position: absolute;
	left: 35px;						cursor: pointer;
}

.wyContent {
	-webkit-transition-property: opacity;
	-webkit-transition-duration: 1s;
	-moz-transition-property: opacity;
	-moz-transition-duration: 1s;
}

/* Admin ***********************************************/
#LoginForm, #EditFrame {
	width: 500px;					text-align: right;
	top: 200px;						position: absolute;
}
#teeAdmin {
	bottom: 70px;						position: absolute;
	right: 240px;
}
#TeeAdmin table { position: absolute; top: 0;}
#TeeAdmin #one { left: 0;  width: 320px; }
#TeeAdmin #two { left: 330px; width: 320px; }
.InputName {
	text-align: right;			padding: 5px;
}
.InputName, .Input, .Input input, #AdminOn, #LoginError, #LoginForm, 
#LoginForm p input, #adminEditEvents {
	font-size: 13px;				font-family: Courier, "Courier New", monotype;
}
#LoginForm p input {
	background: #000000;			height: 16px;
	opacity: .8;					color: #ffffff;
	border: none;
}
#TeeAdmin textarea, .Input,.Input input {
	background: none;				border: 1px solid #eeeeee;
}
.Input {
	padding: 5px;
}
#LoginError {
	color: #ff0000;				position: relative;
	top: 150px;						text-align: center;
}
#AdminOn {
	color: #ff0000;				position: absolute;
	top: 10px;						left: 300px;
	text-align: center;
} #AdminOn span { cursor: pointer; }
#adminSortSelect {
	position: absolute;			top: 650px;
	left: 400px;
}
#adminEditEvents {
	position: absolute;			top: 620px;
	left: 500px;					cursor: pointer;
}
.tpNewDeleteBox {
	left: 150px;					position: absolute;
	top: 165px;						font-family: "Handwriting - Dakota";
	background: #fff;				padding: 4px;
	display: inline;
}
.tpFile {
	padding: 4px; 					font-family: "Handwriting - Dakota";
	bottom: 85px;					position: absolute;
	left: 130px;					background: #fff;
	display: inline;
}
#tpAdmin {
	bottom: 60px;					position: absolute;
	left: 130px;					
}
#tdAdmin {
	font-family: "Handwriting - Dakota";
	background: url(../images/expand.tee.png) center center;
}
.NewImages { overflow: hidden; }

.formAlign {
	width: 350px;					overflow: hidden;
	display: inline-block;		text-align: left;
}
.formAlign input {
	width: inherit;
}


input.hidden { position: absolute; top: -1000px; }

@media only screen and (min-device-pixel-ratio: 2),
       only screen and (-webkit-min-device-pixel-ratio: 2) {
	body {background: url(../images/ht.jpg) fixed 50% / 248px;}
	#BodyShape {width:1053px;height:1053px;background:url(../images/body.shape-2x.png) no-repeat 0 / contain;}
	#Menu {background:url(../images/menu-2x.png) no-repeat 0 / contain;width:52.5px;height:32.5px;top:181px;left:226px;}
	#SmallYeti, #ContactYeti {background:url(../images/yeti-2x.png) no-repeat 0 / contain;}
	#theCnlt {background:url(../images/thecnlt-2x.png) no-repeat 0 / contain;}
	#Copyright {background:url(../images/copyright-2x.png) no-repeat 0 / contain;}
	#Links {background:url(../images/link.rollovers-2x.png) no-repeat 295px / 1400px;}
	#Links, #LinksBackground {left:-59px;top:-42.5px;}
	#pageNavigation div {background:url(../images/page.current-2x.png) no-repeat 0 / contain;}
	#TornPaper {background:url(../images/expand.tee-2x.png) no-repeat 0 / contain;}
	#closeButton {width:13px;height:15px;}
}