* { margin:0; padding:0; }
p { margin:.25em 0 1em; line-height:1.6em; }
ul { list-style:none; }
h1 { font-size:1.25em; font-family:"Trebuchet MS", Arial, Helvetica, sans-serif; }
h2 { font-size:1.1em; font-family:"Trebuchet MS", Arial, Helvetica, sans-serif; }

h3 { font-size:1.25em; font-family:"Trebuchet MS", Arial, Helvetica, sans-serif; }
h4 { font-size:1.2em; font-style:italic; font-family:"Trebuchet MS", Arial, Helvetica, sans-serif; color:#ccc; } /* tagline */

a { color:#006; text-decoration:none; }
a:hover { text-decoration:underline; }
a img { border:0; }
td { vertical-align:top; }

/* h1 colors */
#index h1 { color:#fc0; }
#port h1 { color:#afd885; }
#about h1 { color:#bad1e8; }
#news h1 { color:#ee9667; }
#contact h1 { color:#fdedb4; }

#about h2 { color:#537da7; }
#news h2 { color:#c14603; }
#port h2 { color:#669a33; }

/* link colors */
#index p a { color:purple; }
#port p a { color:#669a33; }
#about #content a { color:#537da7; }
#news #content a { color:#e95c10; }
#contact #content a { color:#e67f05; }

#branding { position:relative; width:825px; height:112px; }
#branding #tagline { position:absolute; top:48px; right:0; }
#branding #title { position:absolute; bottom:6px; left:10px; }

#nav_sub { position:absolute; top:270px; right:-1px; width:140px; font-family:trebuchet ms,arial,helvetica,sans-serif; }
#nav_sub ul li { line-height:2em; }
#nav_sub ul li.active { padding-right:13px; }
#nav_sub ul li a { color:#6b6c69; padding-right:13px; }
#nav_sub ul li a:hover { color:#434540; background:url("../img/arrow_grey.gif") no-repeat 100% 60%; text-decoration:none; }

#about #nav_sub ul li.active { color:#537da7; background:url("../img/arrow_bl.gif") no-repeat 100% 60%; }
#news #nav_sub ul li.active { color:#c14603; background:url("../img/arrow_red.gif") no-repeat 100% 60%; }
#port #nav_sub ul li.active { color:#669a33; background:url("../img/arrow_grn.gif") no-repeat 100% 60%; }
#contact #nav_sub ul li.active { color:#e67f05; background:url("../img/arrow_orng.gif") no-repeat 100% 60%; }

#footer { font-size:.7em; width:100%; }
#copyright { width:30%; text-align:right; padding-right:1px; }
#quotes { width:70%; }
#quotes p { color:#cccbbd; width:600px; padding-top:50px; }
#site_info p { color:#cccbbd; padding-right:8px; }

/* homepage */
#index #branding #tagline { display:none; }
#home { width:824px; }
#index #nav_sub { text-align:left; }
#index #join { position:absolute; top:411px; right:0; }
#index #details { font-size:.9em; }

#index #news { position:relative; }
#index #news h3 { color:#fff; }
#index #news p { color:#fff; }
#index #news p a { color:#fc0; }

/* content pages */
#inner { width:824px; background-color:#fff; }
#content { position:relative; padding:20px; min-height:340px; }
#imgRt { float:right; width:223px; padding-left:20px; margin-right:1px; }

.clients { width:784px; }
.clients td { width:22%; padding:5px 10px 5px 0; }
#about .divider { border-top:1px solid #537DA7; }
#news .divider { border-top:1px solid #e95c10; }
#index #news .divider { border-top:1px solid #999; }
#contact #form { position:absolute; top:20px; left:280px; width:300px; }
#form label { display:block; padding-bottom:3px; width:100%; float:left; }
#form label span { float:left; width:30%; padding-right:5px; text-align:right; }
#form label input { width:65%; }
#form label input.sm { width:30%; }
#contact #form textarea { width:290px; margin-bottom:5px; }
#contact #form input.btn { width:52px; margin-left:240px; }

/* general */
.callout01 { margin-top:15px; border:1px solid #f2880a; background-color:#FDEDB4; padding:15px; width:180px; }
ul.normal { list-style-type:disc; margin:0 0 1em 15px; }
ul.normal li { padding-bottom:.5em; line-height:1.6em; }
.divider { padding-top:1em; margin-top:1em; border-top:1px solid #fff; }

/* portfolio */
#nav_proj { position:absolute; bottom:0; right:224px; }
#nav_proj ul li { display:inline; padding-left:5px; border-right:1px solid #fff; font-size:.9em; }
#nav_proj ul li.active { color:#afd885; font-weight:bold; padding:0 2px 0 7px; }
#nav_proj ul li a { color:#cccbbd; padding:2px; }
#nav_proj ul li a:hover { color:#fff; text-decoration:none; }

#thumb1, #thumb2, #thumb3, #thumb4, #thumb5, #thumb6 { position:absolute; top:435px; border-right:1px solid #fff; }
#thumb1 { left:0px; }
#thumb2 { left:100px; }
#thumb3 { left:200px; }
#thumb4 { left:300px; }
#thumb5 { left:400px; }
#thumb6 { left:500px; }
#arrow1, #arrow2, #arrow3, #arrow4, #arrow5, #arrow6 { position:absolute; top:430px; }
#arrow1 { left:48px; }
#arrow2 { left:148px; }
#arrow3 { left:248px; }
#arrow4 { left:348px; }
#arrow5 { left:448px; }
#arrow6 { left:548px; }

#project { width:824px; background:url("../img/porthead-bg.gif") no-repeat top right; }
#project h2 { color:#fff; font-size:1.1em; margin-top:6px; }
#details { float:right; width:208px; padding-left:15px; }
#details p { margin-top:1.5em; }

#port .thumb { float:left; display:inline; margin:5px 20px 0 0; width:180px; }
#port .thumb h2 { margin-top:.5em; }
#port .thumb a { color:#666; font-size:.9em; line-height:1em; }
#port .thumb a:hover { color:#669a33; text-decoration:none; }

/* ######### drop down menus ######### */
.menu { position:absolute; left:0; top:0; visibility:hidden; font: normal 11px "Trebuchet MS"; line-height: 18px; z-index:999; } /* zIndex should be greater than that of shadow's below */
.menu ul { margin:0; padding:0; list-style-type: none; border-bottom:1px solid #fff; }
.menu ul li a { width:100%; display: block; color:#fff; text-indent:36px; padding: 4px 0 0 0; height:21px; text-decoration:none; background:#979992; }
.menu ul li a { color:#fff; }
.menu ul li a:hover { color:#282b20; }

.portdd { visibility:hidden; width:160px; }
.aboutdd { visibility:hidden; width:140px; }
.contactdd, .newsdd { visibility:hidden; width:110px; }

.portdd ul li a { background:url("../img/nav/portbg.gif") no-repeat; }
.aboutdd ul li a { background:url("../img/nav/urbanbg.gif") no-repeat; }
.newsdd ul li a { background:url("../img/nav/aboutbg.gif") no-repeat; }
.contactdd ul li a { background:url("../img/nav/contactbg.gif") no-repeat; }

.portdd a:hover { background: url("../img/nav/portbg-o.gif") no-repeat; }
.aboutdd a:hover { background:url("../img/nav/urbanbg-o.gif") no-repeat; }
.newsdd a:hover { background: url("../img/nav/aboutbg-o.gif") no-repeat; }
.contactdd a:hover { background: url("../img/nav/contactbg-o.gif") no-repeat; }

/* ######### class for shadow DIV ######### */
/*CSS for shadow. Keep this as is */
.anylinkshadow { position: absolute; left: 0; top: 0; z-index: 99; /*zIndex for shadow*/background: black; visibility: hidden; }
.handcursor { cursor:hand; cursor:pointer; }