/* Grasty Design Stylehsheet */

/* Meta */

h1,h2,h3,h4,h5,h6,p {padding:0; margin:0;}
p {font-family:Arial, Helvetica, sans-serif; font-size:12px; line-height:21px; color:#696969; margin:0 0 15px 0;}
p strong {font-weight:bold;}
p a, a:visited {text-decoration:none; color:#000;}
p a:hover {color:#000; text-decoration:underline;}
.orange {color:#ca966b;}

a:focus { outline: none; }

body {background:#2e2e2e url(background.jpg) top center no-repeat; margin:0; padding:0; text-align:center;}
div#container {width:820px; margin:40px auto 0 auto; text-align:left;}

/* Menu */

div#menu {width:820px; background:#fff; overflow:hidden;}

div#menu div#items {width:360px; padding:5px; float:right;}

div#menu div#items div#about a {
width:66px; height:43px; display:inline; float:left; text-indent:-9999px; background:url(menu/about_off.gif) no-repeat; cursor:pointer;}
div#menu div#items div#about a:hover {
text-indent:-9999px; background:url(menu/about_on.gif) no-repeat;}
div#menu div#items div#services a {
width:85px; height:43px; float:left; text-indent:-9999px; background:url(menu/services_off.gif) no-repeat; cursor:pointer;}
div#menu div#items div#services a:hover {
text-indent:-9999px; background:url(menu/services_on.gif) no-repeat;}
div#menu div#items div#portfolio a {
width:96px; height:43px; float:left; text-indent:-9999px; background:url(menu/portfolio_off.gif) no-repeat; cursor:pointer;}
div#menu div#items div#portfolio a:hover {
text-indent:-9999px; background:url(menu/portfolio_on.gif) no-repeat;}
div#menu div#items div#contact a {
width:83px; height:43px; float:left; text-indent:-9999px; background:url(menu/contact_off.gif) no-repeat; cursor:pointer;}
div#menu div#items div#contact a:hover {
text-indent:-9999px; background:url(menu/contact_on.gif) no-repeat;}

/* Promo Area */

div#promoarea {width:820px; height:287px; float:left; clear:both; position:relative;}
div#promoarea div#logo {position:absolute; top:-53px; left:20px; z-index:4;}
div#promoarea div#logo a img {border:none;}
div#promoarea div#statement {position:absolute; bottom:0; left:0px;}
div#promoarea div#imagearea {float:left;}

/* Main Content Area */

div#mainarea {width:804px; float:left; padding:8px; clear:both; background:#fff; overflow:hidden;}
div#content {width:786px; float:left; padding:8px 8px 10px 8px; border:1px solid #dedede;}

/* Full Column Home Page */

div#content div#fullcolumn {width:786px; float:left;}
div#content div#fullcolumn h2#home_readmore a {
width:187px; height:40px; margin:5px 0 10px 200px; float:left; text-indent:-9999px; background:url(homepage/readmore_off.gif) no-repeat; cursor:pointer;}
div#content div#fullcolumn h2#home_readmore a:hover {
text-indent:-9999px; background:url(homepage/readmore_on.gif) no-repeat;}
div#content div#fullcolumn h2#home_services a {
width:187px; height:40px; margin:5px 0 10px 0; float:left; text-indent:-9999px; background:url(homepage/services_off.gif) no-repeat; cursor:pointer;}
div#content div#fullcolumn h2#home_services a:hover {
text-indent:-9999px; background:url(homepage/services_on.gif) no-repeat;}

/* Left Column */

div#content div#leftcolumn {width:435px; float:left; padding:10px 15px 5px 5px;}
div#content div#leftcolumn div#leftcolumn1 {width:200px; float:left; margin:10px 20px 0 0;}
div#content div#leftcolumn div#leftcolumn2 {width:200px; float:left; margin:10px 0 0 0;}

/* Right Column */

div#content div#rightcolumn {width:306px; padding:18px 12px 15px 12px; float:left; background:#f1f2f2;}

/* Portfolio Right Column */

div#content div#port_rightcolumn {width:330px; float:left; background:#fff;}

div#content div#port_rightcolumn div#projlist {background:#f1f2f2; width:306px; padding:15px 12px 15px 12px; clear:both; }

