/* CSS Document
/* CSS designed by FAR Studio Designs */
/* Summer 2008 */

/* Colors
  Background Red:  		#6e0700
  Background ochre:  	#af5f1b
  background brown:		#3c241a
  Text gold:			#cb7f08
  Text red:				#ed1414
  Text dark red:		#bf0d0d
  Text Brown:			#281606
  parchment:			#f2c898
  
*/
  
body 	{color: #281606;  
		background: #af5f1b url(SfHArt/bg_comingsoon.jpg);
		background-attachment: fixed;
		font-family: Verdana, Arial, sans-serif;
		font-size: 62.5%;
		margin: 0px; padding: 0px;
		}
*		{
		margin:0; padding:0;
		}		

h1		{height: 198px;	/* image replacement */
		width: 200px;
		text-indent: -9000px;
		}
h2 		{color: #cb7f08;
		font-size: 1.8em;
		margin: 1em 0 .5em;
		}
	
h3 		{color: #281606; 
		font-size: 1.6em;
		}
h4		{color: #cb7f08;
		font-size: 1.4em;
		}

a		{color: #ed1414; 
		text-decoration: none;
		font-style: italic;
		}
a:visited {color: #bf0d0d;}
a:hover 	{color: #cb7f08;}
a:active	{color: #65844a;}
		
img		{
		border: none;
		padding: 8px 0;
		}
li		{list-style-type:none;}

p 		{padding: .3em 0;
		font-size: 1.5em;}		
/* id  */

div#wrapper	{  
			background: url(SfHArt12/fa_bg_new.jpg) repeat-y;			
			margin: 0 auto -100px; /* bottom margin is the negative of the footer's height */
			width: 790px;
			height: 100%;
			min-height: 100%;
			height: auto !important;	
			}
							
div#header	{
			background: transparent url(SfHArt12/fa_header3.jpg) no-repeat; 
			background-position: 0px 26px;
			height: 200px;
			left: -4px;
			margin: 0;
			position: relative;
			top: -30px;
			}						
	.logo		{
			position: absolute;
			top: 20px;
			left: -90px;
			z-index: 100;
			}
/* Menu  
*******************************************************************************/	
					
#menu	{
			background: #6e0700 url(SfHArt/fa_menu2.jpg) no-repeat; 
			color:#f2c898;
			font: 1em "Trebuchet MS", Verdana, "HelveticaNeueLT Std Extended", sans-serif;
			height: 80px;
			margin: 0 0 0 2px;
			padding: 0px 0 0 20px;
			position: absolute;
			top: 182px;
			width: 767px;
			}
	
	div#menu	ul	{float:left;
				padding: 0px 0 14px 0;
				}
	div#menu	li	{
				font-size: 1.8em;
				margin-left: 4px;
				padding: 2px 7px;
				}							 


/*  Drop Down Menus adapted from CSSnewbie.com  and Suckerfish */
				
#nav, #nav ul {     
			list-style: none;    
			margin: 40px 0 0 4px; 
			padding: 0px;   
			z-index: 999; 
			} 
		#nav a:link 		{     
					color: #f2c898;
					display: block;
					width: 2em; 	
					} 
		#nav a:visited 		{     
					color: #281606;
					}
		#nav a:hover 		{     
					color: #cb7f08;
					}
		#nav a:active {
					color: #f2c898; 
					}

		#nav li 	{     	
					background: #6e0700 url(SfHArt/main_red_bg.jpg);
					border: 1px solid #f2c898;
					float: left;     
					margin: 2px 0 2px 8px;
					padding: 0 0 0 12px;
					width: 6em; 
					}		
		#nav li ul 	{     
					position: absolute; 
					left: -999em; 
					z-index: 100;
					} 
		#nav  li a	{
					display: block;
					}

		#nav li ul 	li { 
					font-size: .9em;
					width: 6.2em;
					.top:  1.6em;
					z-index: 100;
					}    
		#nav li:hover ul {
					left: auto;
					}
		#nav li:hover li {
					float: none;
					.float: left;
					}

		#nav li:hover ul, #nav li.sfhover ul {
					left: auto; 
					margin: 0 2px;
					padding:2px;
					width: 100%;
					}
		#nav > li	{background: none; border:none;}
						
		#nav li span.soon a 		{     
					color: #000; background:url(SfHArt/main_forums.gif) no-repeat;
					margin: 2px 6px 0;
					padding: 6px 20px 0;
					width: 50px;
					}		
		#nav li span.soon a:hover 		{     
					color: #000; background:url(SfHArt/main_comingsoon.gif) no-repeat;
					width: 56px;
					}

