/*
 :: Client: Sarah Eberle
 :: Date:   April 2008
 :: Contents:
      - Remove default styles
      - list...

*/

/* ---------- [ Remove default styles ] -------------------- */


/* (CC) 2004 Tantek Celik. Some Rights Reserved.             */
/* http://creativecommons.org/licenses/by/2.0                   */
/* This style sheet is licensed under a Creative Commons License. */
/* Purpose: undo some of the default styling of common (X)HTML browsers */

/* link underlines tend to make hypertext less readable, 
   because underlines obscure the shapes of the lower halves of words */
:link,:visited { text-decoration:none }

/* no list-markers by default, since lists are used more often for semantics */
ul,ol { list-style:none }

/* avoid browser default inconsistent heading font-sizes */
/* and pre/code too */
h1,h2,h3,h4,h5,h6,pre,code { font-size:1em; }

/* remove the inconsistent (among browsers) default ul,ol padding or margin  */
/* the default spacing on headings does not match nor align with 
   normal interline spacing at all, so let's get rid of it. */
/* zero out the spacing around pre, form, body, html, p, blockquote as well */
/* form elements are oddly inconsistent, and not quite CSS emulatable. */
/*  nonetheless strip their margin and padding as well */
ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,body,html,p,blockquote,fieldset,input
{ margin:0; padding:0 }

/* whoever thought blue linked image borders were a good idea? */
a img,:link img,:visited img { border:none }

/* de-italicize address */
address { font-style:normal }

/* some height stuff - shrug */
.clearfix:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; }
.clearfix {display: inline-block;}
/* Hides from IE-mac \*/
* html .clearfix {height: 1%;}
.clearfix {display: block;}
/* End hide from IE-mac */
/* ---------- [ / Remove default styles ] -------------------- */


/* ---------- [ Default text styles ] -------------------- */

body 
{
    background: #FFFFFF url(../images/bg.jpg) 0 0 repeat-x;
    color: #000;
    font-family: Verdana, Helvetica, sans-serif, Arial;
    font-size: 76%;
    text-align: center;
    margin: 0;
}
p
{
	font-size: 1em;
	margin: 0;
	line-height: 1.4em;
	color: #666666;
	padding: 6px 0 6px 0;
}
p a,
p a:visited,
li a,
li a:visited
{
	color: #98c000;
	border-bottom: solid 1px #98c000;
	font-weight: normal;
}
p a:hover,
li a:hover
{
	color: #6a8f4e;
	border-bottom: dashed 1px #6a8f4e;
}
.GreenPipe
{
	font-size: 0.9em;
	color: #98c000;
    font-weight: bold;
}

/* ---------- [ / Default text styles ] -------------------- */

/* ---------- [ Page layout - container, header and columns ] -------------------- */

div#PageCentred
{
}
div#PageContainer
{ 
    width: 800px;
    margin: 0 auto 0 auto;
	text-align: left;
}
div#PageLeftColumn,
div#PageLeftColumnContact
{
	float: left;
	position: relative;
    padding: 0 0 0 0px;
    width: 440px;
}

div#PageColumnLarge
{
	float: left;
	position: relative;
    padding: 0 0 0 0px;
    width: 800px;
}

div#PageRightColumn
{
	float: left;
	padding-left: 16px;
	padding-top: 10px;
    width: 329px;
}


div#PageHeaderContainer
{
	float: left;
	position: relative;
	width: 800px;
}
div#PageHeaderContainer img
{
    float: left;
}

div#PageHeaderImage
{
	float: left;
	position: relative;
}
div#PageContent
{
	float: left;
	position: relative;
    width: 800px;
    padding: 5px 0 0 0;
}
div#PageContentInnerContainer
{
	float: left;
	padding: 0;
	width: 800px;
	background: #fff url(../images/main-bg.gif) 0 0 no-repeat;
}

div#PageContentInner
{
	float: left;
}
div#BannerContainer
{
    float: left;
    height: 198px;
    background: url(../images/grayline_mainimg.gif) 0 bottom no-repeat;
}

/* ---------- [ / Page layout - container, header and columns ] -------------------- */


/* ---------- [ Navigation ] -------------------- */

