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

/* Colors
  Text Brown:			#281606
  Wrapper Tan			#e4c189
  Button Gold			#e8c756
  Button Red			#7a1600
  Header Red			#bd0808
*/
  
body 	{color: #281606;  
		background: #0c1723 url(/SfHArt/bg_body_intro.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: #7a1600;
		font-size: 1.0em;
		margin: 10px 10px 20px;
		}
	
h3 		{color: #281606; 
		font-size: 1.4em;
		}
h4		{color: #cb7f08;
		font-size: 1.2em;
		}

h5		{color: #7a1600;
		font-size: 1.2em;
		margin: auto;
		padding: 5px 10%;
		}
		
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: 5px 0;
		}
li		{list-style-type:none;
		padding: 10px 0;}

		
/* id  */



div#wrapper {  
                  position: relative;
                  background: #e4c189 url(/SfHArt/test/bg_wrapper_test1.jpg);
                  background-repeat: no-repeat;
                  margin: 0 auto; /* bottom margin is the negative of the footer's height */
                 width: 812px;
                  height: 100%;
                  height: 100%;
                  min-height: 100%;
                  height: auto !important;                  
                  }

	#test2	#wrapper	{
			position: relative;
			background: #e4c189 url(/SfHArt/test/bg_wrapper_test2.jpg);
			background-repeat: no-repeat;
			margin-right: auto; 
			margin-left: auto;
			width: 812px;
			height: 100%;
			}
	#test3	#wrapper	{
			position: relative;
			background: #e4c189 url(/SfHArt/test/bg_wrapper_test3.jpg);
			background-repeat: no-repeat;
			margin-right: auto; 
			margin-left: auto;
			width: 812px;
			height: 100%;
			}
	#test4	#wrapper	{
			position: relative;
			background: #e4c189 url(/SfHArt/test/bg_wrapper_test4.jpg);
			background-repeat: no-repeat;
			margin-right: auto; 
			margin-left: auto;
			width: 812px;
			height: 100%;
			}
	#test5	#wrapper	{
			position: relative;
			background: #e4c189 url(/SfHArt/test/bg_wrapper_test5.jpg);
			background-repeat: no-repeat;
			margin-right: auto; 
			margin-left: auto;
			width: 812px;
			height: 100%;
			}
	#test6	#wrapper	{
			position: relative;
			background: #e4c189 url(/SfHArt/test/bg_wrapper_test4.jpg);
			background-repeat: no-repeat;
			margin-right: auto; 
			margin-left: auto;
			width: 812px;
			height: 100%;
			}
	#test7	#wrapper	{
			position: relative;
			background: #e4c189 url(/SfHArt/test/bg_wrapper_test2.jpg);
			background-repeat: no-repeat;
			margin-right: auto; 
			margin-left: auto;
			width: 812px;
			height: 100%;
			}
			
div#container	{
			/* setting up the sticky footer */
			padding- bottom: 120px;
			}
			
/* Header Code */										
	#test1 #header	{
			background: transparent url(/SfHArt/test/header_test1.jpg); 
			background-repeat: no-repeat;
			background-position: 2px 0  0px;
			height: 207px;
			margin: 0;
			}						
	#test2	#header	{
			background: transparent url(/SfHArt/test/header_test2.jpg); 
			background-repeat: no-repeat;
			background-position: 2px 0  0px;
			height: 207px;
			margin: 0;
			}						
    #test3  #header     {
            background: transparent url(/SfHArt/test/header_test3.jpg); 
            background-repeat: no-repeat;
            background-position: 2px 0  0px;
            height: 207px;
            margin: 0;
            }    			
	#test4	#header	{
			background: transparent url(/SfHArt/test/header_test3.jpg); 
			background-repeat: no-repeat;
			background-position: 2px 0  0px;
			height: 207px;
			margin: 0;
			}						                
    #test5  #header     {
            background: transparent url(/SfHArt/test/header_test3.jpg); 
            background-repeat: no-repeat;
            background-position: 2px 0  0px;
            height: 207px;
            margin: 0;
            }                                   
    #test6  #header     {
            background: transparent url(/SfHArt/test/header_test1.jpg); 
            background-repeat: no-repeat;
            background-position: 2px 0  0px;
            height: 207px;
            margin: 0;
            }                                   
    #test7  #header     {
            background: transparent url(/SfHArt/test/header_test2.jpg); 
            background-repeat: no-repeat;
            background-position: 2px 0  0px;
            height: 207px;
            margin: 0;
            }                                   

