/*
	CSS for ProjectStory
	by LR Communication Design
	March 2009
*/

	*					{margin:0px; padding: 0px; line-height: 10px}		
						/* every element will inherit a 10px line-height and will need its own line-height set 
						   I.e. line-height will NOT inherit normally. Why do this? It helps cross browser vertical alignment. */		

	body {
		background:		url(background-online-file-sharing-secure-document-distribution.jpg) repeat-x #f8e57a;
		font-family: 	Verdana, sans-serif;
		color:			#333;}

	a img {border: none;}
	
	span.superscripted {font-size:.9em; vertical-align:super;}

	div#pageWrapper	{
		position:		relative;
		height:			830px;
		width:			749px;
		margin: 		0px auto; 
		background:		url(Online-file-sharing-secure-document-distribution.jpg) no-repeat;
		padding-right:	50px;
		padding-left:	50px;}

	img#WebFilesLogo {
		float:			left;
		margin-top:		21px;
		margin-left:	66px;
		margin-left:	9px;}

		a#WebFilesLogoLink			{text-decoration: none;}
		a#WebFilesLogoLink:link	{}
		a#WebFilesLogoLink:visited	{}
		a#WebFilesLogoLink:focus	{}
		a#WebFilesLogoLink:hover	{}
		a#WebFilesLogoLink:active	{}

	h1 {
		/* Share documents with anyone, anywhere, anytime. */
		padding-top:	63px;
		font-size: 		14px;
		font-weight:	bold;
		font-style:		italic;
		text-align:		right;
		color:			#154899;}

	p#firstParagraph {
		width: 			254px;
		margin-left:	502px;
		padding-top:	80px;
		font-size: 		13px;
		font-weight:	bold;
		line-height:	20px;
		color:			#cb3e34;}

	p#secondParagraph {
		width: 			254px;
		margin-left:	502px;
		padding-top:	12px;
		font-size: 		13px;
		font-weight:	normal;
		line-height:	20px;
		color:			#262626;}

	p#links {
		padding-top:	69px;
		margin-left:	10px;
		font-size: 		12px;
		font-weight:	bold;}

		p#links a			{text-decoration: none; color:#000;}
		p#links a:link		{color:#000;}
		p#links a:visited	{color:#000;}
		p#links a:focus		{color:#000;}
		p#links a:hover		{color:#000; border-bottom: 1px dotted #000;}
		p#links a:active	{color:#000; border-bottom: 1px solid  #000;}
	
		p#links a#selected:link,
		p#links a#selected:visited	{color: #fff; border-bottom: 0px;}
		p#links a#selected:focus	{color: #fff; border-bottom: 0px;}
		p#links a#selected:hover	{color: #fff; border-bottom: 0px;}
		p#links a#selected:active	{color: #fff; border-bottom: 0px;}


	div#columnOne {
		float:				left;
		width:				230px;
		margin-top:			33px;
		margin-right:		4px;
		margin-left:		10px;}

		div#columnOne h2 {
			margin-bottom:	7px;
			font-size:		10px;
			font-weight:	bold;
			color:			#005dab;}

		div#columnOne p	{
			margin-bottom:	4px;
			font-size:		10px;
			line-height:	16px;
			color:			#333;}

		p#linkToMoreIinfo	{padding-top:	2px;}

			p#linkToMoreIinfo a			{text-decoration: none; color: #b73f04;}
			p#linkToMoreIinfo a:link	{border-bottom: 1px dotted #b73f04;}
			p#linkToMoreIinfo a:visited	{border-bottom: 1px dotted #b73f04;}
			p#linkToMoreIinfo a:focus	{}
			p#linkToMoreIinfo a:hover	{border-bottom: 1px solid  #b73f04;}
			p#linkToMoreIinfo a:active	{border-bottom: 1px dotted   #b73f04;}


	div#columnTwo {
		float:				left;
		width:				230px;
		margin-top:			33px;
		margin-left:		6px;
		font-size:			10px;}

		div#columnTwo h2 {
			margin-bottom:	7px;
			font-size:		10px;
			font-weight:	bold;
			color:			#005dab;}

		div#columnTwo p	{
			margin-bottom:	6px;
			line-height:	16px;
			color:			#333;}
			
		div#columnTwo ul {
			margin-left:	14px;
			color:			#005dab;}
			
		div#columnTwo ul li, 
		div#columnTwo ul li span	{
			/*  span is styled for Opera. Opera does not use the line height unless there is free text in the li.
				In the HTMl there is a span and no free text. */
			margin-bottom:	5px;
			line-height:	16px;}

		div#columnTwo ul li span	{
			color:			#333;}


	div#columnThree { 
		float:				left;
		width:				246px;
		margin-top:			33px;
		margin-left:		23px;
		line-height:		12px;}

		div#columnThree h2 {
			padding-top:	17px;
			font-size:		10px;
			font-weight:	bold;
			text-align:		center;
			text-shadow:	1px 1px 1px #e6f0fe;}

			div#columnThree h2 a			{text-decoration: none; color: #333; }
			div#columnThree h2 a:link		{}
			div#columnThree h2 a:visited	{}
			div#columnThree h2 a:focus		{}
			div#columnThree h2 a:hover		{color: #bb2c0a;}
			div#columnThree h2 a:active		{}


			p#signUpNote {
				padding-top:	11px;
				font-size:		10px;
				font-weight:	bold;
				text-align:		center;
				line-height:	14px;}


			div#loginFormDiv {
				display:		none;
				margin-top:		27px;
				font-size:		9px;}
	
				p#loginFormTitle {
					padding-left:		74px;
					margin-bottom:		5px;}

				div#loginFormDiv label {
					display:			block;
					float:				left;
					width:				61px;
					padding-top:		4px;
					padding-right:		9px;
					padding-left:		4px;
					text-align:			right;}

				div#loginFormDiv input {
					width:				150px;
					margin-bottom:		4px;
					padding:			3px;
					border:				1px solid #e0e0e0;
					font-size:			9px; /* repeated for ie */ }
	
				div#loginFormDiv a {
					/* the login button link */
					display:			block; 
					width:				44px; 
					margin-top:			9px;
					margin-bottom:		15px;
					margin-left:		132px;
					border-bottom: 		1px dotted transparent;
					font-size:			10px; 
					font-weight:		bold; 
					text-align:			center;
					text-decoration:	none; 
					color:				#376d9c;}

					div#loginFormDiv a:link		{}
					div#loginFormDiv a:visited	{}
					div#loginFormDiv a:focus	{}
					div#loginFormDiv a:hover	{border-bottom: 1px dotted #3e81ad;}
					div#loginFormDiv a:active	{border-bottom: 1px solid  #3e81ad;}


				p#forgotPassword {
				display:		none;
						width:				161px;
						margin-left:		74px; 
						line-height:		16px;}

					p#forgotPassword a {
						font-size:			9px;
						text-decoration:	none; 
						color:				#333;}
	
						p#forgotPassword a:link		{border-bottom: 1px dotted #333;}
						p#forgotPassword a:visited	{border-bottom: 1px dotted #333;}
						p#forgotPassword a:focus	{}
						p#forgotPassword a:hover	{border-bottom: 1px solid  #333;}
						p#forgotPassword a:active	{border-bottom: 1px dotted #333;}



				/* when javascript is not available */
				
				div#noscriptSection h3 {
					margin-top:				25px;
					margin-bottom:			12px;
					margin-left:			74px;
					font-size:				10px;
					font-weight:			normal;
					text-transform:			uppercase;
					line-height: 			13px; }

				div#noscriptSection p {
					margin-left:			74px;
					font-size:				10px;
					line-height:			13px;}
					
				div#noscriptSection p a {
					display:				block;
					width:					140px;
					margin-top:				19px;
					margin-left:			10px;
					font-size:				10px;
					line-height:			13px;
					text-align:				center;
					text-decoration:		none;
					color:					#000;}

					div#noscriptSection p a:link	{border-bottom: 1px dotted #dfdfdf;}
					div#noscriptSection p a:visited	{border-bottom: 1px dotted #dfdfdf;}
					div#noscriptSection p a:focus	{}
					div#noscriptSection p a:hover	{border-bottom: 1px dotted  #333;}
					div#noscriptSection p a:active	{border-bottom: 1px dotted #dfdfdf;}



		div#copyrightBlock {
			position: 		absolute;
			top:			711px;
			left:			60px;
			font-size: 		11px;
			line-height:	16px;}

		div#copyrightBlock p {line-height:	16px;}

			div#copyrightBlock a {
				text-decoration:	none; 
				color:				#333;}

				div#copyrightBlock a:link		{border-bottom: 1px dotted #cb3e34;}
				div#copyrightBlock a:visited	{border-bottom: 1px dotted #cb3e34;}
				div#copyrightBlock a:focus		{border-bottom: 1px dotted #cb3e34;}
				div#copyrightBlock a:hover		{border-bottom: 1px solid  #cb3e34;}
				div#copyrightBlock a:active		{border-bottom: 1px dotted #cb3e34;}


		div#extraBlock {
			position: 			absolute;
			top:				692px;
			left:				563px;
			font-size: 			11px;
			color:				#cb3e34;}

			div#extraBlock p {
				margin-bottom:	6px;
				font-weight:	bold;
				line-height:	16px;}
	
			div#extraBlock ul {margin-left:15px;}
			div#extraBlock ul li {}

				div#extraBlock a {
					line-height:		16px;	/* put here rather than earlier in the hierarchy, for Opera's sake */
					text-decoration:	none; 
					color:				#333;}

					div#extraBlock a:link		{border-bottom: 1px dotted #cb3e34;}
					div#extraBlock a:visited	{border-bottom: 1px dotted #cb3e34;}
					div#extraBlock a:focus		{border-bottom: 1px dotted #cb3e34;}
					div#extraBlock a:hover		{border-bottom: 1px solid  #cb3e34;}
					div#extraBlock a:active		{border-bottom: 1px dotted #cb3e34;}