div#PageNavigation 
{ 
	float: left;
	position: relative;
	width: 576px;
	height: 85px;
}              
#Navigation 
{ 
	position: absolute;
	bottom: 0;
	right: 0;
	list-style: none; 
}
#Navigation li
{ 
	float: left;
	font-size: 1.0em;
	background: url(../images/navigation/nav-left.gif) left top no-repeat;
	padding: 0px;
	height: 33px;
}
#Navigation li#Selected
{ 
	float: left;
	background: url(../images/navigation/nav-left-sel.gif) left top no-repeat;
	color: #666666;
}

#Navigation li a,
#Navigation li a:visited, 
#Navigation li a:active
{ 
	float: left;
	color: #6a8f4e; 
	border-bottom: none; 
}
#Navigation li a:hover   
{ 
	color: #666;
	border-bottom: dashed 1px #666666;

}

.NavigationItem
{
	float: left;
	padding: 9px 9px 0 9px;
	background: url(../images/navigation/nav-right.gif) right top no-repeat;
	height: 24px;
}
.NavigationItemSelected
{
	float: left;
	padding: 9px 9px 0 9px;
	background: url(../images/navigation/nav-right-sel.gif) right top no-repeat;
	height: 24px;
}
.NavigationItemSelected span
{
	float: left;
	border-bottom: solid 1px #666666;
}

/* ---------- [ / Navigation ] -------------------- */

/* ---------- [ Boxouts ] -------------------- */

.IntroBoxout
{
    float: left;
    width: 430px;
    /*height: 427px;*/
    background: url(../images/intro-panel-bg-top.jpg) 4px 0 no-repeat;
    padding: 30px 0 0 10px;
}
.IntroBoxoutFooter
{
    float: left;
    width: 430px;
    height: 35px;
    background: url(../images/intro-panel-bg-bottom.jpg) 4px 0 no-repeat;
    padding: 0 0 0 10px;
}

#IntroBoxoutLarge
{
    float: left;
    width: 780px;
    /*height: 1000px;*/
    background: url(/images/products/intro-panel-bg-top-780.jpg) 10px 0 no-repeat;
    padding: 30px 10px 0 10px;
}
#IntroBoxoutFooterLarge
{
    float: left;
    width: 780px;
    height: 35px;
    background: url(../images/products/intro-panel-bg-bottom-780.jpg) 10px 0 no-repeat;
    padding: 0 10px;
}

#IntroBoxoutLarge h2, #IntroBoxoutLarge h3
{
	padding: 10px 0 0 30px;
}

img.TableImg 
{
	float: left;
	padding-right: 15px;	
}

a img.ProductsImg
{
	margin: 0 0 0 20px;
}

.FontVerdana
{
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 0.8em;
	color: #666;
	font-style: normal;
}

.GreenBorder 
{

	padding: 0 10px 12px 10px;
	margin-bottom: 12px;
	background: url(/images/products/greenline_long_780.gif) 5px bottom no-repeat;
}

#Signature
{
    background: url(../images/about/intro-panel-bg-bottom-sig.jpg) 4px 0 no-repeat;
    height: 88px;
}
#Splash
{
    background: url(../images/concept/intro-panel-bg-top-splash.jpg) 4px 0 no-repeat;
}
div#PageLeftColumn img
{
    float: left;
    padding: 8px 0 8px 14px;
}

div#PageColumnLarge a img
{
    float: left;
    padding: 8px 0 8px 5px;
}

div#PageLeftColumnContact img
{
    float: left;
    padding: 0;
}
div#NewsBoxout img
{
    float: left;
    padding-left: 0px;
}
div#PageLeftColumn p,
div#FullWidthColumn p,
div#CenterColumn p,
div#PageColumnLarge p
{
    padding: 6px 25px 6px 30px;
}
.ContactIntro
{
    padding: 6px 25px 6px 30px;
}


div#NewsBoxout
{
    float: left;
    width: 430px;
    padding: 0 0 0 5px;
}
div#NewsBoxout p
{
    float: left;
    padding: 6px 25px 6px 8px;
    width: 288px;
}
.NewsItem
{
    float: left;
    width: 403px;   
    padding-bottom: 8px;
    padding-left: 25px;
}
div#NewsBreaker
{
    float: left;
    font-size: 0;
    height: 10px;
    width: 400px;
    border-bottom: dotted 1px #6E8746;
}
.NewsTitle 
{
    float: left;
    width: 218px;   
}
.NewsDate 
{
    float: left;
    width: 180px;  
    text-align: right;
    font-size: 0.8em;
    color: #666666;
    padding: 8px 5px 10px 0;
}

