@import url('button.css');


/*

Joel Gaeddert
http://www.flinthillsdesign.com
Copyright 2010 Flint Hills Design, LLC

*/





/*==============  Browser reset as recommended by Eric Meyer  ========== */
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td {
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;
	font-style: inherit;
	font-size: 100%;
	font-family: inherit;
}
/* remember to define focus styles! */
:focus { outline: 0; }
body { line-height: 1; color: black; background: none; }
ol, ul { list-style: none; }
/* tables still need 'cellspacing="0"' in the markup */
table { border-collapse: separate; border-spacing: 0; }
caption, th, td { text-align: left; font-weight: normal; }
blockquote:before, blockquote:after, q:before, q:after { content: ""; }
blockquote, q { quotes: "" ""; }
/* ===========================  End of Reset  ==============================*/


body { background: #333; font-family: Verdana,Arial,sans-serif; color:#666; font-size: 14px; line-height: 140%; background-image: url(/_images/BGD_03.jpg); background-repeat: repeat; background-attachment: fixed; }
#ClientCenterHeader {width:960px;text-align:right; margin:10px auto 10px; font-size:12px; }
	#ClientCenterHeader a:link, #ClientCenterHeader a:visited { color:white; text-decoration: none; }
	#ClientCenterHeader a:hover { text-decoration: underline; }

#header { width:960px; margin:10px auto 0 auto; border-bottom: 1px solid #333; }

#nav { list-style-type:none; height:18px; width:960px; margin:auto; background: white; font-size:15px; padding:8px 0 8px 0; border-bottom:1px solid #eee; }
	#nav li { float:left; margin-left:65px; font-weight:100; }
	#nav #contact { float:right; margin-right:65px; font-weight:bold; }
	#nav #contact a:link, #nav #contact a:visited { color:#dd8800; }
	
	
	

#menu { margin:0 auto 10px; padding:0; list-style: none; clear:both; width: 960px; height: 44px;}
#menu li { overflow: hidden; text-indent: -9999px; display: inline; float:left; }
#menu li a { background: url('/_images/sprite.png') no-repeat; width: 100%; height: 100%; display: block; }

#menu li#home { width: 210px; height: 44px;}
#menu li#home a { background-position: 0 0;}
#menu li#home a:hover { background-position: 0 -65px;}
#menu li#home a.selected { background-position: 0 -130px;}

#menu li#principles { width: 125px; height: 44px;}
#menu li#principles a { background-position: -210px 0;}
#menu li#principles a:hover { background-position: -210px -65px;}
#menu li#principles a.selected { background-position: -210px -130px;}

#menu li#projects { width: 125px; height: 44px;}
#menu li#projects a { background-position: -335px 0;}
#menu li#projects a:hover { background-position: -335px -65px;}
#menu li#projects a.selected { background-position: -335px -130px;}

#menu li#blog { width: 125px; height: 44px;}
#menu li#blog a { background-position: -460px 0;}
#menu li#blog a:hover { background-position: -460px -65px;}
#menu li#blog a.selected { background-position: -460px -130px;}

#menu li#about { width: 125px; height: 44px;}
#menu li#about a { background-position: -585px 0;}
#menu li#about a:hover { background-position: -585px -65px;}
#menu li#about a.selected { background-position: -585px -130px;}

#menu li#support { width: 125px; height: 44px;}
#menu li#support a { background-position: -710px 0;}
#menu li#support a:hover { background-position: -710px -65px;}
#menu li#support a.selected { background-position: -710px -130px;}

#menu li#contact { width: 125px; height: 44px;}
#menu li#contact a { background-position: -835px 0;}
#menu li#contact a:hover { background-position: -835px -65px;}
#menu li#contact a.selected { background-position: -835px -130px;}




	
#projects-menu-wrapper { overflow: auto; width: 960px; margin:0 auto 15px; background: url('/_images/scroll-pane-background.png'); }


#projects-menu { margin:0 auto; padding:0 39px; list-style: none; clear:both; width: 880px; height: 44px;}
#projects-menu li { overflow: hidden; text-indent: -9999px; display: inline; float:left; }
#projects-menu li a { background: url('/_images/sprite.png') no-repeat; width: 100%; height: 100%; display: block; }

#projects-menu li#projects-menu-websites { width: 146px; height: 140px;}
#projects-menu li#projects-menu-websites a { background-position: -40px -300px;}
#projects-menu li#projects-menu-websites a:hover { background-position: -40px -450px;}
#projects-menu li#projects-menu-websites a.selected { background-position: -40px -450px;}

#projects-menu li#projects-menu-apps { width: 146px; height: 140px;}
#projects-menu li#projects-menu-apps a { background-position: -186px -300px;}
#projects-menu li#projects-menu-apps a:hover { background-position: -186px -450px;}
#projects-menu li#projects-menu-apps a.selected { background-position: -186px -450px;}

#projects-menu li#projects-menu-exhibits { width: 146px; height: 140px;}
#projects-menu li#projects-menu-exhibits a { background-position: -332px -300px;}
#projects-menu li#projects-menu-exhibits a:hover { background-position: -332px -450px;}
#projects-menu li#projects-menu-exhibits a.selected { background-position: -332px -450px;}

#projects-menu li#projects-menu-print { width: 146px; height: 140px;}
#projects-menu li#projects-menu-print a { background-position: -478px -300px;}
#projects-menu li#projects-menu-print a:hover { background-position: -478px -450px;}
#projects-menu li#projects-menu-print a.selected { background-position: -478px -450px;}

#projects-menu li#projects-menu-marketing { width: 146px; height: 140px;}
#projects-menu li#projects-menu-marketing a { background-position: -624px -300px;}
#projects-menu li#projects-menu-marketing a:hover { background-position: -624px -450px;}
#projects-menu li#projects-menu-marketing a.selected { background-position: -624px -450px;}

#projects-menu li#projects-menu-identities { width: 146px; height: 140px;}
#projects-menu li#projects-menu-identities a { background-position: -770px -300px;}
#projects-menu li#projects-menu-identities a:hover { background-position: -770px -450px;}
#projects-menu li#projects-menu-identities a.selected { background-position: -770px -450px;}
	
	
	

	
#content { width:960px; margin:0 auto; background: #fff; overflow: auto; /*-webkit-border-radius: .5em; -moz-border-radius: .5em; border-radius: .5em;*/ }
/* These are homepage content styles */
#content_left { width:600px; float:left; }
#content_right { width:360px; float:right; }

#main-content-right { width:500px; float:right; padding-right:100px; padding-top:20px; }
#main-content-left { width:295px; float:left; padding-left:65px; padding-top:20px; }

#footer { width:960px; background: url('_images/FooterBackground.jpg') top center; height:150px; margin:0 auto; font-size:12px; padding-top:30px; }
	#footer a:link, #footer a:visited { color: #6A6DBA; text-decoration: none;  }
	#footer a:hover { text-decoration: underline; }
	#footer .BasicList { margin:0; }
	#footer .BasicList li { margin-left:4px; }
	#footer #footer_portfolio { width:220px; padding-left:60px; float:left; }
	#footer #footer_snippets { width:320px; float:left; }
	#footer #footer_contact { width:360px; float:left; }
		#footer #footer_contact #footer_phone { padding-top:6px; }
#copyright { width:960px; margin: 6px auto 20px; color:#999; font-size:10px; text-align: center; }	
	#copyright p { color: #999; }
	
h1 { font-size:14px; color:#333; font-weight: bold; }
h3 { font-size:18px; color:#333; font-weight:bold; padding-bottom:4px; margin-bottom:0; padding-top:30px; border-bottom:1px dotted #ccc; }
h4 { font-size:14px; color:#666; font-weight:bold; padding-bottom:0; margin-bottom:0; padding-top:12px; }
h5 { font-size:12px; color:#666; font-weight:bold; padding-bottom:0; margin-bottom:0; padding-top:6px; }
#content p { color:#666; font-size:12px; line-height:18px; margin:2px 0 10px; }

a:link, a:visited { color: #6A6DBA; text-decoration: none;  }
a:hover { text-decoration: underline; }

#BasicButton {background: #6A6DBA; color: #FFFFFF; -moz-border-radius: 4px; -khtml-border-radius: 4px; -webkit-border-radius: 4px; font-size: 11px; font-weight: bold; text-decoration: none; margin: 0px; padding: 3px 6px; border: 1px solid #666; vertical-align: middle; }
#BasicButton:hover { background: #333; }
#FooterEmail { color:#6A6DBA; font-size:12px; margin:15px 3px 2px 0; padding:4px 0 4px 3px; background:#eee; border:1px solid #ccc; width:180px; }


.LeftHalf { margin:0 30px 0 60px; float:left; width:390px; }
.RightHalf { margin:0 60px 0 30px; float:right; width:390px; }

.LeftThird { }
.MiddleThird { }
.RightThird { }


/*----------------------- Lists ----------------------*/		
ul.BasicList { padding-left:.25em; font-size: 12px;}
ul.BasicList li { list-style-type: disc; margin-left:2em;}
ul.BasicList ul { margin-left:1.5em; margin-bottom:1em;}
ul.BasicList ul li { list-style-type:square; }
ul.BasicList ul ul { margin-left:1.5em; margin-bottom:.5em;}
ul.BasicList ul ul li { list-style-type:square; }

ol.BasicList { padding-left:.25em;}
ol.BasicList li { list-style-type:decimal; margin-left:2em;}
ol.BasicList ol { margin-left:1.5em; margin-bottom:1em;}
ol.BasicList ol li { list-style-type:square; }
ol.BasicList ol ol { margin-left:1.5em; margin-bottom:.5em;}
ol.BasicList ol ol li { list-style-type:square; }


/*--------------------- General Styles ----------------*/
.floatRight { float:right; }
.floatLeft { float:left; }
.clearer { clear:both; }
strong { font-weight:bold; }
em { font-style: italic; }