/* =========================== elements ============================= */

body { 
	background: #d2d1c5 url(../img/bg.png) repeat-x 0 0;
	font: normal 12px "Trebuchet MS", Tahoma, Verdana, sans-serif;
	color: #000; overflow-x: hidden;
}

p {
	margin-bottom: 15px;
}

a:link, a:visited { 
	color: #066; 
	text-decoration: none; 
}
a:link:hover, a:visited:hover, a:active, a:focus {
	text-decoration: underline; 
}

img {
	display: block;
}
a img {
	border: none;
}


// Underordered Lists
ul {
	margin-left: 10px;
	list-style: circle;
}
ul li {
	margin-bottom: 5px;
}


// Ordered lists
ol {
	margin-left: 10px;
	list-style: circle;
}
ol li {
	margin-bottom: 5px;
}


// Definition Lists
dl { 
}

dt { 
	float: left; 
	clear: left;
} 
dt:after { 
	content: ":"; 
} 

dd { 
	margin: 0 0 0 110px; 
	padding: 0 0 0.5em 0;
}

/* ========================= elements end =========================== */

/* ============================ layout ============================== */

.clearfix:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; }
.clearfix{ display: inline-table; }
.clearfix{ display: block; }
.clearfix{ height: 1%; } /* IE */

.holder { 
	width: 1000px;
	margin: 0 auto;
	position: relative;
}


/* ========================== layout end ============================ */

/* ============================ header ============================== */

#logo {
	background: url(../img/tweelove.gif) no-repeat;
	width: 325px; height: 121px; display: block; text-indent: -2009%; 
	position: absolute; right: 0px; top: 31px; z-index: 2;
}
#logo span {
	width: 325px; height: 121px; display: block;
}

#clouds {
	background: url(../img/clouds.gif) no-repeat;
	width: 1022px; height: 213px; position: absolute;
	top: 0; left: 0; z-index: 0;
}

h2#aural {
	height: 0px;
	text-indent: -2009px;
}


/* ========================== header end ============================ */

/* =========================== tweeter ============================== */

#i {
	background: url(../img/I.gif) no-repeat;
	width: 102px; height: 55px;
	position: absolute; left: 230px; top: 246px;
	z-index: 3;
}

#pick {
	background: url(../img/pick.gif) no-repeat;
	width: 253px; height: 91px;
	position: absolute; left: 350px; top: 119px;
	z-index: 3;
}

#enterrecip {	
	background: url(../img/enter-recip.gif) no-repeat;
	width: 193px; height: 106px;
	position: absolute; left: 30px; top: 171px;
	z-index: 3;
}

#message {	
	background: url(../img/message.gif) no-repeat;
	width: 253px; height: 73px;
	position: absolute; right: 106px; top: 176px;
	z-index: 3;
}


#type {
	width: 320px; height: 200px;
	position: absolute; top: 220px; left: 270px;
	z-index: 999;
}

#love {
	background: url(../img/love.gif) no-repeat 0 0;
	width: 93px; height: 37px; display: block;
	position: absolute; top: 7px; left: 81px;
	z-index: 9999;  cursor: pointer;
}
a#love:hover {
	background-position: 0 -38px;
}


#like {
	background: url(../img/like.gif) no-repeat;
	width: 58px; height: 45px; display: block;
	position: absolute; top: 0px; left: 216px;
	z-index: 9999;  cursor: pointer;
}
a#like:hover {
	background-position: 0 -45px;
}

a#appreciate {
	background: url(../img/appreciate.gif) no-repeat;
	width: 145px; height: 53px; display: block;
	position: absolute; top: 53px; left: 71px;
	z-index: 9999;  cursor: pointer;
}
a#appreciate:hover {
	background-position: 0 -52px;
}

#think {
	background: url(../img/think.gif) no-repeat;
	width: 111px; height: 66px; display: block;
	position: absolute; top: 86px; left: 204px;
	z-index: 9999;  cursor: pointer;
}
a#think:hover {
	background-position: 0 -67px;
}

#thank {
	background: url(../img/thank.gif) no-repeat;
	width: 213px; height: 38px; display: block;
	position: absolute; top: 119px; left: 0px;
	z-index: 9999;  cursor: pointer;
}
a#thank:hover {
	background-position: 0 -38px;
}

#glad {
	background: url(../img/glad.gif) no-repeat;
	width: 82px; height: 26px; display: block;
	position: absolute; top: 171px; left: 50px;
	z-index: 9999;  cursor: pointer;
}
a#glad:hover {
	background-position: 0 -26px;
}