div#content div#port_rightcolumn div#projlist ul#portlist {width:306px; margin:0; padding:0; list-style:none;}
div#content div#port_rightcolumn div#projlist ul#portlist li {
height:20px; padding:2px 0 4px 6px; margin:0; border-top:1px solid #deded9;}
div#content div#port_rightcolumn div#projlist ul#portlist li.bottom {
border-top:1px solid #deded9; border-bottom:1px solid #deded9;}
div#content div#port_rightcolumn div#projlist ul#portlist li a, a:visited {
font-family:Arial, Helvetica, sans-serif; font-size:11px; color:#848282; text-decoration:none;}
div#content div#port_rightcolumn div#projlist ul#portlist li a:hover {
color:#000;}
div#content div#port_rightcolumn div#projlist ul#portlist li.active a {
font-weight:bold; color:#ca966b;}

/* Services RIght Column */

div#content div#rightcolumn ul#serviceslist {width:306px; margin:0; padding:0; list-style:none;}
div#content div#rightcolumn ul#serviceslist li {
height:20px; padding:5px 0 1px 6px; margin:0; border-top:1px solid #deded9;}
div#content div#rightcolumn ul#serviceslist li.bottom {
border-top:1px solid #deded9; border-bottom:1px solid #deded9;}
div#content div#rightcolumn ul#serviceslist li {
font-family:Arial, Helvetica, sans-serif; font-size:11px; color:#848282; text-decoration:none;}

/* Next and Previous Buttons Alternative */

div#promoarea div#mainimage div#dhtml-carousel div#image_select {position:absolute; top:258px; left:687px; width:115px; height:29px; clear:both; z-index:3;}
div#promoarea div#mainimage div#dhtml-carousel div#image_select div#is_prev a{
float:left; text-indent:-9999px; width:56px; height:29px; background:#fff url(portfolio/isprev_off.gif) center no-repeat; text-decoration:none; 
border-right:1px solid #dedede;}
div#promoarea div#mainimage div#dhtml-carousel div#image_select div#is_prev a:hover {
background:#e2e2e2 url(portfolio/isprev_on.gif) center no-repeat;}
div#promoarea div#mainimage div#dhtml-carousel div#image_select div#is_next a {
float:left; margin:0 0 0 0px; text-indent:-9999px; width:56px; height:29px; background:#fff url(portfolio/isnext_off.gif) center no-repeat; text-decoration:none;
border:none;}
div#promoarea div#mainimage div#dhtml-carousel div#image_select div#is_next a:hover {
color:#74746c; background:#e2e2e2 url(portfolio/isnext_on.gif) center no-repeat;}

/* Text Styles */

p.rightp {font-family:Arial, Helvetica, sans-serif; font-size:11px; line-height:19px; color:#848282; margin:0;}
p.rightp a, a:visited {text-decoration:none; color:#000;}
p.rightp a:hover {color:#000; text-decoration:underline;}
h2#principleheadline {
width:214px; height:9px; padding:0 0 20px 0; text-indent:-9999px; background:url(about/principles_headline.gif) no-repeat;}
h2#principlecontactheadline {
width:208px; height:10px; padding:0 0 20px 0; text-indent:-9999px; background:url(contact/designerinfo_headline.gif) no-repeat;}
h2#selectprojheadline {
width:229px; height:9px; padding:0 0 20px 0; text-indent:-9999px; background:url(portfolio/selectproj_headline.gif) no-repeat; clear:both;}
h2#servicesheadline {
width:123px; height:9px; padding:0 0 20px 0; text-indent:-9999px; background:url(services/ourservices_headline.gif) no-repeat;}
h2.rightheadline {
font-family:Arial, Helvetica, sans-serif; font-size:10px; font-weight:bold; text-transform:uppercase; letter-spacing:1px; clear:both; margin:0 0 8px 0;}

/* Footer */

div#footer {width:820px; float:left; clear:both; background:url(footer/background.jpg) top center no-repeat; padding:15px 0 35px 0;}
div#footer div#fleft {float:left; margin-left:8px;}
div#footer div#fright {float:right; margin-right:8px; width:340px;}

p.footer {float:left; color:#515151; font-family:Arial, Helvetica, sans-serif; font-size:10px; letter-spacing:1px; text-transform:uppercase;}
p.footer a, a:visited {text-decoration:none; color:#515151;}
p.footer a:hover {text-decoration:none; color:#6f6f6f;}

h2#footer_armada a {
width:57px; height:13px; margin:2px 0 0 16px; text-indent:-9999px; float:left; background:url(footer/armada_off.gif) no-repeat; cursor:pointer;}
h2#footer_armada a:hover {
text-indent:-9999px; background:url(footer/armada_on.gif) no-repeat; cursor:pointer;}