.PlainBoxout
{
    float: left;
    width: 329px;
    padding: 14px 0 0 0;
}
div.PlainBoxout img
{
    padding-left: 5px;
}
div.ConceptStageContainer
{
    float: left;
    padding-bottom: 10px;
}
div.ConceptStageHeader
{
    float: left;
    width: 314px;
    height: 40px;
    padding-top: 5px;
}
div.ConceptStageHeader img
{
    float: left;
    padding: 0 0 0 5px;
}
div.ConceptStage
{
    float: left;
    width: 305px;
    padding: 0px 7px 10px 7px;
    background: url(../images/concept/stage_bg.gif) 5px bottom repeat-y;
}
div#FullWidthColumn
{
	float: left;
    padding: 30px 30px 0 10px;
}

div#CenterColumn
{
	float: left;
    padding: 30px 0 0 10px;
    width: 420px;
}
div#NarrowLeftColumn
{
	float: left;
	width: 153px;
    padding: 30px 0 0 14px;
}
div#NarrowRightColumn
{
	float: left;
	width: 165px;
    padding: 30px 0 0 10px;
}

/* ---------- [ / Boxouts ] -------------------- */

/* ---------- [ Portfolio specific ] -------------------- */

div.PortfolioContainer,
div.PortfolioContainerFirst
{
    float: left;
    padding-top: 2px;
    padding-bottom: 2px;
}
div.PortfolioContainerFirst
{
    padding-top: 10px;
}
div.PortfolioBoxout
{
    float: left;
    border: solid 1px #E8E7ED;
    width: 161px;
    padding: 2px;
}

.ProjectText,
#ProjectTextSel
{
    float: left;
    width: 156px;
    background: #F0F3EC url(../images/portfolio/arrow.gif) 0 0 no-repeat;
    padding: 0px 5px 5px 0px;
    display: block;
}
#ProjectTextSel
{
    background-color: #6B8F4F;
}
.ProjectText p,
#ProjectTextSel p
{
    padding: 0px;
}
.ProjectText p a,
.ProjectText p a:visited
{
    display: block;
    border: none;
    color: #5C5B60;
    padding-top: 5px;
    padding-left: 26px;
}
#ProjectTextSel p a,
#ProjectTextSel p a:visited
{
    display: block;
    border: none;
    color: #98c000;
    padding-top: 5px;
    padding-left: 26px;
}

.ProjectText p a:hover
{
    color: #98c000;
    border: none;
}
.PhotoRight
{
    margin-left: 7px;
}
/*div.link-container{ padding: 2px 0; } , div.link-container-first */
/*div.link-container-first { padding-top: 10px; }*/
/*div.link-boxout { border: solid 1px #E8E7ED; width: 440px; padding: 2px 2px 2px 1px; }
div.LinkText { width: 280px; background: #F0F3EC url(images/portfolio/arrow.gif) 0 0 no-repeat; padding: 0 5px 5px 0; display: block; }
div.LinkText p { padding: 0; }
	div.LinkText p a:link, div.LinkText p a:visited { border: solid 1px green; display: block; border-bottom: none; text-decoration: none; color: #5C5B60; padding-top: 5px; padding-left: 26px; }
	div.LinkText p a:hover, div.LinkText p a:active { color: #98c000; border-bottom: none; text-decoration: none; }
	div.LinkImg a:link, div.LinkImg a:visited, div.LinkImg a:hover, div.LinkImg a:active { text-decoration: none; border-bottom: none; }*/

.LinkContainer
{
    float: left;
    padding-bottom: 15px;
}

.LinkBoxout
{
    border: solid 1px #E8E7ED; 
    width: 414px; 
    padding: 2px 2px 2px 2px;
    margin-left: 21px;
    /*#E8E7ED*/
}
.LinkText
{
    float: left;
    width: 279px;
    background: #F0F3EC url(../images/portfolio/arrow.gif) 0 0 no-repeat;
    padding: 0px 5px 5px 0px;
    display: block;
}
.LinkText a,
.LinkText a:visited
{ 
    display: block; 
    border-bottom: none; 
    text-decoration: none; 
    color: #5C5B60; 
    padding: 1px 5px 0px 30px;
}
.LinkText a:hover,
.LinkText a:active
{
    border-bottom: none; 
    color: #98c000;
}

div#NarrowRightColumn img
{
    float: left;
    padding: 2px;
    border: solid 1px #E8E7ED;
    margin-top: 7px;
    opacity: 0.6;
    filter: alpha(opacity=60);
}