#happy {
	background: url(../img/happy.gif) no-repeat;
	width: 142px; height: 33px; display: block;
	position: absolute; top: 172px; left: 169px;
	z-index: 9999;  cursor: pointer;
}
a#happy:hover {
	background-position: 0 -33px;
}



#recipient {
	background: url(../img/recip-input.gif) no-repeat;
	width: 207px; height: 43px;
	position: absolute; top: 274px; left: 0px;
}
#recipient input {
	border: 0; background: none; width: 170px;
	position: relative; left: 30px; top: 10px;
	font-size: 16px; font-family: Georgia; font-style: italic;
}



#msg {
	background: url(../img/message-input.gif) no-repeat;
	width: 331px; height: 110px;
	position: absolute; right: 67px; top: 260px;
}

#charCount {
	display: block;
	position: absolute; right: 110px; top: 120px;
	text-align: right; width: 150px;
}
#charCount strong {
	font-weight: bold;
	color: #811b1b;
}

#msg #i-start {
	font-family: Georgia;
	font-size: 18px;
	font-style: italic;
}

#i-start span {
	color: #999999;
}
#i-start #type-start {
	color: #ff0066;
}
#i-start #user-start, #i-start #at {
	color: #006699;
}


#msg textarea {
	position: absolute; left: 25px; top: 30px;
	width: 272px; height: 60px;
	background: none; overflow-x: hidden; border: 0;
	font-family: Georgia; font-style: italic;
	line-height: 32px; font-size: 14px;
}

#submit-btn {
	background: url(../img/submit-btn.gif) no-repeat;
	width: 103px; height: 28px; border: 0;  cursor: pointer;
	position: absolute; right: 67px; top: 373px;
	
}


/* ========================= tweeter end ============================ */

/* ============================ content ============================= */

#aggregator {
	background: url(../img/wires.gif) repeat-x 0 45px;
	position: absolute; top: 415px; left: 0;
	width: 100%; height: 400px; position: relative; z-index: -6;
}

#bird-wire {
	background: url(../img/bird-wire.png) no-repeat;
	width: 999px; height: 36px; z-index: 1;
	position: absolute; left: 0; top: 45px;
}

#pole-left {
	background: url(../img/pole-left.gif) no-repeat;
	width: 82px; height: 431px; z-index: -1;
	position: absolute; left: -25px; top: 5px;
}

#pole-right {
	background: url(../img/pole-right.gif) no-repeat;
	width: 106px; height: 420px; z-index: -1;
	position: absolute; right: -15px; top: 5px;
}

#birds-1 {
	background: url(../img/birds-1.gif) no-repeat;
	width: 176px; height: 45px;
	position: absolute; left: -35px; top: 18px;
}
#birds-2 {
	background: url(../img/birds-2.gif) no-repeat;
	width: 217px; height: 51px;
	position: absolute; left: -227px; top: 16px;
}


#msg-1 {
	background: url(../img/msg1-bg.png) no-repeat;
	width: 221px; height: 200px;
	position: absolute; left: 75px; top: 55px;
	z-index: 2;
}
#msg-2 {
	background: url(../img/msg2-bg.png) no-repeat;
	width: 234px; height: 220px;
	position: absolute; left: 285px; top: 60px;
	z-index: 2;
}
#msg-3 {
	background: url(../img/msg3-bg.png) no-repeat;
	width: 202px; height: 187px;
	position: absolute; right: 285px; top: 57px;
	z-index: 2;
}
#msg-4 {
	background: url(../img/msg4-bg.png) no-repeat;
	width: 200px; height: 187px;
	position: absolute; right: 75px; top: 55px;
	z-index: 2;
}


#greetings {
}
#greetings li {
	width: 150px; height: 220px;
	margin-right: 70px;
	font-family: Georgia;
	font-size: 14px;
	color: #666666;
}
#greetings li a { color: #00717e; }

#messages {
	background: url(../img/messages.png) no-repeat;
	width: 999px; height: 242px;
	position: absolute; left: 0px; top: 45px;
	z-index: -5;
}

/* =========================== content end ========================== */

/* ============================= footer ============================= */

#shadow {
	background: url(../img/shadow.png) no-repeat;
	width: 1657px; height: 373px; margin: 0 auto;
	position: absolute; top: 815px; left: 50%;
	margin-left: -805px; z-index: -20;
}

#footer {
	position: absolute; top: 455px; left: 6px;
	font-family: Georgia; color: #666;
	font-size: 14px;
}
#footer a {
	color: #ff0066;
}

#footer li {
	float: left;
	padding-right: 15px;
}
#footer li img {
	display: inline;
	vertical-align: middle;
	padding-right: 2px;
}

#disclaimer {
	line-height: 38px;
	margin-left: 100px;
}

/* =========================== footer end =========================== */