/* REVISED SEP 21, 2010 */

@import url(reset.css); /* RESET CSS */

/* BODY
---------------------------------------------------------------------- */

body {
  font-size: 13px;
  line-height: 21px;
  font-family: "Palatino Linotype", "Book Antiqua", Palatino, serif;
  color: #333333;
  background: #F3EFEC url(/images/bg.jpg) repeat 0 0;
  text-align: left;
  letter-spacing: normal;
}

/* DEFAULT, COMMON AND CORE STYLING
---------------------------------------------------------------------- */

p { padding-bottom: 11px; }

a img { border: 0; }
a { color: #2798b7; text-decoration: none; cursor: pointer; }
a:hover { color: #000; text-decoration: underline; }

img.alignleft { float: left; display: inline; margin: 0 14px 12px 0; }
img.alignright { float: right; display: inline; margin: 0 0 14px 12px; }

.hr { height: 1px; padding-top: 4px; border-bottom: 1px solid #ccc; margin-bottom: 20px; clear: both; }

.alpha { margin-left: 0 !important; padding-left: 0 !important; }
.omega { margin-right: 0 !important; padding-right: 0 !important;}
.nopad { padding: 0 !important; }
.noborder { border: none !important; }

.clear { display: block; height: 0; font-size: 0; line-height: 0; text-indent: -4000px; clear: both; }
.notext { font-size: 0; line-height: 0; text-indent: -4000px; }

/* HEADINGS & HEADER
---------------------------------------------------------------------- */

h1 { } /* Reserved for logo */
h2 { font-size: 26px; color: #333333; font-weight: normal; letter-spacing: 0.02em;  margin-bottom: 10px; }
h3 { font-size: 15px; color: #333333; font-weight: normal; letter-spacing: 0.1em; margin-bottom: 10px; }
h4 { font-size: 15px; padding-bottom: 5px; }

div#lightburst { background: transparent url("/images/logo_burst.png") no-repeat 0 0; height:232px; width:457px; left: -150px; top: 0; position: absolute; z-index: 10; text-indent: -9999px }
div#header h1 { background: transparent url("/images/logo_freshwater.png") no-repeat 0 0; font-size:14px; height:88px; width:219px; left:0; top:10px; position:absolute; text-indent:-9999em; z-index: 100; }
div#header h1 a { display:block; height: 88px; width: 219px; }

/* LAYOUT
---------------------------------------------------------------------- */

div#wrap_bg { background: transparent url(/images/bg_water.jpg) no-repeat 50% 170px; overflow: hidden; }
div#blueoverlay { background: transparent url(/images/blueoverlay.png) repeat-x 0 0; overflow: hidden; }
div#header { margin: 0 auto; padding: 0; width: 960px; height: 128px; position: relative; }
  .interior div#header { border-bottom: 1px solid #CBC7BE; }
div#wrap_cnt { margin: 0 auto; width: 960px; position: relative; z-index: 150; padding-bottom: 40px; min-height:520px; }
div#wrap_footer { margin: 0 auto; padding-bottom: 25px; width: 960px; text-align: left; clear: both; }
  .interior div#wrap_footer { background: transparent url(/images/footer_slice.jpg) repeat-x 0 0; height: 406px; padding: 0; width: auto; position: relative; z-index: 0; }
.seperator { clear:both; display:block; position:relative;  top:82px; z-index:3000; }

/* FORMS & TABLES
---------------------------------------------------------------------- */

fieldset { border: none; }
table#list { padding: 10px 0 15px 0; }
table#list th { background: transparent url(/images/table_th.png) repeat-x 0 0; height: 31px; line-height: 31px; font-size: 16px; font-weight: bold; padding-left: 10px; }
table#list tr.row_a { background: transparent url(/images/table_td_row_a.png) repeat-x 0 0; }
table#list tr:hover { background: transparent url(/images/table_trhover.png) repeat-x 0 0; }
table#list td { padding-left: 10px; padding-right: 15px; border-bottom: 1px solid #ccc; height: 29px; line-height: 29px; }
  table#list td a { font-weight: bold; }
table#list.tall td { line-height: 20px; padding: 5px 15px 5px 10px }
table#list.tall tr.row_a { background: transparent url(/images/table_tall_td_row_a.png) repeat 0 0; }
table#list.tall tr:hover { background: transparent url(/images/table_tall_trhover.png) repeat 0 0; }

/* TYPOGRAPHY
---------------------------------------------------------------------- */

strong { font-weight: bold; }
em { font-style: italic; }
.caps { text-transform: uppercase; }
.big { font-size: 1.1em; }
.small { font-size: 0.8em; }
.featuretext { font-size: 14px; color: #FFCC00; font-weight: bold; }
.indent { padding-left: 25px; }

/* NAVIGATION & SIDEBAR
---------------------------------------------------------------------- */

#topnav { position: relative; top: 52px; left: 270px; width: 690px; height: 46px; z-index: 30;}

#topnav ul li { display:block; float:left; list-style-type:none; }
#topnav ul li a { display:block; height:46px; width:138px; background:transparent url(/images/nav.png) no-repeat 0 0; text-indent:-9009px; }
  #topnav ul li a:hover, .whoweare #topnav ul li a{ background-position: 0 -46px; }
#topnav ul li#nav_video a { width: 138px; background-position: -138px 0; }
  #topnav ul li#nav_video a:hover, .video #topnav ul li#nav_video a { background-position: -138px -46px; }
#topnav ul li#nav_web a { width: 138px; background-position: -276px 0; }
  #topnav ul li#nav_web a:hover, .web #topnav ul li#nav_web a { background-position: -276px -46px; }
#topnav ul li#nav_identity a { width: 138px; background-position: -414px 0; }
  #topnav ul li#nav_identity a:hover, .identity #topnav ul li#nav_identity a { background-position: -414px -46px;}
#topnav ul li#nav_contact a { width: 138px; background-position: -552px 0;}
  #topnav ul li#nav_contact a:hover, .contact #topnav ul li#nav_contact a { background-position: -552px -46px;}

#logonav { position: relative; top: 56px; left: 88px; color: #989898; font-size: 12px; z-index: 20; width: 125px; }
#logonav a { color: #989898; }
#logonav a:hover { color: #111; }
#logonav span { font-size: 10px; padding-bottom: 5px; }

.interior #sidenav { float: left; display: inline; width: 229px; padding: 46px 0 50px 0; }
#sidenav h3 { margin-bottom: 20px; text-align: right; }
#sidenav ul { border-top: 1px solid #E3E0DB; font-size: 13px; font-weight: bold; margin: 10px 0 0 0; }
#sidenav ul li { height: 29px; border-bottom: 1px solid #E3E0DB; }
#sidenav ul li.current,
#sidenav ul li:hover { background: transparent url(/images/sidenav_hover.png) no-repeat 0 0; }
#sidenav ul li a { display: block; padding: 4px 7px 4px 0; text-align: right; }
#sidenav ul li.current a, #sidenav ul li a:hover { }


/* HOME PAGE
---------------------------------------------------------------------- */

#flash_home { width: 960px; height: 566px; margin: 0 0 45px 0; text-align:center; position: relative; z-index: 70; }
.home #content { margin: 0 0 30px 0; }
.home #content img { clear: both; display: block; }
.cnt_block { padding: 15px 20px 5px 0; width: 300px; float: left; display: inline; }


/* FOOTER
---------------------------------------------------------------------- */

#footer_content { width: 960px; margin: 0 auto; position: relative; }
#flash_footerwave { position: absolute; width: 960px; height: 83px; z-index: 70; }
#flash_footerbub { position: absolute; width: 633px; height: 382px; z-index: 80; top: 22px; left: 140px; /*background-color: #CCC; opacity: 0.1;*/ }

#work_footer { position: relative; z-index: 90; top: 70px; width: 411px; margin: 0 auto; color: #f6f8f9; padding: 0 280px 0 269px; }
#work_footer p { padding: 15px 0 20px 0; }
#work_footer a.plunge { background: transparent url(/images/button_plunge.png) no-repeat 0 0; display: block; width: 147px; height: 20px; text-indent: -6666px; }
  #work_footer a.plunge:hover { background-position: 0 -20px; }

#footer { border-top: 1px solid #d5d4d1; text-align: left; color: #8d8c8a; padding: 5px 0 0 5px; position: relative; z-index: 95; }
.interior #footer { border-top: 1px solid #3d445f; margin-top: 140px;  }
.interior #footer a { color: #265c8b; }
#footer span { padding-right: 15px; }


/* INTERIOR PAGES
---------------------------------------------------------------------- */

.interior #content { padding: 44px 0 10px 40px; width: 460px; float: left; display: inline; }
.interior.wide #content { width: 691px; }
.interior.wide #content.whoweoverview { width: 475px; padding-top: 88px; }
.interior #content h2 { margin-bottom: 20px; }
  .interior #content.whoweoverview h2 { margin-bottom: 5px; }
.interior #content h3 { font-size: 16px; font-weight: bold; color: #2798B7; letter-spacing: 0em; margin: 0; }
.interior #content h3.dark { color: #333; }
.interior #content h5 { font-size: 12px; text-transform: uppercase; border-bottom: 1px solid #ccc; clear: both; color: #333; margin-bottom: 15px; padding-top: 5px; }

#flash_content { width: 230px; float: left; display: inline; margin: 36px 0 0 0; text-align: right; }
#side_content { width: 230px; float: left; display: inline; margin: 76px 0 0 0; text-align: right; }
p.more { padding: 20px 0; }

  /* WHO WE ARE */

  #whoweclouds { display: block; position: absolute; top: 20px; right: 0px; z-index: 10; }
  p.namelist a { display: block; float: left; margin: 0 33px 10px 0; font-weight: bold; width: 120px; }

  /* WEB SECTION */

  .port_item { float: left; width: 342px; margin-left: -4px; padding-right: 14px; position: relative; }
  .port_item.omega img { position: relative; right: -4px; }
  .port_item h3, .port_item p { padding-left: 4px; }
  .port_item.right h3, .port_item.right p { padding-left: 8px; }

  /* IDENTITY */

  div.doubleimg { float: left; width: 356px; }
  img.identitysamp { margin-left: -4px; margin-top: 3px; }
  .port_copy_right { overflow: hidden; padding-right: 10px; }

  /* CONTACT */

  #sidenav p { text-align: right; }
  #cont_block { background: transparent url(/images/contact_cont.png) repeat 0 0; border-bottom: 1px solid #d8d8d5; font-size: 16px; margin: 10px 0 7px 0; padding: 0 0 15px 0;}
  #cont_block h3 { background: transparent url(/images/contact_cont_header.png) repeat-x 0 0; height: 31px; line-height: 31px; padding-left: 10px; }
  #cont_block p { padding: 10px 0 0 10px; }
  #content #clouds { position: absolute; top: 66px; right: 15px; }

  /* OTHER PAGES */

  ul.sitemap { padding-bottom: 12px; }
  ul.disc { list-style-position: ; list-style-type: disc; margin-left: 15px; padding-bottom: 10px; }
  #col1, #col2, #col3 { width: 230px; float: left; display: inline; }


/* SCROLLER STYLES
---------------------------------------------------------------------- */
/*
	root element for the scrollable.
	when scrolling occurs this element stays still.
*/

#sliderframe{ background: transparent url(/images/frame.png) no-repeat 0 0; width: 668px; height: 388px; position: absolute; left: 265px; }
  .web #sliderframe { z-index: 1005; }

.scrollable {

	/* required settings */
	position:relative;
	overflow:hidden;
	width: 634px;
	height:540px;
  margin: 10px 0 5px 9px;
}

/*
	root element for scrollable items. Must be absolutely positioned
	and it should have a extremely large width to accomodate scrollable items.
	it's enough that you set the width and height for the root element and
	not for this element.
*/
.scrollable .items {
	/* this cannot be too large */
	width:20000em;
	position:absolute;
	clear:both;
}
  .web .scrollable .item { z-index: 900; }

.items div {
	float:left;
	width:634px;
  height:540px;
}

  .web .scrollable .item div { z-index: 900; }

#content .items div h3 { font-size: 17px; text-transform: none; padding: 24px 0 8px 0; color: #333; }

a.browse.left {
background: transparent url(/images/arrow_left.png) no-repeat 0 0;
cursor:pointer;
display:block;
height:49px;
left: 244px;
top:288px;
position:absolute;
width:53px;
z-index: 1010;
}

a.browse.right {
background: transparent url(/images/arrow_right.png) no-repeat 0 0;
cursor:pointer;
display:block;
height:49px;
right: 15px;
top:288px;
position:absolute;
width:53px;
z-index: 1010;
}

.navi { position: absolute; top: 519px; right: 36px; z-index: 1020;}

.navi a {
background: transparent url(/images/nav_slider.png) no-repeat 0 0;
display:block;
float:left;
height:13px;
margin-right:3px;
width:15px;
}

.navi li { float: left; }

.navi li a.active {
background-position: -15px 0;
}

a.player {
	display:block;
	width:634px;
	height:358px;
	text-align:center;
	color:#fff;
	text-decoration:none;
	cursor:pointer;
	background-color :#000
}

a.player:hover {
	background:-moz-linear-gradient(center top, rgba(73, 122, 173, 0.898), rgba(6, 6, 6, 0.898));
}

/* splash image */
a.player img, .items div img { margin: 0; border:0; width: 634px; height: 358px; display: block; }

a.player { }