@charset "UTF-8";
/* CSS Document */
* {padding: 0; margin: 0;}


body {
	background-color:#222222; 
	font-family: 'Raleway', Arial, Helvetica, sans-serif;
	font-size: 12px;
	line-height:160%;	
	color:#707070;
	text-align:left;

}


/*divs ______________________*/

#main {
	margin:0em auto;
	width:1480px;
	background-image:url(images/SUorangebgT2.png);
}

#inner {
	width: 800px;
	margin:0em auto;
	background-color:#e6e6e6;
}

#brand {
	text-align:center;
	background:#222222;
}

#nav {padding-top:4px;
	padding-bottom:4px;
	padding-left:20px;
	background:#404040}
	
#content {
	width:800px; margin-top:7px; min-height:600px;
}


#footer {margin:0em auto;
	width:1480px; min-height:110px; 
	background:#404040; }	

#footerinner {margin:0em auto; width:760px; padding-top:12px;}
#Lfoot {float:left; text-align:left;}
#Rfoot {text-align:right; }
#Rfoot a:link {color:#fbb040;}

#footerline {margin:0em auto;
	width:1480px; height:6px; 
	background:#fbb040; }
#heading { width:650px;}
	

/*built-ins ______________________*/
	
a { color:#c5c5c5; font-size:10px;
text-decoration:none; }

a:link {
	color:#c5c5c5;
	text-decoration: none;
	border:none}

a:hover {
	color: #f97735;
	text-decoration: none;
	border:none}
	
a:active {
	text-decoration:underline, f97735, 3px;
	border:none;
	color:#f97735;
}

li {display:inline; margin-right:1em; list-style-type:none; padding-bottom:3px;
	padding-top:3px;}

.portimg {margin-left:18px;
margin-top:18px;}
td{width:258px; vertical-align:top;}

/*type ______________________*/

p{		color:#444444;
}

h1{ 	color:#222222;
	font-size:28px;
	line-height:180%;
	padding-left:20px;
	padding-top:20px;
	text-align:left;
	font-weight:300;
}

h2
{font-size:13px;
	color:#666666;
	padding-left:20px;
	font-weight:400;
	line-height:150%;
	margin-bottom:10px;
	}
	
	
h3 { }	

h4 { color:#666666;
	font-size:12px; 
	padding-left:20px;
	font-weight:400;
	line-height:140%;}
	
h5 { color:#fbb040;
	font-size:11px;
	line-height:180%;
	font-weight:400; 
	}

h6 {color:#666666;
	font-size:11px; 
	padding-left:20px;
	padding-top:6px;
	font-weight:400;
	line-height:130%;  }
.here {color: #f97735; font-size: 10px;}
	
/*adornment-----------------*/
#orangedash {
	background-color:#fbb040; width:50px; height:4px;
	margin-left:20px; margin-top:8px; margin-bottom:8px;}
#orangedashspaceafter {
	background-color:#e6e6e6; width:50px; height:8px;
}


/*slides --------------*/
#viewerX
{text-align:left; margin-left:20px;}

#viewerX .-slideswrap
{
position:absolute;
overflow:hidden;
width:760px;
height:300px;
}

#viewerX .-output
{
border:0;
margin:0;
padding:0 5px;
position:relative;
z-index:1;
font-family:Arial,sans-serif;
}

#viewerX .-output_1
{
font-size:18px;
color:#000000}

#viewerX .-output_2
{
font-size:12px;
color:#FF0000}

#viewerX .-outputwrap
{
left:3px;width:760px;bottom:3px;min-height:56px;
border: 0px none;
margin:0;
padding:0;
position: absolute;
}

#viewerX .-outputbg
{
border: 0px none;
margin:0;
padding:0;
position: absolute;
border-radius:3px;
width:100%;
height:100%;
opacity:0.4;background-color:#FFFFFF}


#viewerX .-dotswrap
{
position: absolute;
right:30px;
bottom:15px;
white-space:nowrap;
text-align:right;
z-index:12000;
border: 0; margin:0; padding:0; }

#viewerX .-dot
{
width:8px;
height:8px;
border-radius:6px;
padding:0;
margin:0 0 0 5px;
border:1px solid #555555;
display:inline-block;
cursor:pointer !important;
border-color:#555555;background-color:#ffffff}

#viewerX .-dot:hover { background-color:#ffffff }

#viewerX .-dot.-on { background-color:#f97735 }

#viewerX .-link {
text-decoration:none !important;
border:0px none !important;
padding:0 !important;
overflow:hidden !important;
width:760px !important;
height:300px !important;
position: absolute !important;
left:0;
top:0;
visibility:hidden; }

#viewerX .-slideimg {
border: 0px none !important;
padding:0 !important;
position: absolute !important;
height:300px; }

#viewerX-buttonback,#slideful-buttonforward{
border: 0px none !important;
padding:0 !important;
margin:0 !important;
position: absolute !important;
z-index:20000;
top:50%;
height:50px;
margin-top:-25px !important;
cursor:pointer;
opacity:0.8;
}
#viewerX-buttonforward{
right:0;
}

#viewerX-buttonback:hover
,#viewerX-buttonforward:hover
{
opacity:1;
}



/*scrollable --------------*/	



#image_wrap {
    /* dimensions */
    width:794px;
    padding:15px 0;
 
    /* centered */
    text-align:center;
    /* some "skinning" */
    background-color:#efefef;
    border:2px solid #fff;
    outline:1px solid #ddd;
    -moz-ouline-radius:4px;
}
	
	/*
root element for the scrollable.  when scrolling occurs this
element stays still.
*/
.scrollable {
  /* required settings */
  position:relative;
  overflow:hidden;
  width: 660px;
  height:90px;
}
 
/*
root element for scrollable items. Must be absolutely positioned
and it should have a extremely large width to accommodate scrollable
items.  it's enough that you set width and height for the root element
and not for this element.
*/
.scrollable .items {
  /* this cannot be too large */
  width:20000em;
  position:absolute;
}
 
/*
a single item. must be floated in horizontal scrolling.  typically,
this element is the one that *you* will style the most.
*/
.items div {
  float:left;
}