html {
	padding: 0px;
	margin: 0px auto;
	background: #f5fafa;
}
body {
	padding: 0px;
	margin: 0px auto;
	width: 965px;
	background: #f5fafa;
}
body#iframe {
	width: 560px;
}

/*** header start ***/
h2#header-logo {
	margin: 0px;
	padding: 0px;
	float: left;
}
h2#header-logo a {
	background-image: url('images/paperbeatsinternet_logo.jpg');
	background-repeat: no-repeat;
	display: block;
	height: 200px;
	width: 289px;
	outline: none;
	text-indent: -10000px;

}
h2#header-logo a:hover, h2#header-logo a:focus {
	background-position: 0px -200px;
}

ul#nav {
	float: left;
	width: 676px;
	height: 174px;
	background-image: url('images/nav-bg.jpg');
	padding: 0px;
	margin: 0px;
}

ul#nav li {
	list-style: none;
	float: left;
	padding-top: 60px;
}
ul#nav li a {
	text-decoration: none;
	color: black;
	background-repeat: no-repeat;
	display: block;
	outline: none;
}
ul#nav li a#nav-signin {
	background-image: url('images/nav-signin.gif');
	height: 54px;
	width: 113px;
	text-indent: -10000px;
}
ul#nav li a#nav-signin:hover, ul#nav li a#nav-signin:focus, ul#nav.nav-signin li a#nav-signin {
	background-position: 0px -54px;
}
ul#nav li a#nav-about {
	margin-left: 25px;
	background-image: url('images/nav-about.gif');
	height: 54px;
	width: 71px;
	text-indent: -10000px;
}
ul#nav li a#nav-about:hover, ul#nav li a#nav-about:focus, ul#nav.nav-about li a#nav-about {
	background-position: 0px -54px;
}

ul#nav li a#nav-signout {
	background-image: url('images/nav-signout.gif');
	height: 54px;
	width: 113px;
	text-indent: -10000px;
}
ul#nav li a#nav-signout:hover, ul#nav li a#nav-signout:focus {
	background-position: 0px -54px;
}

ul#nav li a#nav-my-profile {
	margin-left: 19px;
	background-image: url('images/nav-my-profile.gif');
	height: 54px;
	width: 120px;
	text-indent: -10000px;
	margin-left: 21px;
}
ul#nav li a#nav-my-profile:hover, ul#nav li a#nav-my-profile:focus, ul#nav.nav-my-profile li a#nav-my-profile {
	background-position: 0px -54px;
}

ul#nav li a#nav-edit-profile {
	margin-left: 19px;
	background-image: url('images/nav-edit-profile.gif');
	height: 47px;
	width: 58px;
	text-indent: -10000px;
	margin-top: -47px;
	margin-left: -55px;
}
ul#nav li a#nav-edit-profile:hover, ul#nav li a#nav-edit-profile:focus, ul#nav.nav-edit-profile li a#nav-edit-profile {
	background-position: 0px -47px;
}

ul#nav li a#nav-new-topic {
	margin-left: 19px;
	background-image: url('images/nav-new-topic.gif');
	height: 54px;
	width: 91px;
	text-indent: -10000px;
}
ul#nav li a#nav-new-topic:hover, ul#nav li a#nav-new-topic:focus {
	background-position: 0px -54px;
}

/*** header end ***/

hr {
	clear: both;
	height: 0px;
	border: none;
	padding: 0px;
	margin: 0px;
	display: inline;
}

h1#h-topics {
	background-image: url('images/heading-topics.gif');
	background-repeat: no-repeat;
	display: block;
	height: 30px;
	width: 77px;
	text-indent: -10000px;
	margin-top: 17px;
	margin-bottom: 30px;
	float: left;
}
h1#h-new-topic {
	background-image: url('images/heading-new-topic.gif');
	background-repeat: no-repeat;
	display: block;
	height: 23px;
	width: 109px;
	text-indent: -10000px;
}
h1#h-topics-responses {
	background-image: url('images/heading-topics-responses.gif');
	background-repeat: no-repeat;
	display: block;
	height: 30px;
	width: 216px;
	text-indent: -10000px;
	margin-top: 17px;
	margin-bottom: 30px;
	float: left;
}
h1#h-active-topics {
	background-image: url('images/heading-active.gif');
	background-repeat: no-repeat;
	display: block;
	height: 53px;
	width: 115px;
	text-indent: -10000px;
	margin-top: 3px;
}