#content	{
			position: relative;
			background: #e5cba3 url(/SfHArt/test/screen_test1.jpg);
			width:570px;			
			height: 490px;
			font-size: 1.4em;
			margin: 30px 0px 20px 100px;
			padding: 20px;
			}
	#test2 #content	{
			position: relative;
			background: #e5cba3 url(/SfHArt/test/screen_test2.jpg);
			}
	#test3 #content	{
			position: relative;
			background: #e5cba3 url(/SfHArt/test/screen_test3.jpg);
			}

	#test4 #content	{
			position: relative;
			background: #e5cba3 url(/SfHArt/test/screen_test4.jpg);
			}
			
	#test5 #content	{
			position: relative;
			background: #e5cba3 url(/SfHArt/test/screen_test4.jpg);
			}
	#test6 #content	{
			position: relative;
			background: #e5cba3 url(/SfHArt/test/screen_result.jpg);
			}
	#test7 #content	{
			position: relative;
			background: #e5cba3 url(/SfHArt/test/screen_test1.jpg);
			}			
			

			
#footer		{			
			background: #6c0500 url(/SfHArt/test/footer_test.jpg);
			position: relative;
			height: 69px;
			z-index: 10;
			font-size: .9em;
			}

.logo		{
			position: absolute;
			top: 0;
			left: -70px;
			}
			
.btn, .btnleft, .btnmid, .btnright {
			position: absolute;
			top: 450px;
			/*left: 430px;*/
			width: 136px;
			height: 38px;
			color: 	#e8c756;
			background: #7a1600 url(/SfHArt/test/button_next_up.gif);
			padding: 7px 42px;
			margin: 20px;
		border-top: 1px solid 	#491808; 
		border-left: 1px solid #482e0c;
		border-right: 1px solid #56260a;
		border-bottom: 2px solid #160d02;
			}
			
.btnleft 
{
	left: 10px;
}
			
.btnmid
{
	left: 220px;
}
			
.btnright
{
	left: 430px;
}

.enroll {
			/* position: absolute; */
			/* top: 450px; */
			/*left: 430px;*/
			left: 10px;
			width: 136px;
			height: 38px;
			color: 	#e8c756;
			background: #7a1600 url(/SfHArt/test/enroll.gif);
			padding: 7px 42px;
			margin: 20px;
		border-top: 1px solid 	#491808; 
		border-left: 1px solid #482e0c;
		border-right: 1px solid #56260a;
		border-bottom: 2px solid #160d02;
			}

.button_login {
			position: absolute;
			top: 450px;
			/*left: 430px;*/
			left: 10px;
			width: 136px;
			height: 38px;
			color: 	#e8c756;
			background: #7a1600 url(/SfHArt/button_login.gif);
			padding: 7px 42px;
			margin: 20px;
		border-top: 1px solid 	#491808; 
		border-left: 1px solid #482e0c;
		border-right: 1px solid #56260a;
		border-bottom: 2px solid #160d02;
			}

.rad	{
		width: 24px;
		height: 20px;
		padding: 0 15px 0 0;
		background: url(/SfHArt/test/spot_yellow.gif) no-repeat;
		display: block;
		float: left;
		clear: left;
		}
.butt	{margin: 10px 0;}				
/* Sticky footer code */

html, body, #wrapper {
			height: 100%;
			}
body > #wrapper		{height: auto; min-height: 100%;
			}			
			
                  
.cpaclass         {
                  position: relative;
                  top: 200px;
                  left: 0;
                  padding: 0 35%;
                  font-size: 60px;
                  font-family: Courier,monospace;
                  }
                  
.shortclass 
                  {
                  position: relative;
                  top: 240px;
                  left: 0;
                  padding: 0 30%;
                  }
                  
.medclass 
                  {
                  position: relative;
                  top: 240px;
                  left: 0;
                  padding: 0 22%;
                  }
                  
.longclass 
                  {
                  position: relative;
                  top: 240px;
                  left: 0;
                  padding: 0 10%;
                  }
                  
.enrollform 
                  {
                  position: relative;
                  top: 10px;
                  left: 0;
                  padding: 0;
                  }
                  
.enrolltext 
                  {
                  font-size: 1em;
                  font-variant: small-caps;
                  }
                  
.downabit 
                  {
                  position: relative;
                  top: 10px;
                  left: 0;
                  padding: 0;
                  }

.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;
			}	