/* Main  
***************************************************************************************************/


div#main	{
			float:left;			
			margin: 48px 0px 0 1em;
			padding: 0px 0 50px 20px;
			position: relative;
			width:400px;
			}
	img.mid	 {
			margin-left: 6em !important;
			}


	div#main2	{
			background: #f2c898 url(SfHArt/fa_main_mid.jpg) repeat-y;
			float:left;	
			padding: 0px 24px 0px 34px;
			position: relative;
			width:346px;
			}
	div#main2	.mtop {
			background: transparent url(SfHArt/fa_main_top.jpg) no-repeat;
			margin: 0px 0 0 -1.9em;
			padding: 28px 24px 0px 34px;
			width:366px;
			}
	div#main2	.mend {
			background: transparent url(SfHArt/fa_main_end.jpg) bottom no-repeat;
			margin: 0 0 0 -50px;
			padding: 20px 24px 28px 48px;
			width:366px;
			}
	#main .button	{
			position: absolute;
			top: 250px;
			left: 54px;
			width: 230px;
			padding: 30px 40px;
			}		
				
/* Sidebar */
					
div#sidebar	{
			background: #f2c898 url(SfHArt/fa_side_mid.jpg) repeat-y;
			float: right;
			margin: 48px 3.5em 0 1em;
			padding: 0px 24px 0px;
			text-align: left;
			width: 224px;
			}
	#sidebar  .top{
			background: #f2c898 url(SfHArt/fa_side_top.jpg) no-repeat;
			margin: 0 0 0 -24px;
			padding: 20px 24px 0;
			width:224px;
			}
			
	#sidebar p	{
			margin: 10px 0;
			}

	#sidebar .end	{
			background: #f2c898 url(SfHArt/fa_side_end.jpg) bottom no-repeat;
			margin: 0 0 0 -24px;
			padding: 0px 24px 28px;
			width:224px;
			}
			
div#sidebar2	{
			float: right;
			margin: 48px 2em 0 0;
			text-align: center;
			width: 224px;
			padding: 0px 24px 0px;
			}


/* Footer */


div#footer	{
			
			background: #2f1a15 url(SfHArt/fa-footer.jpg)  left top no-repeat;
			clear: both;
			color: #f2c898;
			font-size: .9em;
			height: 28px;
			left: 7px;
			margin-right: 20px;
			padding: 302px 26px 10px 28px;
			position: relative;
			z-index: 10;
			}
/* Sticky footer code */

html, body, #wrapper {height: 100%;
			}
body > #wrapper		{height: auto; min-height: 100%;
			}	

	#logon	{
			position: relative;
			top: 70px;
			left: 600px;
			}
	#logon	a	{
				background: url(SfHArt/main_signin.jpg) no-repeat;
				display: block;
				height: 35px;
				position: absolute;
				outline: none;
				text-indent: -900%;
				width: 154px;
				}						
	#logon	a:hover	{
				background-position: left bottom;
				}

	#logout	{
			background: #6e0700 url(SfHArt/main_red_bg.jpg);
			border: 1px solid #f2c898;
			color: #f2c898;
			left: 600px;
			padding: 4px 10px;
			position: relative;
			top: 45px;
			width: 154px;
			}
			
	#content {
			position: relative;
			top: 65px;
			background: #e5cba3 url(/SfHArt/test/screen_test1.jpg);
			width:570px;			
			height: 490px;
			font-size: 1.4em;
			margin: 30px 0px 42px 100px;
			padding: 20px;
			}
			
/* Classes */

				
.clear {clear:both;}		
.special  {background: #dd790d !important;}		
.down	{margin: 30px 0 0 0;}
                  
.enrollform {
                position: relative;
                top: 10px;
                left: 0;
                padding: 0;
            }
                  
.enrolltext {
                font-size: 1em;
                font-variant: small-caps;
            }

.fieldbox		
			{
			background: #7a1600 url(/SfHArt/main_red_bg.jpg);
			border: 2px solid #160d02;
			color: #e4c189;
			font-size: 1.1em;
			height: 18px;
			padding: 8px;
			width: 303px;
			}	
.button_login {
			background: #7a1600 url(/SfHArt/button_login.gif);
			border: 2px solid #160d02;
			color: 	#e8c756;
			height: 38px;
			margin: 20px 0;
			padding: 7px 42px;
			width: 136px;
		}