h1#h-edit-profile {
	background-image: url('images/heading-edit-profile.gif');
	background-repeat: no-repeat;
	display: block;
	height: 29px;
	width: 168px;
	text-indent: -10000px;
}
h1#h-change-password {
	background-image: url('images/heading-change-password.gif');
	background-repeat: no-repeat;
	display: block;
	height: 33px;
	width: 220px;
	text-indent: -10000px;
}

h3#h-responses {
	background-image: url('images/heading-responses.gif');
	background-repeat: no-repeat;
	display: block;
	height: 67px;
	width: 141px;
	text-indent: -10000px;
	margin-left: -22px;
}
h3#h-respond {
	background-image: url('images/heading-respond.gif');
	background-repeat: no-repeat;
	display: block;
	height: 24px;
	width: 92px;
	text-indent: -10000px;
}

div#topics-back {
	float: left;
	margin-top: 24px;
}
div#topics-next {
	float: left;
	margin-top: 24px;
}
div#topics-back span {
	background-image: url('images/topics-back.gif');
	background-position: 0px -38px;
	display: block;
	width: 30px;
	height: 19px;
	outline: none;
	text-indent: -10000px;
}
div#topics-back a {
	background-image: url('images/topics-back.gif');
	background-position: 0px 0px;
	display: block;
	width: 30px;
	height: 19px;
	outline: none;
	text-indent: -10000px;
}
div#topics-back a:hover, div#topics-back a:focus {
	background-position: 0px -19px;
}

div#topics-next span {
	background-image: url('images/topics-next.gif');
	background-position: 0px -38px;
	display: block;
	width: 33px;
	height: 19px;
	outline: none;
	text-indent: -10000px;
}
div#topics-next a {
	background-image: url('images/topics-next.gif');
	background-position: 0px 0px;
	display: block;
	width: 33px;
	height: 19px;
	outline: none;
	text-indent: -10000px;
}
div#topics-next a:hover, div#topics-next a:focus {
	background-position: 0px -19px;
}

ul#topics, ul#active-topics {
	padding-top: 0px;
	margin-top: 0px;
	padding: 0px;
}
ul#topics li, ul#active-topics li {
	float: left;
	list-style: none;
}
ul#topics li a, ul#active-topics li a {
	display: block;
	width: 180px;
	height: 110px;
	position: relative;
	text-decoration: none;
}
ul#topics li a span, ul#active-topics li a span {
	position: absolute;
	background-image: url('images/home-rollover.jpg');
	top: 0px;
	left: 0px;
	padding: 34px 13px 10px 13px;
	color: white;
	width: 154px;
	height: 66px;
	font-size: 12px;
	display: none;
	font-family: arial, sans-serif;
	line-height: 16px;
}
ul#topics li a span strong, ul#active-topics li a span strong {
	height: 50px;
	font-weight: normal;
	display: block;
	overflow: hidden;
}
ul#topics li a span em, ul#active-topics li a span em {
	position: absolute;
	bottom: 10px;
	left: 13px;
	font-style: normal;
	font-weight: normal;
}

ul#topics li a:hover span, ul#active-topics li a:hover span {
	display: block;
}


div.lightbox {
	display: none;
}

form#signin-form {
	background-image: url('images/signin-form-bg.jpg');
	height: 284px;
	width: 638px;
	position: relative;
}
form#signin-form input#signin-email {
	position: absolute;
	left: 335px;
	top: 36px;
	width: 245px;
	font-size: 17px;
	padding: 0px;
	border: none;
	font-weight: normal;
}
form#signin-form input#signin-pass {
	position: absolute;
	left: 340px;
	top: 115px;
	width: 220px;
	font-size: 17px;
	padding: 0px;
	border: none;
}
form#signin-form input#signin-button {
	position: absolute;
	left: 320px;
	top: 206px;
}
form#signin-form div#form-error {
	position: absolute;
	left: 70px;
	top: 180px;
	background-image: url('images/form-error.jpg');
	height: 71px;
	width: 216px;
	display: block;
	text-indent: -10000px;
}