.small-font
{
    font-size: 0.8em;
}
/* ---------- [ / Portfolio specific ] -------------------- */

/* ---------- [ Lists ] -------------------- */

ul#ListBullet
{ 
	clear: both;
	list-style: disc; 
	padding: 5px 0 5px 30px;
	list-style-position: inside;
}
ol#ListBullet
{ 
	clear: both;
	list-style-type:lower-alpha; 
	padding: 5px 0 5px 30px;
	list-style-position: inside;
}
#ListBullet li 
{ 
	margin: 1px; 
	padding: 3px 0 3px 0px;
	color: #666666;
	line-height: 1.4em;
}

/* ---------- [  /Lists ] -------------------- */


/* ---------- [ Header styles ] -------------------- */

h1
{
	margin: 0;
	font-family: Times New Roman;
	font-size: 2.3em;
	font-weight: normal; 	
	color: #6a8f4e;
	line-height: 1.0em;
	padding: 0 0 12px 30px;
	background: url(../images/greenline_long.gif) 21px bottom no-repeat;
}
h2
{
	margin: 0;
	font-family: Times New Roman;
	font-size: 2.0em;
	font-weight: normal; 	
	color: #6a8f4e;
	line-height: 1.0em;
	padding: 0 0 12px 30px;
}
div#PageRightColumn h2
{
	padding-left: 34px;
}

div#NewsBoxout h2
{
	padding: 5px 0 12px 30px;
	background: url(../images/greenline_long.gif) 21px bottom no-repeat;
}
.ShortUnderline
{
	background: url(../images/greenline_short.gif) 21px bottom no-repeat;
}
.IconSplash
{
    background: url(../images/icon_splash.gif) 0 0 no-repeat;
    padding-top: 10px;
}
div#CenterColumn .IconSplash
{
    background: url(../images/icon_splash.gif) 15px 0 no-repeat;
    padding-top: 10px;
}
.IconTulip
{
    background: url(../images/icon_tulip.gif) 0 0 no-repeat;
    padding-top: 10px;
}
.IconMedal
{
    background: url(../images/icon_medal.gif) 0 0 no-repeat;
    padding-top: 10px;
}
h3
{
	margin: 0;
	font-family: Times New Roman;
	font-size: 1.5em;
	font-weight: normal; 	
	color: #6a8f4e;
	line-height: 1.0em;
	padding: 5px 0 4px 0px;
}
h3 a,
h3 a:visited
{
    color: #6a8f4e;
}
h3 a:hover
{
	color: #98c000;
	border-bottom: solid 1px #98c000;
}
div#PageRightColumn h3
{
    padding-left: 12px;
	background: url(../images/greenline_short.gif) 12px bottom no-repeat;
	padding-bottom: 12px;
}
div#FullWidthColumn h2
{
	padding: 12px 0 12px 30px;
}
div#CenterColumn h2
{
	padding: 12px 0 12px 45px;
}
div#FullWidthColumn h3,
div#CenterColumn h3
{
	padding: 5px 0 4px 30px;
}
div#NarrowLeftColumn h3,
div#NarrowRightColumn h3
{
	padding-left: 5px;
	background: url(../images/greenline_narrowcol.gif) 0px bottom no-repeat;
	width: 153px;
	padding-bottom: 10px;
}
div#PageRightColumn p
{
    padding-left: 12px;
    padding-right: 14px;
}
h4
{
	clear: both;
	margin: 0;
	font-family: Times New Roman;
	font-size: 1.2em;
	font-weight: normal; 	
	color: #6a8f4e;
	line-height: 1.0em;
	padding: 8px 0 4px 30px;
}


/* ---------- [ / Header styles ] -------------------- */

/* ---------- [ Form styles ] -------------------- */

.SelectStyle
{
	border: solid 1px #7F9DB9;
	margin: 1px;
	color: #666666; 
}
.ButtonStyle
{
	padding: 5px 0 0 0;
}
.FormRow
{
	float: left;
	width: 300px;
	padding-bottom: 15px;
}
legend
{
	color: #666666;
	font-weight: bold;
}
label
{
	font-weight: bold;
	width: 120px;
	color: #666666;
}
.InputStyle
{
    border: 1px solid #666666;
}
.FormRowButton
{
    padding-left: 110px;
}
/* ---------- [ / Form styles ] -------------------- */

/* ---------- [ Footer styles ] -------------------- */


