@charset "UTF-8";

* { margin: 0; padding: 0; border: 0; }

body { text-align: center; font-family: Arial, Helvetica, sans-serif; font-size: 12px; line-height: 16px; color: #000; background: url(../images/bg.jpg) repeat-x #d3cbc2; }

a			{ color: #cc0000; text-decoration: none; }
a:hover	{ text-decoration: underline; cursor: pointer; }
h3			{ color: #990000; font-size: 14px; }
hr			{ clear: both; display: block; height: 1px; border-top: 1px solid #e4ded5; }

.clearfix:after	{ /*clearfix*/content:".";display:block;height:0;clear:both;visibility:hidden; }

/*	======	FORMS	======	*/
div.label-input			{ }
div.label-input:after	{ /*clearfix*/content:".";display:block;height:0;clear:both;visibility:hidden; }
input.text		{ height: 20px; background: #f0f0f0; border: 1px solid #cfcfcf; }
textarea			{ background: #f0f0f0; border: 1px solid #cfcfcf; }
select			{ height: 22px; border: 1px solid #cfcfcf; }
option			{ padding: 1px 0 1px 5px; }
.error			{ color: red; }

/*	======	BUTTONS	======	*/
input.submit	{
	width: 55px;
	height: 26px;
	line-height: 26px;
	text-indent: -9999em;
	cursor: pointer;
	background: transparent url(../images/btn_submit_55x26.gif) 0 0 no-repeat;
	border: 0;
	}

input.go				{ width: 58px; background: transparent url(../images/btn_go_58x26.gif) 0 0 no-repeat; }
input.clear			{ width: 58px; background: transparent url(../images/btn_clear_55x26.gif) 0 0 no-repeat; }
input.submit-alt	{ width: 95px; height: 28px; background: transparent url(../images/btn_submit_95x28.gif) 0 0 no-repeat; }

input.browse			{ height: 32px; border: 1px solid #999; }
input.upload			{ width: 75px; height: 32px; background: transparent url(../images/btn_upload_75x32.gif) 0 0 no-repeat; }
input.save-as-draft	{ width: 118px; height: 32px; background: transparent url(../images/btn_save_as_draft_118x32.gif) 0 0 no-repeat; }
input.publish			{ width: 104px; height: 32px; background: transparent url(../images/btn_publish_104x32.gif) 0 0 no-repeat; }
input.go-home			{ width: 153px; height: 31px; background: transparent url(../images/btn_go_home_153x31.gif) 0 0 no-repeat; }
input.go-login			{ width: 152px; height: 31px; background: transparent url(../images/btn_go_login_152x31.gif) 0 0 no-repeat; }
input.find-friends	{ width: 96px; height: 27px; background: transparent url(../images/btn_find_friends_96x27.gif) 0 0 no-repeat; }
input.find-friends	{ width: 96px; height: 27px; margin: 3px 0 12px 0; background: transparent url(../images/btn_find_friends_96x27.gif) 0 0 no-repeat; }
input.view-my-story	{ width: 168px; height: 32px; background: transparent url(../images/btn_view_my_story_168x32.gif) 0 0 no-repeat; }
input.save		{ width: 104px; height: 32px; background: transparent url(../images/btn_save.gif) 0 0 no-repeat; }
input.edit-photo	{ width: 168px; height: 32px; background: transparent url(../images/btn_changeEditPhoto_168x32.gif) 0 0 no-repeat; }
input.edit-video	{ width: 168px; height: 32px; background: transparent url(../images/btn_changeEditVideo_168x32.gif) 0 0 no-repeat; }
input.continue	{ width: 92px; height: 32px; background: transparent url(../images/btn_continue_90x32.gif) 0 0 no-repeat; }




/*	======	IMAGE-REPLACED HEADERS	======	*/
.box286-top h2,
.box286sash-top h2,
.box572-top h2,
.box858sash-top h2	{ text-indent: -999em; height: 25px; line-height: 25px; }

/*	Home Page H2	*/
#story-submit h2		{ margin: 17px 0 0 24px; background: transparent url(../images/hdr_submitYourStory_160x25.png) 0 0 no-repeat; }
#story-vote h2			{ margin: 17px 0 0 24px; background: transparent url(../images/hdr_voteNow_96x25.png) 0 0 no-repeat; }
#story-search h2		{ margin: 17px 0 0 24px; background: transparent url(../images/hdr_search_70x25.png) 0 0 no-repeat; }

/*	Story Page H2	*/
#leave-a-comment h2	{ margin: 17px 0 0 24px; background: transparent url(../images/hdr_leave_a_comment_128x25.gif) 0 0 no-repeat; }
#comments h2			{ margin: 17px 0 0 24px; background: transparent url(../images/hdr_comments_78x25.gif) 0 0 no-repeat; border: 0px solid teal; }

.box858sash-top span	{ float: right; display: block; margin-right: 720px; line-height: 57px; font-size: 12px; color: #fff; border: 0px solid blue; }


/*	======	LAYOUT	======	*/
#container { width: 940px; margin: 0 auto; text-align: left; }

/*	======	HEADER	======	*/
#header		{ width: 940px; height: 210px; /*nav*/ margin: 0 auto; background: url(../images/header_940x210.jpg) no-repeat; }


div#user-status	{ float: right; margin: 12px 51px 120px 0; line-height: 29px; font-weight: bold; }

#user-status #connect-with-fb,
#user-status #join,
#user-status #log-in,
#user-status #welcome-user,
#user-status #log-out				{ display: none; float: right; margin-left: 9px; }

#user-status.logged-in #welcome-user,
#user-status.logged-in #log-out				{ display: block; }

#user-status.logged-out #join,
#user-status.logged-out #log-in,
#user-status.logged-out #connect-with-fb	{ display: block; }


/*	======	MAIN NAV	======	*/
ul#mainNav	{ clear: both; display: block; width: 850px; height: 45px; margin: 0 auto; padding-left: 6px; }

ul#mainNav li		{ float: left; list-style: none; }
ul#mainNav li a	{ display: block; height: 45px; text-indent: -999em; }

ul#mainNav li#home a					{ background: url(../images/btn_home.jpg) no-repeat; width: 171px; }
ul#mainNav li#contestDetails a	{ background: url(../images/btn_contestdetails.jpg) no-repeat; width: 168px; }
ul#mainNav li#submitStory a		{ background: url(../images/btn_submitstory.jpg) no-repeat; width: 168px; }
ul#mainNav li#editStory a		{ background: url(../images/btn_mystory.jpg) no-repeat; width: 168px; }

ul#mainNav li#viewStories a		{ background: url(../images/btn_viewstories.jpg) no-repeat; width: 168px; }
ul#mainNav li#inviteFriends a		{ background: url(../images/btn_invitefriends.jpg) no-repeat; width: 169px; }

ul#mainNav li#home a:hover, 
ul#mainNav li#home a#selected					{ background: url(../images/btn_home_rollover.jpg) no-repeat; width: 171px; }
ul#mainNav li#contestDetails a:hover,
ul#mainNav li#contestDetails a#selected	{ background: url(../images/btn_contestdetails_rollover.jpg) no-repeat; width: 168px; }
ul#mainNav li#submitStory a:hover,
ul#mainNav li#submitStory a#selected		{ background: url(../images/btn_submitstory_rollover.jpg) no-repeat; width: 168px; }
ul#mainNav li#editStory a:hover,
ul#mainNav li#editStory a#selected		{ background: url(../images/btn_mystory_rollover.jpg) no-repeat; width: 168px; }

ul#mainNav li#viewStories a:hover,
ul#mainNav li#viewStories a#selected		{ background: url(../images/btn_viewstories_rollover.jpg) no-repeat; width: 168px; }
ul#mainNav li#inviteFriends a:hover,
ul#mainNav li#inviteFriends a#selected		{ background: url(../images/btn_invitefriends_rollover.jpg) no-repeat; width: 169px; }



/*		============	CONTAINER'S FULL WIDTH box858 	============	*/
.box858-wrapper	{ width: 858px; margin-left: 41px; }

.box858-top					{ height: 21px; line-height: 110px; background: transparent url(../images/box858_top_858x21b.png) 0 0 no-repeat; }
.box858-top#fivekHeader	{ height: 110px; line-height: 110px; background: transparent url(../images/box858_top_858x110.png) 0 0 no-repeat; }

.box858			{ width: 858px; padding-bottom: 24px; background: transparent url(../images/box858_tile_858x3.png) 0 0 repeat-y; }
.box858:after	{ /*clearfix*/content:".";display:block;height:0;clear:both;visibility:hidden; }
.box858-bottom	{ height: 21px; line-height: 21px; background: transparent url(../images/box858_bottom_858x21.png) 0 0 no-repeat; }

/*		======	exception: Home Page: pink bg CTA 	======	*/
.box858-top img#fivek					{ float: left; width: 175px; height: 81px; margin: 18px 30px 0 18px; }
.box858-top div#submit-your-story	{ float: left; width: 630px; }
.box858-top #submit-your-story img	{ float: right; width: 184px; margin: 30px; }
.box858-top #submit-your-story p		{ margin-top: 30px; line-height: 1.35em; }

div.box858-header			{ margin-bottom: 21px; padding-top: 1px; }
div.box858-header:after	{ /*clearfix*/content:".";display:block;height:0;clear:both;visibility:hidden; }

.box858-header h1	{ display: block; float: left; min-height: 41px; line-height: 21px; margin: 12px 0 0 12px; font-size: 24px; color: #cc0000; font-weight: normal; }

.box858-header h1.arrows-hdr			{ padding-left: 96px; background: transparent url(../images/hdr_featureArrows_70x41.gif) 0 0 no-repeat; }
.box858-header .arrows-hdr img		{ margin-top: 8px; }
.box858-header h1.arrows-hdr span	{ font-size: 14px; color: #333; }

.box858-header div.subhead		{ clear: both; padding: 15px 30px 0; }

.connect-with					{ width: 164px; height: 53px; padding-top: 6px; text-align: center; background: transparent url(../images/bg_connect_164x53.gif) 0 0 no-repeat; }
div.subhead .connect-with	{ float: right; margin-left: 30px; }
fieldset .connect-with		{ margin: auto; height: auto; background-image: none; }
.connect-with p	{ padding: 6px 0 0 0; font-size: 11px; }

.connect-with p	{ padding: 6px 0 0 0; font-size: 11px; }


div#storyNav			{ float: right; /*width: 390px;*/ margin: 30px 24px 0 0; }
#storyNav select		{ float: right; width: 165px; margin: -3px 0 0 15px; }
#storyNav p				{ float: right; margin-left: 15px; }
#storyNav a				{ color: #666; }
a.previous-story	{ margin-right: 9px; }
a.next-story		{ margin-left: 9px; }

div.playerBG	{ clear: both; float: left; width: 408px; height: 408px; margin: 0 12px 36px 24px; background: #fff url(../images/playerBG_408x408.png) 0 0 no-repeat; }
.playerBG img.placeholder	{ width: 352px; height: 264px; margin: 28px 28px 9px 28px; border: 1px solid #eee; }

.playerBG .share				{ width: 352px; width: 340px; margin: auto; padding: 6px 6px 12px 6px; background: #fff; }
.playerBG .share:after		{ /*clearfix*/content:".";display:block;height:0;clear:both;visibility:hidden; }
.playerBG .share h3			{ clear: both; float: left; margin: 0 6px 0 3px; font-size: 11px; line-height: 25px; }
.playerBG .share .logo		{ height: 25px; margin: 0 3px 0 0; padding: 0; border: 0; }
.playerBG .share input		{ width: 165px; line-height: 25px; margin-top: 2px; }
.playerBG .share p.flag		{ float: right; margin-right: 3px; text-align: right; font-size: 10px; line-height: 12px; }



/* the total height doesn't precisely match div.playerBG because the playerBG's drop shadow makes it appear slightly shorter */
div.story-wrapper	{
	float: left;
	position: relative;
	width: 388px;
	width: 386px;
	height: 408px;
	background: #fbf9f3;
	border: 1px solid #e4ded5;
	}

div.story	{ height: 349px; height: 289px; padding: 20px; /* bottom padding is not respected due to overflow */ overflow: auto; }

.story h3	{ font-size: 14px; margin-bottom: 5px; }
.story p		{ line-height: 1.35em; margin-bottom: 10px; }
.story hr	{ margin-bottom: 1.35em; line-height: 1.35em; }

div.vote-now-wrapper	{ position: relative; width: 388px; height: 79px; }
div.vote-now			{ position: absolute; bottom: 0; width: 386px; height: 59px; background: #fbf9f3 url(../images/bg_vote_now_386x59.gif) left bottom no-repeat; }

.vote-now p#vote-counter	{ float: left; width: 120px; margin: 0 30px 0 0; line-height: 59px; text-align: center; }
.vote-now img					{ margin-top: 12px; }

/*		======	'View Stories' page: Story Search in box858 upper section 	======	*/
div.box858-header h1.arrows-hdr	{}
.search-wrapper			{ clear: both; margin-left: 45px; padding-top: 24px; }
.search-wrapper:after	{ /*clearfix*/content:".";display:block;height:0;clear:both;visibility:hidden; }
.box858-header .label-input	{ clear: none; /*!*/ display: block; float: left; width: 225px; /* ie6: width: 240px;*/ }

.box858-header .label-input label	{ display: block; }
.box858-header .label-input .text	{ clear: both; display: block; float: left; width: 150px; margin-right: 6px; }
.box858-header .label-input .go		{}
.search-wrapper p			{ padding-top: 15px; clear: both; font-weight: bold; }

p.story-nav	{ text-align: right; padding-right: 60px; color: #666; }


/*	=========	call-to-action TRYPTICH (286px)	=========	*/
#tryptich-wrapper			{ clear: both; width: 858px; margin-left: 41px; }
#tryptich-wrapper:after	{ /*clearfix*/content:".";display:block;height:0;clear:both;visibility:hidden; }

.box286-wrapper			{ float: left; width: 286px; }
.box286-wrapper:after	{ /*clearfix*/content:".";display:block;height:0;clear:both;visibility:hidden; }

.box286-top		{ height: 51px; height: 50px; padding-top: 1px; line-height: 51px; background: transparent url(../images/box286_top_286x51.png) 0 0 no-repeat; }
.box286			{ width: 286px; padding-bottom: 12px; background: transparent url(../images/box286_tile_286x3.png) 0 0 repeat-y; }
.box286:after	{ /*clearfix*/content:".";display:block;height:0;clear:both;visibility:hidden; }
.box286-bottom	{ height: 19px; line-height: 19px; background: transparent url(../images/box286_bottom_286x19.png) 0 0 no-repeat; }

/*	======	fix heights for Home Page tryptich	=======	*/
#story-submit .box286,
#story-vote .box286,
#story-search .box286,
#leave-a-comment .box572	{ height: 90px; }

.box286 p	{ margin: 0 24px 12px 24px; }


/*	======	 COMMENTERS BOX (HOMEPAGE), STORIES BOX ('View Stories' page)	======	*/	
#commenters-box .box858		{ padding: 21px 0 21px 21px; }

/*	only on home page	*/
div.most-hdr	{ float: left; width: 102px; height: 49px; margin: 30px 10px 0 0; }

.commenter-row,
.stories-row		{ clear: both; margin-bottom: 21px; }
.stories-row		{ margin-left: 72px; }

.commenter-row:after,
.stories-row:after	{ /*clearfix*/content:".";display:block;height:0;clear:both;visibility:hidden; }


div.user			{ float: left; width: 132px; margin-right: 10px; }
div.user-pic	{ width: 132px; height: 110px; text-align: center; background: transparent url(../images/user_pic_bg_132x110.gif) 0 0 no-repeat; }
.user-pic img	{ max-width: 120px; max-height: 90px; margin: 6px 0 0 6px; }
.user p			{ margin-left: 6px; color: #660000; }

/*	======	tryptich SEARCH (overriden for 'view story' page story search)	======	*/
#story-search .label-input				{ clear: both; margin: 0 0 12px 24px; }
#story-search label						{ clear: both; display: block; margin: 0 12px 3px 0; }
#story-search #search-story-text		{ float: left; margin: 1px 12px 0 0; width: 159px; line-height: 26px; }
#story-search input.go	{ float: left; }

#story-search label.inline	{ float: left; display: block; line-height: 22px; }
#story-search select			{ float: left; width: 174px; line-height: 22px; }


/*	======	LEAVE A COMMENT	*/
.box572-wrapper			{ float: left; width: 572px; }
.box572-wrapper:after	{ /*clearfix*/content:".";display:block;height:0;clear:both;visibility:hidden; }

.box572-top						{ width: 572px; height: 51px; height: 50px; padding-top: 1px; line-height: 51px; background: transparent url(../images/box572_top_572x51.png) 0 0 no-repeat; }
.box572-top img.sashHeader	{ margin: 18px 0 0 24px; }
.box572			{ width: 572px; padding-bottom: 12px; background: transparent url(../images/box572_tile_572x3.png) 0 0 repeat-y; }
.box572:after	{ /*clearfix*/content:".";display:block;height:0;clear:both;visibility:hidden; }
.box572-bottom	{ width: 572px; height: 19px; line-height: 19px; background: transparent url(../images/box572_bottom_572x19.png) 0 0 no-repeat; }

.box572-top h1		{ padding: 5px 0 0 30px; color: #fff; }

.box572 .label-input				{ clear: both; margin: 0 0 12px 24px; }
.box572 input#comments-submit	{ margin-right: 6px; }

/*	======	THE BIG 'COMMENTS' BOX	======	*/
.box858sash-top	{ height: 51px; height: 50px; padding-top: 1px; line-height: 51px; background: transparent url(../images/box858_sash_top_858x51.png) 0 0 no-repeat; }
.box858sash			{ width: 858px; padding-bottom: 24px; background: transparent url(../images/box858sash_tile_858x3.png) 0 0 repeat-y; }
.box858sash:after	{ /*clearfix*/content:".";display:block;height:0;clear:both;visibility:hidden; }
.box858sash-bottom	{ height: 19px; line-height: 19px; background: transparent url(../images/box858sash_bottom_858x19.png) 0 0 no-repeat; }

div.comment-wrapper	{ margin: 0 30px; padding: 15px 0; border-bottom: 1px solid #ccc; }
.comment-wrapper .commenter	{ color: #660000; font-weight: bold; margin-bottom: 9px; }
.comment-wrapper .comment		{}
p#more-comments					{ float: right; margin: 12px 30px 0 0; }



#leave-a-comment textarea	{ width: 525px; height: 40px; }

#leave-a-comment .submit-wrapper			{ clear: both; margin-top: 9px; }
#leave-a-comment .submit-wrapper:after	{ /*clearfix*/content:".";display:block;height:0;clear:both;visibility:hidden; }




div#footer	{
	clear: both;
	display: block;
	width: 858px;
	height: 113px;
	margin-left: 41px;
	padding-top: 1px;
	background: transparent url(../images/bg_footer_858x63.png) 0 0 no-repeat;
	background: transparent url(../images/bg_footer_858x113.png) 0 0 no-repeat;

text-align: center;
	}
#footer p	{ display: block; margin: 30px auto 0 auto; }



/*	======	FORMS PAGES (Registration, etc.)	======	*/
/*	======	Split-Page FORMS	======	*/
.box858 form#register-form			{ width: 834px; margin-left: 12px; text-align: left; }
.box858 form#register-form:after	{ /*clearfix*/content:".";display:block;height:0;clear:both;visibility:hidden; }

div.error-global	{ margin: 10px 10px; padding: 10px; text-align: center; font-weight: bold; color: red; border: 2px solid red; }

fieldset.left,
fieldset.right				{ float: left; width: 417px; width: 367px; margin: 12px 12px 24px 12px; padding: 24px 12px; background: #fbf9f3; border: 1px solid #e4ded5; }
fieldset.left:after,
fieldset.right:after		{ /*clearfix*/content:".";display:block;height:0;clear:both;visibility:hidden; }


/*	===	Invite page	===	*/
fieldset.wide,
div.share-option			{ position: relative; clear: both; width: 784px; margin: 12px 12px 24px 24px; padding: 24px 12px; background: #fbf9f3; border: 1px solid #e4ded5; }
fieldset.wide:after,
div.share-option:after	{ /*clearfix*/content:".";display:block;height:0;clear:both;visibility:hidden; }

div.share-option			{ margin-bottom: 24px; padding-bottom: 24px; }
.share-option p			{ margin: 9px 0; }
.share-option img.logo	{ float: left; margin-right: 12px; }

.share-option ul				{ list-style: disc; margin: 12px; }
.share-option ul.invitees	{ list-style: none; width: 255px; margin: 12px; }
.share-option li			{ margin-bottom: 6px; }
.share-option li input	{ margin-right: 9px; vertical-align: middle; }
.share-option li span	{ float: right; }

fieldset.wide .radios-wrapper	{ /*float: right;*/ padding: 0 24px; position: absolute; left: 333px; top: 95px; }


/* input and image are *inside* label	*/
.radio-wrapper label	{ clear: both; display: block; float: left; line-height: 38px; }
.radio-wrapper input	{ margin-right: 9px; vertical-align: middle; }
.radio-wrapper img	{ margin: 0; line-height: 38px; vertical-align: middle; }

div.label-input			{ display: block; margin-bottom: 1.2em; border: 0px solid #ccc; }
div.label-input:after	{ /*clearfix*/content:".";display:block;height:0;clear:both;visibility:hidden; }

.label-input label,
.label-input .text	{ clear: both; display: block; line-height: 21px; }
.asterisk				{ color: red; line-height: 21px; padding-left: 6px; }

.label-input .text		{ width: 300px; height: 18px; padding: 3px 0 0 3px; }
.label-input textarea	{ width: 300px; padding: 3px 0 0 3px; }

.label-input .area-code,
.label-input .phone-prefix,
.label-input .phone-suffix	{ clear: none; float: left; width: 51px; margin-right: 15px; }
.label-input .phone-suffix	{ width: 66px; margin-right: 0; } 

select.month	{ width: 95px; margin-right: 9px; }
select.year		{ width: 70px; margin-right: 9px; }
select.date		{ width: 55px; margin-right: 9px; }

.label-input .gender	{ width: 90px; } 

.label-input p.instruction	{ clear: both; color: #999; font-style: oblique; }

p.error	{ clear: both; }


div.submit-section		{ clear: both; margin-left: 24px; }
.submit-section .submit	{ margin: 9px 0 0 -3px; }

.submit-section .checkbox-wrapper input	{ margin-right: 6px; }

/*	password sent page */
.subhead .submit-section	{ margin-left: 0; }
.subhead .submit				{ margin-right: 9px; }
div.borderedBox { position: relative; clear: both; width: 720px; margin: 12px 12px 24px 24px; padding: 24px 12px; background: #fbf9f3; border: 1px solid #e4ded5; }