/*** new topic ***/
form#new-topic-form {
	background-image: url('images/new-topic-form-bg.jpg');
	height: 280px;
	width: 640px;
	position: relative;
}
form#new-topic-form input#new-topic-title {
	position: absolute;
	left: 315px;
	top: 35px;
	width: 265px;
	font-size: 16px;
	padding: 0px;
	border: none;
	font-weight: normal;
}

form#new-topic-form input#new-topic-button {
	position: absolute;
	left: 320px;
	top: 206px;
}

div.browse-button {
	position: relative;
	background-image: url('images/button-browse.jpg');
	background-position: 192px 0px;
	background-repeat: no-repeat;
	height: 50px;
	width: 295px;
}
div.browse-button:hover {
	background-image: url('images/button-browse-on.jpg');
}
div.browse-button input.hidden {
	position:absolute;
	left: 5px;
	top: 2px;
	height: 42px;
	width: 287px;
	-moz-opacity: 0;
	filter:alpha(opacity: 0);
	opacity: 0;
	z-index: 2;
	font-size: 18px;
}

div.browse-button input.button {
	position: absolute;
	z-index: 1;
	width: 180px;
	left: 5px;
	top: 15px;
	font-size: 16px;
	border: none;
}

div#new-topic-processing {
	height: 76px;
	width: 227px;
	background-image: url('images/new-topic-processing.jpg');
	text-indent: -10000px;
	position: absolute;
	bottom: 15px;
	left: 2px;
	display: none;
}

/*** new topic end ****/



/*** footer start ***/
div#footer-nav {
	margin-top: 48px;
	margin-bottom: 30px;
}
div#footer-nav ul {
	margin: 0px;
	padding: 0px;
	display: inline;
}
div#footer-nav ul li {
	float: left;
	list-style: none;
}
div#footer-nav ul li a#footer-nav-ocad {
	background-image: url('images/ocad_logo.gif');
	background-repeat: no-repeat;
	display: block;
	height: 63px;
	width: 52px;
	outline: none;
	text-indent: -10000px;
}
div#footer-nav ul li a:hover {
	-moz-opacity: 0.5;
	filter:alpha(opacity: 50);
	opacity: 0.5;
}
div#footer-nav ul li a#footer-nav-grand {
	background-image: url('images/grand_logo.gif');
	background-repeat: no-repeat;
	display: block;
	height: 63px;
	width: 78px;
	outline: none;
	text-indent: -10000px;
	margin-left: 11px;
}
/*** footer end ***/

div#about-content {
	margin-left: -15px;
	height: 654px;
	width: 630px;
	background-image: url('images/about-text.jpg');
	text-indent: -10000px;
}

span.date {
	display: block;
	height: 34px;
	text-indent: -10000px;
	float: left;
}
span.date.m1  { background-image: url('images/months/1.gif');  width: 71px }
span.date.m2  { background-image: url('images/months/2.gif');  width: 76px }
span.date.m3  { background-image: url('images/months/3.gif');  width: 57px }
span.date.m4  { background-image: url('images/months/4.gif');  width: 49px }
span.date.m5  { background-image: url('images/months/5.gif');  width: 43px }
span.date.m6  { background-image: url('images/months/6.gif');  width: 52px }
span.date.m7  { background-image: url('images/months/7.gif');  width: 46px }
span.date.m8  { background-image: url('images/months/8.gif');  width: 69px }
span.date.m9  { background-image: url('images/months/9.gif');  width: 95px }
span.date.m10 { background-image: url('images/months/10.gif'); width: 70px }
span.date.m11 { background-image: url('images/months/11.gif'); width: 90px }
span.date.m12 { background-image: url('images/months/12.gif'); width: 90px }

