/* ================ */
/* = CSS Reset = */
/* ================ */
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,b,u,i,center,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-size:100%;vertical-align:baseline;background:transparent; }

body { line-height:1 }
ol,ul { list-style:none }
blockquote,q { quotes:none }
blockquote:before,blockquote:after,q:before,q:after { content:'';content:none }
:focus { outline:0 }
ins { text-decoration:none }
del { text-decoration:line-through }
table { border-collapse:collapse;border-spacing:0 }
sup,sub { height: 0; line-height: 1; vertical-align: baseline; _vertical-align: bottom; position: relative;}
sup { bottom: 1.6ex; font-size: 0.625em;}
sub { top: .5ex; }

/* ================ */
/* = The 1Kb Grid = */ 
/* ================ */
.grid_0_5 { width:40px; }
.grid_1 { width:120px; }
.grid_1_5 { width:200px; }
.grid_2 { width:280px; }
.grid_2_5 { width:360px; }
.grid_3 { width:440px; }
.grid_3_5 { width:520px; }
.grid_4 { width:600px; }
.grid_4_5 { width:680px; }
.grid_5 { width:760px; }
.grid_5_5 { width:840px; }
.grid_6 { width:920px; }
.column { margin:0 20px;overflow:hidden;float:left;display:inline; }
.row { width:960px;margin:0 auto;overflow:hidden; }
.row .row { margin:0 -20px;width:auto;display:inline-block; }


/* ================ */
/* = Base Styles = */
/* ================ */
html,body { height:100%; }
body { background:#fff;font:14px/20px 'Helvetica Neue',Helvetica,Arial,sans-serif;color:#555;text-align:justify; font-weight: 200;}


ol { list-style:decimal } ul { list-style:square } li { margin-left:20px }
p,dl,hr,ol,ul,pre,table,address,fieldset { margin-bottom:20px }
hr { border:0 #fff solid;clear:both;height:0 }

h1 { font-size:50px;line-height:60px;text-transform: uppercase;font-weight:300;letter-spacing:0.1em; color: white; }
h2 { font-size:30px;line-height:40px;letter-spacing:-1px; font-weight: 200; padding-bottom: 20px;}
h3 { font-size:17px;margin-bottom: 20px; line-height: 20px; font-weight: 300;text-transform:uppercase; }
h4 { font-size:14px;line-height:20px; }
h5 { font-size:12px;line-height:20px; }
h6 { font-size:13px;line-height:20px; }

p { color:#666; }
a { color:#0b66ac; }
a:hover { color:#004e8f; }

/* ================ */
/* ================ */

#header { padding-top:20px;height:160px; }

#logo { width: 200px;}
#logo img { width: 200px; }

#nav { width: 720px; margin: 80px 0 0; }

#blurb { background:#404040;padding:20px 0;color:#ccc; }

#intro { text-align:justify; }
#intro p { margin:20px 0;line-height:40px;font-size:24px; }
#intro p .big { font-size:26px;color:#fff;}

#bar { background:#606060; height: 40px;color:#ccc; }
#bar a { line-height: 40px;}
.more { font-weight:bold;text-transform:uppercase;}

#content { padding:40px 0px; }
#clients { text-align:center; }
#footer { color:#606060;font-size:10px; }

#wrapper { min-height:100%;height:auto !important;height:100%;margin:0 auto -100px;/* the bottom margin is the negative value of the footer's height */ }
#wrapper .push { height:100px; }
#footer { background:#eee;border-top:1px solid #ddd;padding:20px 0;height:59px; }

#content .vcard { padding-left:40px;padding-bottom:20px; }
#content .vcard .fn { float:left;margin-left:-40px; }
#content .vcard .email { display:block; }

#footer p { margin-bottom:0px; font-size: 10px;}
#footer a { color:#404040; }
#footer a:hover { color:#000; }

#footer .phone { width:105px;display:inline-block; }
#footer .org { width:20px;display:inline-block;font-weight:bold; }
#footer .email { width:105px;display:inline-block; }

/* ================ */
/* = Nav Styles = */
/* ================ */
#nav ul { margin:0;padding:0;list-style:none; float:right;position:relative; }
#nav li { position:relative;display:block;margin:0;float:left;list-style-type:none; z-index:200;border:1px solid transparent; }
#nav li a { letter-spacing:1px;font-family:Arial;text-transform:lowercase; padding: 0 20px; font-size:15px;color:#999;text-align:left;display:block;line-height:30px;text-decoration:none;width:auto; }
#nav li a:hover { color:#444; }
#nav li.selected a { color:#444;  }

#nav li#magic-line { position:absolute;top:0px;left:0; z-index:100;background-color:#efefef;height:28px;-moz-border-radius: 20px; -webkit-border-radius:20px; border-radius:20px;border:1px solid #ddd; }

/* ================ */
/* = Helpers = */
/* ================ */
.center { text-align:center; }
.right { text-align:right; }
.left { text-align:left; }
.justify { text-align:justify; }

.blue-gradient { border:1px solid #004E8F;background:url(http://www.allcrunchy.com/Web_Stuff/Gradient_Generator/images/0066AC004E8F50sinusoidalFull.png) repeat-x 50% 50%; }

/* ================ */
/* = Hash Grid js = */
/* ================ */

#grid { background:url(../images/bg-grid-980.gif) repeat-y 0 0;width:980px;position:absolute;top:0;left:50%;margin-left:-490px; }
#grid .horiz { height:19px;border-bottom:1px dotted #aaa;margin:0;padding:0; }

/*color:#e9d99c;*/
#pages-nav { list-style: none; }
#pages-nav li { margin:0 40px 0 0; float: left; font-size: 14px; font-weight: 300;}
#pages-nav li a { padding-right:5px; letter-spacing:1px;color:#aaa;display:block;text-decoration:none; }
#pages-nav li a:hover { color: #ddd;}
#pages-nav li a.current { color: #eee; background:url(../images/white-up-arrow.png) no-repeat bottom center; }

/* Red-green occupied dots */
.dots a { padding-top: 10px; background:url(../images/green-dot.png) top center no-repeat }
.dots a:hover { color:#444; background:url(../images/yellow-dot.png) top center no-repeat }
.dots a.selected { color:#444; background:url(../images/red-dot.png) top center no-repeat }

div.scrollable { float:left; }

/* scrollables navigator */
div.navi a { cursor:pointer; width:8px;height:8px;float:left;margin-right:4px; background:url(../images/dots.png) 0 0px no-repeat;display:block;font-size:1px;}
div.navi a:hover { background-position:0 -8px; }
div.navi a.active { background-position:0 -16px; }

.scrollable { position:relative;overflow:hidden; width: 440px;height:290px; }
.scrollable .items { width:20000em;position:absolute;clear:both;height: 280px; overflow: hidden; }
.item { float:left;cursor:pointer;width:440px; height: 280px;  }
.navi {
  padding-top: 2px;
  height: 8px;
}
.arrows { float: right; }

a.arrow-left, a.arrow-right { border:none; background:url(../images/arrows.gif) no-repeat; width:10px; margin: 0; height:10px; display:inline-block; overflow:hidden; text-indent:-9999px; }
a.arrow-left         { background-position:0 0; }
a.arrow-left:hover   { background-position:0 -10px; }
a.arrow-left:active  { background-position:0 -20px; }
a.arrow-right        { background-position:-10px 0; }
a.arrow-right:hover  { background-position:-10px -10px; }
a.arrow-right:active { background-position:-10px -20px; }

.page .photos {  padding-top: 4px; padding-bottom: 36px;}