div#PageBottom
{
	float: left;
	height: 8px;
	width: 800px;
	background: #FFFFFF url(../images/page-bottom.gif) 0 bottom no-repeat;
	font-size: 0;
	padding: 0; 
	margin: 0;

}
div#PageFooter
{
	float: left;
	background: #ffffff;
	padding-bottom: 20px;
	width: 800px;
	margin: 0;
	color: #000000;
}
div#FooterLinksContainer
{
	float: left;
}
#FooterLinks 
{
	float: left;
	padding-left: 25px;
}
#FooterLinks li
{
	font-size: 0.8em;
	color: #868688;
	float: left;
	padding: 12px 0px 12px 10px;
}
#FooterLinks a,
#FooterLinks a:visited
{
	color: #868688;
	border: none;
}
#FooterLinks a:hover
{
    color: #98c000;
	border-bottom: 1px dashed #98c000;
}
.FooterLinkBreaker
{
	background: url(../images/footer-break.gif) right 0 repeat-y;
	
}

/* ---------- [ Form styles ] -------------------- */

fieldset
{
	width: 310px;
	border: none;
	padding: 5px 0 5px 12px;
}
legend
{
	font-weight: normal;
}
label
{
    float: left;
	font-weight: normal;
	width: 110px;
	padding-top: 2px;
}
div#CheckboxContainer label
{
	width: 120px;
}

.FormElement
{
    float: left;
}
textarea
{
    font-family: Arial, Helvetica, sans-serif, Verdana;
    font-size: 1.0em;
}
.MandatoryField
{
    color: Red;
    font-weight: bold;
}
.visibleDiv
{
    float: left;
    width: 210px;
    padding-left: 110px;
    color: red;
    display: block;
    font-size: 0.9em;
}
.hiddenDiv
{
    display: none;
}
/* ---------- [ / Form styles ] -------------------- */

/* ---------- [ Lightbox for gallery popup ] -------------------- */

#lightbox{
	position: absolute;
	top: 40px;
	left: 0;
	width: 100%;
	z-index: 100;
	text-align: center;
	line-height: 0;
	}

#lightbox a img{ border: none; }

#outerImageContainer{
	position: relative;
	background-color: #fff;
	width: 250px;
	height: 250px;
	margin: 0 auto;
	}

#imageContainer{
	padding: 10px;
	}

#loading{
	position: absolute;
	top: 40%;
	left: 0%;
	height: 25%;
	width: 100%;
	text-align: center;
	line-height: 0;
	}
#hoverNav{
	position: absolute;
	top: 0;
	left: 0;
	height: 100%;
	width: 100%;
	z-index: 10;
	}
#imageContainer>#hoverNav{ left: 0;}
#hoverNav a{ outline: none;}

#prevLink, #nextLink{
	width: 49%;
	height: 100%;
	background: transparent url(../images/lightbox/blank.gif) no-repeat; /* Trick IE into showing hover */
	display: block;
	}
#prevLink { left: 0; float: left;}
#nextLink { right: 0; float: right;}
#prevLink:hover, #prevLink:visited:hover { background: url(../images/lightbox/prevlabel.gif) left 15% no-repeat; }
#nextLink:hover, #nextLink:visited:hover { background: url(../images/lightbox/nextlabel.gif) right 15% no-repeat; }


#imageDataContainer{
	font: 10px Verdana, Helvetica, sans-serif;
	background-color: #fff;
	margin: 0 auto;
	line-height: 1.4em;
	}

#imageData{
	padding:0 10px;
	}
#imageData #imageDetails{ width: 70%; float: left; text-align: left; }	
#imageData #caption{ font-weight: bold;	}
#imageData #numberDisplay{ display: block; clear: left; padding-bottom: 1.0em;	}			
#imageData #bottomNavClose{ width: 66px; float: right;  padding-bottom: 0.7em;	}	
		
#overlay{
	position: absolute;
	top: 0;
	left: 0;
	z-index: 90;
	width: 100%;
	height: 500px;
	background-color: #000;
	filter:alpha(opacity=60);
	-moz-opacity: 0.6;
	opacity: 0.6;
	}
	

.clearfix:after {
	content: "."; 
	display: block; 
	height: 0; 
	clear: both; 
	visibility: hidden;
	}

* html>body .clearfix {
	display: inline-block; 
	width: 100%;
	}

* html .clearfix {
	/* Hides from IE-mac \*/
	height: 1%;
	/* End hide from IE-mac */
	}	

/* ---------- [ Lightbox for gallery popup ] -------------------- */