span.date.d1 { background-image: url('images/days/1.gif'); width: 5px }
span.date.d2 { background-image: url('images/days/2.gif'); width: 14px }
span.date.d3 { background-image: url('images/days/3.gif'); width: 18px }
span.date.d4 { background-image: url('images/days/4.gif'); width: 12px }
span.date.d5 { background-image: url('images/days/5.gif'); width: 16px }
span.date.d6 { background-image: url('images/days/6.gif'); width: 14px }
span.date.d7 { background-image: url('images/days/7.gif'); width: 12px }
span.date.d8 { background-image: url('images/days/8.gif'); width: 12px }
span.date.d9 { background-image: url('images/days/9.gif'); width: 11px }
span.date.d10 { background-image: url('images/days/10.gif'); width: 19px }
span.date.d11 { background-image: url('images/days/11.gif'); width: 15px }
span.date.d12 { background-image: url('images/days/12.gif'); width: 19px }
span.date.d13 { background-image: url('images/days/13.gif'); width: 16px }
span.date.d14 { background-image: url('images/days/14.gif'); width: 22px }
span.date.d15 { background-image: url('images/days/15.gif'); width: 24px }
span.date.d16 { background-image: url('images/days/16.gif'); width: 24px }
span.date.d17 { background-image: url('images/days/17.gif'); width: 19px }
span.date.d18 { background-image: url('images/days/18.gif'); width: 19px }
span.date.d19 { background-image: url('images/days/19.gif'); width: 20px }
span.date.d20 { background-image: url('images/days/20.gif'); width: 26px }
span.date.d21 { background-image: url('images/days/21.gif'); width: 23px }
span.date.d22 { background-image: url('images/days/22.gif'); width: 25px }
span.date.d23 { background-image: url('images/days/23.gif'); width: 25px }
span.date.d24 { background-image: url('images/days/24.gif'); width: 22px }
span.date.d25 { background-image: url('images/days/25.gif'); width: 26px }
span.date.d26 { background-image: url('images/days/26.gif'); width: 26px }
span.date.d27 { background-image: url('images/days/27.gif'); width: 25px }
span.date.d28 { background-image: url('images/days/28.gif'); width: 25px }
span.date.d29 { background-image: url('images/days/29.gif'); width: 22px }
span.date.d30 { background-image: url('images/days/30.gif'); width: 23px }
span.date.d31 { background-image: url('images/days/31.gif'); width: 21px }

span.date.y2009 { background-image: url('images/years/2009.gif'); width: 60px }

div#next-topic a, div#next-topic span {
	background-image: url('images/next-topic.gif');
	background-repeat: no-repeat;
	display: block;
	height: 25px;
	width: 85px;
	text-indent: -10000px;
	outline: none;
}
div#next-topic a:hover, div#next-topic a:focus {
	background-position: 0px -50px;
}
div#next-topic span {
	background-position: 0px -25px;
}

div#previous-topic a, div#previous-topic span {
	background-image: url('images/previous-topic.gif');
	background-repeat: no-repeat;
	display: block;
	height: 25px;
	width: 89px;
	text-indent: -10000px;
	outline: none;
}
div#previous-topic a:hover, div#previous-topic a:focus {
	background-position: 0px -50px;
}
div#previous-topic span {
	background-position: 0px -25px;
}

/*** edit profile page start ***/
form#profile-form {
	background-image: url('images/profile-form-bg.jpg');
	height: 443px;
	width: 640px;
	position: relative;
}

form#profile-form input#profile-button {
	position: absolute;
	left: 280px;
	top: 366px;
}

form#profile-form input#profile-url {
	position: absolute;
	left: 315px;
	top: 280px;
	width: 280px;
	font-size: 17px;
	padding: 2px;
	border: none;
	font-weight: normal;
}

form#profile-password-form {
	background-image: url('images/profile-password-form-bg.jpg');
	height: 280px;
	width: 640px;
	position: relative;
}
form#profile-password-form input#profile-password {
	position: absolute;
	left: 315px;
	top: 30px;
	width: 280px;
	font-size: 17px;
	padding: 2px;
	border: none;
	font-weight: normal;
}
form#profile-password-form input#profile-password-confirm {
	position: absolute;
	left: 315px;
	top: 115px;
	width: 280px;
	font-size: 17px;
	padding: 2px;
	border: none;
	font-weight: normal;
}
form#profile-password-form input#profile-password-button {
	position: absolute;
	left: 280px;
	top: 200px;
}
/*** edit profile page end ***/


span.profile-name {
	font-family: Arial, sans-serif;
	padding: 10px;
	background-image: url('images/default-name.jpg');
	display: block;
	height: 46px;
	width: 185px;
}