/*-------------------------------------------------------------

Style Sheet: Satsu
version:   3.0
author:    Satsu
website:   http://www.satsu.co.uk/


/* =Body ID's
-------------------------------------------------------------*/


/* =Core Layout
-------------------------------------------------------------*/

body {
	font-size: 62.5%;										/* set 1em = 10px */
	font-family: lucida grande, tahoma, verdana, arial, sans-serif;
	text-align: center;
	color: #333; 
	background: #f3f3f4 url(../images/ui/background.jpg) no-repeat top center;
	}
	
.container_12 { position: relative; text-align: left; }




hr { display: none; }

p, li { font-size: 1.2em;}

li p, li h2, li h3, li li	{ font-size: 1em; }

p { line-height: 1.4em; margin: 15px 0; }

a	{ color: #4e94d6; text-decoration: none; }

a:hover { text-decoration: underline; }


/* =Headings
-------------------------------------------------------------*/

h1 { width: 180px; height: 80px; text-indent: -999px; background: transparent url(../images/ui/exis-logo.png) no-repeat top left; position: absolute; left: 10px; top: 25px; }
h1 a { display: block; width: 180px; height: 80px;}
h2 { font-size: 1.8em; text-transform: uppercase; margin-bottom: 15px; }
h3 { font-size: 1.4em; font-style: italic; font-weight: bold; font-family: arial, helvetica, sans-serif; margin: 15px 0; }
h3 a { color: #000; }
h3 a:hover { text-decoration: none; }
h4 { font-size: 1.2em; margin: 8px 0; }
h5 { font-size: 1.1em; }



/* = Pages
-------------------------------------------------------------*/
body#home { background-image: url(../images/ui/background-boxes.jpg); }
body#admin { background-image: url(../images/ui/background-admin.jpg); }
body#results { background-image: url(../images/ui/background-results.jpg); }


#intro { margin-top: 155px; height: 360px;}
#intro  h2 { text-indent: -999em; width: 428px; height: 109px; background: transparent url(../images/ui/home-intro.png) no-repeat top left;  }
#intro p { margin-right: 60px; color: #497e79; font-size: 1.4em; margin-bottom: 30px; }
#intro ul li { text-indent: -999em; width: 140px; height: 49px; display: block; float: left; margin-right: 10px; }
#intro ul li a { width: 140px; height: 49px; display: block; }
#intro ul li.admin a { background: transparent url(../images/ui/learn-more-admin.gif) no-repeat top left;   }
#intro ul li.results a { background: transparent url(../images/ui/learn-more-results.gif) no-repeat top left;  }
#intro ul li.admin a:hover { background: transparent url(../images/ui/learn-more-admin.gif) no-repeat bottom left;   }
#intro ul li.results a:hover { background: transparent url(../images/ui/learn-more-results.gif) no-repeat bottom left;  }

#content ul li { padding-left: 20px; line-height: 1.8em; background: transparent url(../images/ui/list.gif) no-repeat left 3px; color: #436d7f; border-bottom: 1px solid #ccc; }

a.more { background-color: #253139; color: #cba722; font-style: italic; font-weight: bold;font-family: trebuchet, verdana, sans-serif; padding: 12px; margin-top: 20px; display: inline-block; }


.inner #content { margin-top: 300px; }

/* =Branding
-------------------------------------------------------------*/



/* =Main Nav
-------------------------------------------------------------*/

ul#nav								{ position: absolute; top: 70px; right: 10px; font-size: 1em; line-height: 1em; margin-top: 0; }
ul#nav li 						{ display: inline; float: left; margin-left: 20px;}
ul#nav li a 					{ color: #fff; }
ul#nav li a:hover			{ color: #ffc100; }
ul#nav li a.selected 	{ color: #ffc100;  text-shadow: 1px 1px 1px #000; }





/* =Footer
-------------------------------------------------------------*/

#footer		{ padding: 15px 20px; clear: both; width: 960px; background-color: #eee; margin-bottom: 50px; border: 1px solid #ddd; }
#footer p { margin: 0 0 5px 0; font-size: 1em; }




/* =General Content
-------------------------------------------------------------*/

.screenshot { font-style: italic; font-size: 0.8em; margin-bottom: 15px; padding: 10px; }
.screenshot p { margin: 0; }












/* =Footer
-------------------------------------------------------------*/




.stepcarousel{
    position: relative; /*leave this value alone*/

    overflow: scroll; /*leave this value alone*/
    width: 550px; /*Width of Carousel Viewer itself*/
    height: 180px; /*Height should enough to fit largest content's height*/
    }
.stepcarousel img 
{
    
}
    .stepcarousel .belt{
    position: absolute; /*leave this value alone*/
    left: 0;
    top: 0;
    }

    .stepcarousel .panel{
    float: left; /*leave this value alone*/
    overflow: hidden; /*clip content that go outside dimensions of holding panel DIV*/
    margin: 10px; /*margin around each panel*/
    
    }
.stepcarousel img:hover
{
    border: solid 1px red;
}